데브허브 | DEVHUB | 5 React Best Practices I Wish I Knew Earlier5 React Best Practices I Wish I Knew Earlier
- 사용자 정의 훅을 활용하여 관련 로직을 캡슐화하고 재사용성을 높여 컴포넌트의 관심사를 분리합니다. 🎣
- 컴포넌트 전반에 걸쳐 타입 정의, 프롭스 접근, 함수 선언 방식, 논리적 구조(상태, 함수, 사이드 이펙트)를 일관되게 유지하여 가독성과 유지보수성을 향상시킵니다. 📐
- 작은 컴포넌트들을 조합하여 더 크고 복잡한 UI를 구성하는 컴포지션 패턴을 통해 각 부분의 역할을 명확히 하고 유지보수를 용이하게 합니다. 🧩
- 명확한 명명 규칙을 따릅니다: 파일명은 케밥 케이스, 타입/인터페이스 및 컴포넌트 이름은 카멜 케이스, 변수/프롭스/함수 이름은 파스칼 케이스를 사용하여 코드 시스템의 일관성과 가독성을 확보합니다. 🏷️
useCallback, useMemo, memo와 같은 수동 최적화 기법은 React Compiler의 등장으로 인해 대부분의 경우 불필요해졌으며, 오히려 코드 복잡성만 증가시킬 수 있어 이제는 배우는 것을 후회하는 베스트 프랙티스입니다. ♻️