1. new Arrayex> new Array('a') 이때 new 없이 Array('a')만 선언해도 똑같이 배열을 생성한다. 2. Array.from()Array.from()은 이터러블객체(반복 가능한 객체)를 인수로 받아 배열로 변환한다.ex> Array.from('food') // [ 'f','o','o','d' ] Array.from([100,200,300] , a=>a+a); // [200, 400 , 600]또한 특정길이의 배열을 만들어서 연속 된 수를 넣을 수도 있다고 한다.Array.from ({length: 길이}, Func(_, i )} -> a 길이의 유사배열객체를 생성한다. ex> Array.from({length: 4}, ()=>[]); // 4 길이만큼..

react-hook-form 을 이용해 폼 작성을 구현하는 도중에  이미 기초값이 있는 폼 필드에서 새로운 값으로수정을 하려면 해당 필드를 찾아야 했다. 그래서 처음엔 watch 속성을 사용했다. const counselTime = watch('counselTime') ( field.onChange(e.target.value)} />)} /> watch는 폼의 입력 값이 변경될 때마다 특정 값을 반환한다. 예를 들어 5개의 input이 있을때 하나의 input 값만 바뀌어도 5개 모두 다 리렌더링이 되버려서 성능 최적화에 적합하지 않는다는 것! 공식 문서에도 이렇게 나와있는 걸 볼 수 있다.' watch는 호출될 때 어플리케이션 또는 Form을 전부 리렌더링하므로 성능 이슈가 발생한다면 ..

이 textinput에 값을 입력하고 추가 버튼을 누르면 해당 필드 값이 초기화가 되어야하는데!!자꾸 안되는거다... 이전 값이 남아있다.. 그래서 어디에서 막힌건지 콘솔값을 찍어봤을때 입력하고 추가버튼을 누르면 ""로 초기화가 잘되고 있는 것 같은데 필드에는 여전히 남아있는 이슈..,,  const handleKeywords = () => { if (keyword.trim() === "") { // console.log("키워드가 비어 있음"); return; } if (!keywords.includes(keyword)) { const newKeywords = [...keywords, keyword]; setKeywords(newKeywords); ..

className을 지정한다음 css를 설정하려고 할때import styles from "./TodoItem.style.scss";import cn from "classnames/bind";이 부분에서 "Cannot find module './TodoItem.style.scss'" 에러가 난 적이 있다. 분명 맞는 경로, 파일명도 잘 맞췄다. 근데 모듈을 찾을 수가 없다? 알고보니 타입스크립트는 .scss 같은 CSS 파일을 JavaScript 모듈로 처리하지 않기 때문에 정의 파일 (.d.ts)을 만들어줘야 한다는 것이다. 그래야 타입스크립트가 .scss 파일을 객체 형태의 모듈로 인식한다. // src/types/style.d.tsdeclare module "*.scss" { const conten..

기본적인 crud를 다 구현하고 Postman으로 테스트할때 만약 에러가 발생했을 시 어떠한 이유때문에 발생한건지예외처리는 필수다. 안그러면 하나하나 로그를 다 찍으면서 계속 서치해야하기 때문이다. 나는 서비스 레이어에서 HttpException라는 커스텀 에러 클래스를 사용해 에러를 던져줬다.async getUser(id: string): Promise { const user = await this._userRepository.findById(id); if (!user) throw new HttpException(404, "해당 유저가 없습니다."); const dtoUser = await new GetUserResponseDTO(user); return dtoUse..

백엔드를 하다보면 예외처리를 필수로 해줘야 한다.주로 try & catch문으로 성공과 실패 처리 로직을 작성해준다.next.js와 node.js를 이용해서 백엔드를 구현했을때를 살펴보자. next(Error)란?-> Express의 에러 처리 미들웨어로 에러를 전달하는 방식 주로 컨트롤러 레이어에서 사용한다.예를 들어 인증 api를 구현할때 /api/auth/controller/auth.controller.tsasync login(req: Request, res: Response, next: NextFunction) { try { const { loginId, password } = req.body; const result = await this._authService.login..