프로젝트 폴더 구조

폴더 구조

• components
• 컴포넌트 : 해당하는 컴포넌트 이름으로 폴더를 구성합니다.
• 컴포넌트.tsx : 컴포넌트 전반적인 구조 및 로직을 정의합니다.
• 컴포넌트.styles.ts : 컴포넌트의 스타일을 정의합니다.
• index.ts : 컴포넌트 export 할 때 사용합니다.
• types.ts : 컴포넌트에서 사용하는 타입을 정의합니다.
• index.ts : 모든 컴포넌트를 export 합니다.

• pages

next 페이지 라우팅 구조를 살펴보세요

• users
• [id].tsx
• login
• index.tsx

• api
• API에 관한 파일들을 모아두는 폴더입니다.

• hooks
• 공통으로 사용할 수 있는 훅을 정의해두는 폴더입니다.

• recoil
• 리코일 관련 파일을 모아두는 폴더입니다.
• users : 해당하는 리코일 폴더 명을 적어줍니다.
• atoms
• selector

• constants
• 상수를 정의합니다.

• utils
• 유틸 함수들을 정의합니다.

• types
• api interface와 같은 공통으로 사용할 수 있는 타입을 정의합니다.