프론트엔드✏️/개인공부

[공통 컴포넌트,css]글자수 체크하는 Input창, x 초기화 버튼 Input, 테두리 겹치는 부분

글자수 체크하는 Input창 만들기 import { useState } from "react"; const CheckInput = ({ text = "체크 Input", typeClassName = "", sizeClassName = "", ...props }) => { const [length, setLength] = useState(0); const getTextLength = (event) => { setLength(event.target.value.length); // event.target.value의 길이로 설정 if (event.target.value.length >= props.maxLength) { // 자음 하나씩 더 입력돼서 11/10 이렇게 뜨길래 설정함 setLength(props..

공통 컴포넌트 만드는 중

import './DefaultBtn.scss' const DefaultBtn = ({ text = "Button", icon = null, typeClassName = "", sizeClassName = "", ...props }) => { return ( {icon && {icon}} {text} ) } export default DefaultBtn; const DefaultInput = ({ text = "기본 Input", typeClassName = "", sizeClassName = "", ...props }) => { return ( ); }; export default DefaultInput;

[react-query] 리액트 쿼리

React Query is often described as the missing data-fetching library for React, but in more technical terms, it makes fetching, caching, synchronizing and updating server state in your React applications a breeze. 서버 상태를 클라이언트로 가져올 수 있다. 캐싱, 동기화, 에러핸들링 등 비동기 과정을 더욱 편하게 사용할 수 있다. ?캐싱? 데이터는 업데이트 되고 있지만 요청은 날리지 않는 것 yarn add react-query react-query를 설치한다. import { useQuery } from "react-query"; cons..

[알고리즘] 최소직사각형

https://school.programmers.co.kr/learn/courses/30/lessons/86491 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr // 내가 푼 풀이 function solution(sizes) { console.log(sizes.map((el)=> { return el.sort((a,b)=> b-a) })) let w = []; let h = []; for(let i = 0 ; i w { if..

부트캠프 84일차, 팀 프로젝트 발표날

오늘 드디어 발표 발표가 나라서 실수할까봐 너무 떨린다...! 들을 때 같은 걸 계속 보니 힘들었던 기억이 있어서, 조금이나마 재밌게 발표해보려고 노력했다. 지금 3시 58분인데 백엔드 수업이 늦게 끝나서 발표가 좀 미뤄졌대...! 42분이고 세번째 조 발표를 듣고 있다. 7-10분 정도로 발표를 준비하라고 들었어서, 내가 한 30분쯤엔 발표시작했을 줄 알았다. 발표하고 왔다아아아악 5시 1분에 들어가서 Q&A까지 15분 정도 발표했다. 하고왔는데 격렬하게 박수쳐주셔서 기뻤다..ㅎㅎ (이걸로 민원 들어오긴 했음) ppt랑 발표랑 너무 잘했다고들 하셔서 너무 기뻤다!!!!!!! 난 ppt에 약간 진심인 편이라서, ppt에 대한 칭찬이 참 좋다. (물론 ppt 게임 흐름 말고 나머지 부분은 거의 영쥬가 했다..

에러잡기

if ( data?.fetchReservationsUser.filter( (ele: IFetchReservationData) => ele.theme_menu.theme?.id === router.query.id ).length === (0 || undefined) ) { setIsReviewer(false); } console.log("2", isReviewer); 여기서 (0 || undefined) 를 하니 댓글을 달 수 없는 상황이 생겼다. 일단 length === 0 으로 바꾸긴 했는데 mui 컬러가 풀리는 문제... 새로고침하면 괜찮아지긴 하는데, 사용자 입장에서 생각해보면 너무 안 좋을 것 같다ㅠㅠ 어떤게 문제인지 이건 감도 안온다. 그냥 mui에 넣어놓은 속성 중 하나가 풀리는 거라!

함수형 프로그래밍?

함수형 프로그래밍만을 위한 함수형에 특화된 언어도 있고, 자바 스크립트, 자바, 코틀린, 고, C++ 등... 객체지향+함수형 지원하는 언어도 있다. 1958년 LISP 라는 첫번째 함수형 언어가 나왔다. 객체지향언어보다 일찍 나왔다. 수학의 원리와 밀접하게 연관이 있어서 배우는데 시간이 걸리고 난해할 수 있다. 그래서 사람의 사고방식과 가장 가까운 절차지향프로그래밍, 객체지향 프로그래밍이 더 보편적으로 쓰였다. 하지만 요즘은 방대한 데이터를 빠르게 다뤄야하고(비트코인 등) 그러다보니 함수형 프로그래밍 언어가 다시 주목을 받기 시작했다. 함수 - INPUT 넣으면 FUNCTION(처리과정) 통해 OUTPUT이 나온다. 외부와 내부(function)은 이어져있지 않다. 함수형 프로그래밍 특징, 조건 순수 ..