Nuxt.js 웹 프로젝트 시작하기

 

1. Node.js 설치(모든 작업에서 선행되어야함)

- 노드 사이트에서 LTS 버전을 손쉽게 설치한다..(Next > Next > 수준으로 쉽게 설치 가능)

- 작성기준 Node의 버전은 "10.16.3 LTS"

https://nodejs.org/en/

 

2. 프로젝트 생성

- yarn을 이용하여 프로젝트를 구성하려면 "npm install -g yarn" 글로벌 옵션으로 yarn 설치(현시점 1.19.1 버전)

- 실제 프로젝트 생성(명령 프롬프트 현재 디렉토리에 생성됨)

 1) "yarn create nuxt-app <생성할프로젝트 디렉토리>"

 2) or.... "npx create-nuxt-app <생성할프로젝트 디렉토리>"

 3) or.... "npm init nuxt-app <생성할프로젝트 디렉토리>"

 

3. 프로젝트 옵션 선택(필요에 따라 선택하면됨)

- 프로젝트명: 엔터!

- Description : 엔터!

- Author name : 엔터!

- Package Manager : NPM (아직까진 npm 이 익숙하다 ㅜㅜ)

- UI framework : None(퍼블리셔 가이드에 따를 예정이라.. 미선택!)

- Server framework : None(굳이 필요없을듯..)

- Nuxt.js modules : Axios

- linting tools : ESLint (조금만 잘못되면 경고와 에러가 마구 뜨므로... 신중하게 선택해야할듯)

- Test Framework : Jest

- Render mode : Universal(SSR)

- Development tools : jsconfig.json (VS Code 를 사용할거라서 선택)

 

4. Nuxt 프로젝트 시작

친절하게도 설치직후 To get started, To build & start, To test 등.. 할 수 있는 명령어가 뜬다..

명령어는 옵션에 따라 변경가능할듯하지만 우선..

 1)To get started

  - cd <생성된프로젝트 디렉토리> : 프로젝트 루트 경로로 이동

  - npm run dev : 로컬에서 개발모드로 웹 프로젝트 실행

 

 2)To build & start

  - cd <생성된프로젝트 디렉토리> : 프로젝트 루트 경로로 이동

  - npm run build : 프로젝트 소스를 빌드한다(.nuxt 디렉토리 생성..)

  - npm run start : node 런타임 환경에서 웹서버 스타트하여 nuxt 프로젝트 실행..

 

 3) To test

  - cd <생성된프로젝트 디렉토리> : 프로젝트 루트 경로로 이동 

  - npm run test : 프로젝트 테스트 수행

 

이러면 아주 친절하게 프로젝트 기본 구성이 완성됨.. 당연히 인터넷이 되는 환경이여야 하지만.. 매우편하다.

인터넷이 안되는 환경이라면.. 인터넷이되는 PC에서 프로젝트 구성하고 내부망PC에 정식 반입 절차를 거쳐서 반입시켜야할듯..

무튼 인터넷이 되는 환경이여야 원활한 진행이 될듯하다.