NextJs 간단한 폴더구조 생성

1. 개요

전에 만들었을 때에는 pages를 포함한 주소가 만들어져 마음이 불편 했지만, 찾았다. 최적의 폴더구조를...

현재 만들고 있는 로그인/회원가입 폼이다. shadcn과 react-hook-form, zod를 사용할 예정이고, 차차 블로그에도 올릴 예정이다. 폴더 구조는 이렇다.

 

2.폴더 구조

전과 다르게 app폴더가 없고 src > pages로 들어간다. 여기에 custom app과 custom document를 만들어서 전역으로 관리해야 되는 것들을 추가할 때 효과적으로 사용하면 되고, src > pages > index.tsx를 만들면 기본 경로가 된다. 

 

3.페이지 라우팅

페이지 라우팅을 하려면 pages폴더안에 라우팅할 폴더를 만들면 가능하다.

나는 signUp 폴더를 생성했고, index.tsx를 만들면 이 부분이 signUp 경로의 컴포넌트가 된다.

 

 

4. 마무리

app대신 pages를 사용하는 폴더구조가 나는 더 간단하다고 생각하지만 사실은 잘 모르겠다. 여러 프로젝트를 하면서 각자가 사용하는 폴더구조가 있어서 그것을 협의하느라 시간을 썻던 기억이 있다. 이렇게 협의점을 찾으면서 더 좋은 폴더구조를 공유하고, 서로서로 발전한다면 좋은게 좋은거 아닐까?