2. 개발 환경 설정하기
2장: 개발 환경 설정하기
이번 장에서는 Next.js 프로젝트를 시작하기 위해 필요한 개발 환경 설정에 대해 알아보겠습니다. 이를 통해 다음.js 프로젝트를 진행할 수 있는 탄탄한 기반을 마련할 것입니다.
1. Node.js 설치
Next.js는 Node.js 기반의 프레임워크이므로, 먼저 Node.js를 설치해야 합니다. Node.js는 공식 웹사이트에서 다운로드할 수 있습니다. 가능한 LTS(Long Term Support) 버전을 설치하는 것이 좋습니다.
# Node.js 설치 여부 확인
node -v
설치가 완료되면 터미널에서 위 명령어를 실행하여 버전을 확인해봅니다. 문제가 없다면, 다음 단계로 진행할 수 있습니다.
2. Visual Studio Code 설치
개발 환경에서 사용할 코드 편집기는 Visual Studio Code(이하 VSCode)를 추천합니다. VSCode는 무료이면서도 강력한 기능을 제공합니다. VSCode 다운로드 페이지에서 설치 후 실행해 주세요.
3. Next.js 프로젝트 생성
이제 Next.js 프로젝트를 생성할 준비가 되었습니다. 터미널을 열고 아래 명령어를 통해 새로운 Next.js 프로젝트를 만듭니다.
npx create-next-app@latest my-next-app
위 명령어를 실행하면 Next.js 프로젝트 생성 마법사가 실행됩니다. 각종 옵션을 설정하고, 타입스크립트를 사용할지 여부 등을 입력합니다.
4. 프로젝트 실행
생성된 프로젝트 디렉토리로 이동한 후, 개발 서버(dev server)를 실행합니다.
cd my-next-app
npm run dev
5. 브라우저에서 실행 확인
터미널에 나타난 개발 서버 URL(보통 http://localhost:3000
)을 브라우저에서 열어서 Next.js의 환영 페이지를 확인하면 성공적으로 개발 환경 설정이 완료된 것입니다.
결론
이 챕터에서는 Next.js 프로젝트를 시작하기 위한 환경 설정 단계를 살펴보았습니다. Node.js 설치, VSCode 다운로드, Next.js 프로젝트 생성 및 기본 실행까지 모든 프로세스를 배우셨습니다. 이제 이러한 설정을 통해 Next.js 프로젝트를 시작해보세요!