Vue.js 3 & NodeJS/NodeJS

Node.js 패키지 생성 및 실행 - Node.js package, npm init, npm run

carrotweb 2021. 8. 8. 18:55
728x90
반응형

Node.js의 패키지 만들기

1. C:\workspaces\nodeserver\test1 폴더를 생성합니다.

 

2. 콘솔을 실행하고 C:\workspaces\nodeserver\test1 폴더로 이동합니다.

 

패키지를 생성하기 위해 npm init 명령어를 실행합니다.

npm init

 

npm(Node Package Manager)는 Node.js로 만들어진 모듈을 설치하고 관리해 주는 프로그램입니다.

npm int는 패키지(애플리케이션)를 생성(초기화) 해주는 명령어입니다.

패키지(애플리케이션)의 이름과 버전 같은 몇 가지 정보에 대해 prompt(프롬프트) 합니다.

기본 설정으로 처리하겠습니다.

변경하려면 입력하고 엔터키를 누릅니다. 기본 값을 사용하려면 그냥 엔터키를 누릅니다.

package name는 패키지 명입니다. (test1)는 기본 값으로 폴더 명입니다.

version는 패키지 버전입니다. (1.0.0)는 기본 값입니다.

description는 패키지에 대한 설명입니다. 그냥 "test"로 입력했습니다.

entry point는 시작 파일 명입니다. (index.js)는 기본 값입니다.

test command는 npm test를 호출할 때마다 실행되는 명령입니다.

git repository는 패키지가 저장되어 있는 Git 저장소의 URL입니다.

keywords는 패키지의 키워드입니다.

author는 원작자의 이름입니다. 여러분의 이름이나 아이디를 입력하면 됩니다.

license는 패키지 사용에 대한 라이선스입니다. (ISC)는 기본 값입니다.

 

 

 

C:\workspaces\nodeserver\test1 폴더에 package.json 파일이 생성됩니다.

{
  "name": "test1",
  "version": "1.0.0",
  "description": "test",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "carrotweb",
  "license": "ISC"
}

 

 

npm install

패키지를 설치하는 명령어입니다.

npm install 패키지@버전

@버전을 입력하지 않으면 패키지의 최신 버전으로 설치됩니다.

 

 

Express.js 설치하기

 

Express.js는 Node.js에서 HTTP와 관련된 컴포넌트를 기반으로 하는 웹 애플리케이션 프레임워크입니다.

현재 패키지(애플리케이션)에 Express.js를 설치하기 위해 콘솔에서 npm install 명령어를 실행합니다.

npm install express --save

 

npm install에 옵션으로 --save를 추가하면 자동으로 package.json 파일의 "dependencies"에 "express" 항목이 추가됩니다.

{
  "name": "test1",
  "version": "1.0.0",
  "description": "test",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "carrotweb",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1" --> 추가
  }
}

 

C:\workspaces\nodeserver\test1 폴더에 node_modules 폴더가 생성되고 관련 모듈들이 추가됩니다. 그리고 package.json 파일의 "dependencies"에 "express"가 추가되고 package-lock.json 파일이 생성됩니다.

package-lock.json 파일은 node_modules에 있는 모듈들에 대한 버전 정보들을 가지고 있습니다. 이 버전 정보들은 설치되는 모듈 간의 의존성 처리에 사용됩니다. 그리고 npm install 명령어를 이용해 모듈들을 설치할 때마다 package-lock.json 파일은 업데이트됩니다.

 

Node.js의 패키지(애플리케이션)에 Entry Point 파일 만들기

1. C:\workspaces\nodeserver\test1 폴더에 index.js 파일을 생성합니다. index.js는 npm init 명령어 실행에서 "entry point"로 입력한 시작 파일 명입니다.

 

2. index.js를 오픈하여 위에서 설치한 express.js를 이용하여 간단하게 웹 요청을 받아 처리하고 응답하게 코딩합니다.

const express = require('express');
const app = express();
const port = 8080;

app.get('/', (req, res) => {
	res.send('Hello Node.js!');
});

app.listen(port, () => {
	console.log('Listening...');
});

 

Importing and creating modules

require() 메서드는 다른 모듈을 가져옵니다. 여기서는 express를 가져옵니다.

express 애플리케이션을 만들기 위해 가져온 express를 호출합니다.

app.listen([port[, host[, backlog]]][, callback])

app.listen() 메서드는 지정된 port, host로 접속할 수 있게 바인드(bind) 하고 대기(listen) 합니다. Node.js의 http.Server.listen() 메서드와 동일합니다.

app.get( path, callback )

app.get() 메서드는 지정된 경로에 대한 모든 유형의 HTTP 요청에 대해 실행됩니다. 테스트를 위해 경로를 전체("/")로 하였습니다.

Node.js의 패키지(애플리케이션) 실행하기

1. 콘솔에서 node index.js를 실행합니다.

 

"Windows 보안 경고"창이 나타나면 "액세스 허용"을 클릭합니다.

 

2. 웹 브라우저에서 "http://localhost:8080"를 입력합니다.

페이지에 "Hello Node.js!"가 출력되는 것을 확인할 수 있습니다.

3. Node.js를 종료는 콘솔에서 Ctrl + C를 누르면 됩니다.

 

npm으로 실행하기 위해 Script 추가하기

C:\workspaces\nodeserver\test1 폴더에 package.json 파일을 오픈하여 "scripts"에 node 실행문을 추가합니다.

"start": "node index.js"
{
  "name": "test1",
  "version": "1.0.0",
  "description": "test",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "carrotweb",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1"
  }
}

 

npm run 명령어로 실행할 수 있습니다.

npm run start

 

종료하려면 콘솔에서 Ctrl + C를 누르고 "Y"를 입력하고 엔터키를 누르면 됩니다.

 

 

 

Express 정적 파일 적용하기

1. index.js를 오픈하여 이미지 파일이나 CSS 파일, JavaScript 파일 등과 같은 정적 파일을 제공하기 위해 Express.js의 express.static() 메서드를 추가합니다. 정적 파일들이 들어있는 폴더로 public 폴더를 설정하였습니다.

const express = require('express');
const app = express();
const port = 8080;

app.use(express.static('public'));

app.get('/', (req, res) => {
	res.send('Hello Node.js!');
});

app.listen(port, () => {
	console.log('Listening...');
});

 

2. C:\workspaces\nodeserver\test1 폴더에 public 폴더를 생성합니다.

 

3. C:\workspaces\nodeserver\test1\public 폴더에 index.html 파일을 생성합니다.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Hello Node.js!!</title>
	</head>
	<body>
		Hello Node.js!!
	</body>
</html>

 

4. 콘솔에서 npm start를 실행합니다.

npm run start

 

5. 웹 브라우저에서 "http://localhost:8080/index.html"를 입력합니다.

728x90
반응형