• React: 컴포넌트 기반 아키텍처를 제공하여 재사용성과 유지보수성을 높입니다. 풍부한 생태계를 통해 다양한 기능을 쉽게 확장할 수 있습니다.
• Typescript: 정적 타입 검사를 통해 코드의 안정성과 가독성을 향상시킵니다. 개발 중 오류를 미리 잡아주어 디버깅 시간을 단축합니다.
• Next.js: 서버사이드 렌더링(SSR)과 정적 사이트 생성(SSG)을 지원하여 SEO와 성능을 최적화합니다. 파일 기반 라우팅으로 프로젝트 구조를 간결하게 유지할 수 있습니다.
• Zustand: 간단하고 직관적인 API로 상태 관리를 쉽게 할 수 있습니다. 불필요한 리렌더링을 방지하여 성능을 향상시킵니다.
• Tanstack Query: 서버 상태 관리와 데이터 페칭을 효율적으로 처리합니다. 캐싱, 동기화, 업데이트 등을 자동으로 관리하여 코드 복잡도를 낮춥니다.
• Axios: HTTP 요청을 단순하고 직관적으로 처리할 수 있습니다. Promise 기반 API를 제공하여 비동기 작업을 쉽게 다룰 수 있습니다.
• React-hook-form: (비제어 컴포넌트로 활용한다면) 최소한의 리렌더링으로 고성능 폼 관리를 제공합니다. 직관적인 API로 폼 검증과 상태 관리를 간편하게 처리할 수 있습니다.
• Styled-Components: 컴포넌트 단위의 스타일링을 통해 코드의 응집도를 높입니다. 동적 스타일링과 테마 기능을 쉽게 구현할 수 있습니다.
• Stylelint: 스타일 규칙을 정의하고 코드 일관성을 유지합니다. 자동화된 스타일 검사를 통해 코드 품질을 향상시킵니다.
• Browserslist: 지원할 브라우저 범위를 정의하여 호환성을 관리합니다. Babel, Autoprefixer 등과 연동하여 최신 기능을 안전하게 사용할 수 있습니다.
• ESLint: 코드의 일관성과 품질을 유지하기 위해 린팅 규칙을 정의합니다. 코드 작성 시 실시간으로 오류를 잡아주어 디버깅 시간을 절약합니다.
• Prettier: 코드 포매팅을 자동화하여 일관된 스타일을 유지합니다. 팀 내 코드 스타일 차이를 줄여 협업 효율을 높입니다.
• Husky: Git 훅을 관리하여 커밋 전 린트 검사, 테스트 실행 등을 자동화합니다. 코드 품질을 유지하고 협업 효율을 높입니다.
• Git: 분산 버전 관리 시스템으로 코드 변경 이력을 추적하고 협업을 원활하게 합니다. 브랜칭과 병합을 통해 다양한 작업 흐름을 지원합니다.
• Jest: 간단하고 직관적인 API로 테스트를 작성할 수 있습니다. 강력한 모킹 기능을 통해 유닛 테스트와 통합 테스트를 쉽게 수행합니다.
• Storybook: 컴포넌트 개발을 독립적으로 테스트하고 문서화합니다. UI 컴포넌트를 시각적으로 관리하여 개발 효율성을 높입니다.
• SVGR: SVG 파일을 React 컴포넌트로 변환하여 사용합니다. SVG 파일을 쉽게 재사용하고 관리할 수 있습니다.
• MSW (Mock Service Worker): API 요청을 모킹하여 테스트 환경을 설정합니다. 실제 서버와의 상호작용 없이 클라이언트 측 기능을 검증할 수 있습니다.