인프라 구축 Test (on 로컬) - [Github] Windows10에 Next.js 프로젝트 실행

 

목표
Windows10 pc의 아파치와 Next.js를 연동하여 FrontEnd 환경 구축

 

Next.js란

Next.js는 React 컴포넌트 기반의 웹 프레임워크로, Node.js 환경에서 실행되며
서버 사이드 렌더링(SSR)과 정적 사이트 생성(SSG)을 지원한다.

- React 기반: 재사용 가능하고 모듈화된 코드를 작성할 수 있게 해준다. 효율적인 방식으로 UI를 작성할 수 있다.

 

 

Next.js 프로젝트를 내려받아 실행하기

0. Node.js 설치

 

1. Github FrontEnd > Download ZIP > 압축해제

 

 

2. package-lock.json 삭제

 

 

3. 패키지 설치 및 실행

• 해당 프로젝트 폴더에서 터미널 창 열기

 

 

• npm install

: Next.js 프로젝트 시작에 필요한 종속성을 설치한다

package.json 파일에 명시된 종속성들을 설치하여 프로젝트가 필요로 하는 라이브러리나 도구를 사용할 수 있게 해준다.

 

• npx next build

: Next.js 애플리케이션을 빌드하여 배포할 수 있는 형태로 만든다.

애플리케이션의 소스 코드를 최적화된 정적 파일로 변환하고, 효율적으로 실행 가능한 형태로 빌드한다.

빌드된 파일은 일반적으로 .gitignore > .next 디렉터리에 저장된다.

 

• npx next start

빌드된 Next.js 애플리케이션을 서버로 실행한다.

프로덕션 서버를 시작하여 애플리케이션을 호스팅하고 사용자 요청을 처리한다.

 

• http://localhost:3000/

브라우저에서 실행한다.

 

4. 종료

서버를 종료하려면 터미널에 Ctrl + C 단축키를 누른다.

일괄 작업을 끝내시겠습니까 (Y/N)? 메세지가 나오면 Y를 입력한다.