Next.js
React기반의 풀스택 웹 프레임워크
Npm
npx create-next-app@latest .
폴더 구조
.
├─ app/
│ ├─ favicon.ico
│ ├─ globals.css
│ ├─ layout.tsx
│ └─ page.tsx
│
├─ public/
│
├─ .gitignore
├─ next.config.js
├─ package.json
├─ package-lock.json
├─ tsconfig.json
└─ eslint.config.mjs
app 폴더
○ next.js의 App Router에서 사용하는 핵심 폴더로, 페이지, 레이아웃, API 라우트 등을 파일 기반 시스템으로 자동 라우팅하는 곳.
○ URL이 루트일 경우 app/page.tsx가 페이지 컴포넌트가 되고, URL이 /login일 경우 app/login.page.tsx가 페이지 컴포넌트가 된다.
public 폴더
○ 이미지, 폰트 같은 정적 파일들을 저장하는 폴더.
커스텀 폴더
○ 루트 경로에 폴더를 만들어 사용한다.