728x90 반응형 TIL with Programmers72 [TIL] 11/20 2024. 11. 24. [TIL] 11/21 2024. 11. 21. [TIL] 11/19 1. 경로 관리 - 상대경로 -> 절대경로 만들기 프로젝트를 진행하다보면 경로가 지저분하게 생기고 상대경로로 불러오기 때문에 어디서 불러오고 있는지 파악이 어려워진다. 그래서 CRACO 로 상대경로를 절대경로로 바꾸어서 보기 편하게 만들어보려고 한다. 절대경로로 바꾸어두면 보기도 편하고 디렉토리 구조가 변경되더라도 import 경로를 쉽게 유지/관리할 수 있다. 1.1. CRACO (Create React App Configuration Override) 설치npm i -D @craco/craconpm i -D craco-alias 프로젝트 폴더에 tsconfig.paths.json 파일 만들고(프로젝트 폴더명이 project 라면 project/tsconfig.paths.ts ),기존의 tscon.. 2024. 11. 19. [TIL] 11/18 map 에서 key 가 필요한 이유, 1. map 에서 key 가 필요한 이유map 으로 컴포넌트를 반복해서 렌더링할 경우, 각 컴포넌트에는 key 값을 넣어줘야 한다. 넣어주지 않아도 에러가 나지는 않지만, 개발자 도구를 열어보면 콘솔창에 " Warning: Each child in a list should have a unique "key" prop " 라는 경고 문구를 확인할 수 있다. 그렇다면 key 는 왜 필요한 걸까? 결론부터 말하면 성능 최적화를 위해 필요하다. 리액트는 가상 DOM 을 사용하여 실제 DOM 과 비교하는 방식으로 렌더링 성능을 최적화한다. 리액트는 DOM 을 효율적으로 업데이트하기 위해 실제 DOM 과 비교할 수 있는 가상의 DOM 트리를 만들어 두고, 실제 DOM 과 비교해서 변경된 부분만 실제 DOM .. 2024. 11. 18. 이전 1 2 3 4 5 ··· 18 다음 728x90 반응형
