NextJS 프로젝트 Init

---

🚀 NextJS 프로젝트 초기화

정의

NextJS 프로젝트 초기화는 필요한 패키지를 설치하고 실행 스크립트와 기본 구조를 준비하는 과정이다.

🛠️ 초기화 순서

1. 빈 프로젝트 폴더 생성

2. terminal에서 초기화

package.json 파일을 생성한다.

npm init -y

3. 필요한 라이브러리 설치

npm install react@latest next@latest react-dom@latest

4. 실행 스크립트 추가

package.json의 scripts에 실행 명령을 추가한다.

{
  "scripts": {
    "dev": "next dev"
  }
}

scripts는 프로젝트 실행 시 호출되는 명령이다.

tip

이제 npm run dev로 개발 서버를 실행할 수 있다.

5. 프로젝트 구조 확인

• app : 페이지 관련 파일이 있는 영역
• components : page에서 재사용할 Component 영역
• package.json : package 정보 file
• package-lock.json : package 버전 lock file

🧩 설치 후 확인할 것

• npm run dev가 정상 실행되는지 확인한다.
• app 폴더가 예상한 구조로 만들어졌는지 확인한다.
• 초기 라우팅 경로가 정상 동작하는지 확인한다.

📌 정리

• NextJS 초기화는 필수 의존성과 실행 스크립트를 잡는 과정이다.
• npm init, npm install, npm run dev 흐름을 익히면 된다.
• 프로젝트 구조를 먼저 확인해두면 이후 작업이 편하다.

---

연결문서

• npm
• npx
• Yarn