웹 어플리케이션
요약
•
환경 : Nodejs 웹 애플리케이션
•
명령어
$ npm init
$ npm i fastify --save
Docker
복사
•
https://www.fastify.io/docs/latest/Getting-Started/
•
소스 파일 복사 > COPY 명령어
•
node_modules 제외 > .dockerignore
실습시작
•
처음에 폴더를 하나 만들고 그 이름을 Web이라고 명명하겠다.
•
예시 (Dockerfile 부분은 이전 실습이니 무시할 것)
•
npm을 사용해줄려면 초기에 npm init을 해줘야 한다.
(base) glory@Gloryui-MacBookPro Web % npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help init` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
package name: (web)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to /Users/glory/Desktop/(GITHUB)/Web/package.json:
{
"name": "web",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
Is this OK? (yes) yes
╭────────────────────────────────────────────────────────────────╮
│ │
│ New patch version of npm available! 6.14.5 → 6.14.9 │
│ Changelog: https://github.com/npm/cli/releases/tag/v6.14.9 │
│ Run npm install -g npm to update! │
│ │
╰────────────────────────────────────────────────────────────────╯
(base) glory@Gloryui-MacBookPro Web %
Go
복사
•
그 다음에는 install 명령어인 npm i fastify --save 을 해준다.
•
실행화면
•
여기까지 되었으면 폴더에 app.js 파일을 넣는다.
•
소스코드
// Require the framework and instantiate it
const fastify = require('fastify')({
logger: true
})
// Declare a route
fastify.get('/', function (request, reply) {
reply.send({ hello: 'world' })
})
// Run the server!
fastify.listen(3000, '0.0.0.0', function (err, address) {
//도커를 쓸려면 호스트 네임을 '0.0.0.0' 로 해야한다.
if (err) {
fastify.log.error(err)
process.exit(1)
}
fastify.log.info(`server listening on ${address}`)
})
JavaScript
복사
•
실행화면
•
아래의 터미널에 node app.js 명령어를 입력해서 실행해보자
•
실행화면
(base) glory@Gloryui-MacBookPro Web % node app.js
{"level":30,"time":1612932838681,"pid":5275,"hostname":"Gloryui-MacBookPro.local","msg":"Server listening at http://0.0.0.0:3000"}
{"level":30,"time":1612932838682,"pid":5275,"hostname":"Gloryui-MacBookPro.local","msg":"server listening on http://0.0.0.0:3000"}
JavaScript
복사
Dockerfille 만들기
•
같은 폴더에 도커 파일을 만들어서 아래의 코드를 입력한다.
# 1. node 설치
FROM ubuntu:20.04
RUN apt-get update
RUN DEBIAN_FRONTEND=noninteractive apt-get install -y nodejs npm
# 2. 소스복사
COPY . /usr/src/app
# 3. Node js 패키지 설치
WORKDIR /usr/src/app
RUN npm install
# 4. WEB 서버 실행 (Listen 포트 정의)
EXPOSE 3000
CMD node app.js
Docker
복사
•
예시 그림
•
내 디렉토리에 있는 로컬 node_modules 같은 경우에는 도커파일에 저장을 예외시키기 위해 .dockerignore를 진행한다.
•
.dockerignore를 만들고 거기에 아래의 명령어를 넣으면 된다.
•
node_module/*
•
실행화면
이미지 만들기
•
명령어 (이름을 web 이라고 명명한 것이고 다른걸로 바꿔도 무관)
docker build -t web .
Docker
복사
•
실행화면
•
다 만들어지면 이렇게 나온다.
•
실행을 시켜보도록하자 (포트 3000번을 활용)
•
명령어
docker run -p 3000:3000 web
Docker
복사
•
실행화면
% docker run -p 3000:3000 web
{"level":30,"time":1612932838681,"pid":5275,"hostname":"Gloryui-MacBookPro.local","msg":"Server listening at http://0.0.0.0:3000"}
{"level":30,"time":1612932838682,"pid":5275,"hostname":"Gloryui-MacBookPro.local","msg":"server listening on http://0.0.0.0:3000"}
Docker
복사
•
웹페이지
추가
•
js코드를 수정을 하고 나서 도커 이미지를 또 다시 만들어줘야 한다.
•
Hello World 대신 다른걸 출력해도 상관이 없고 포트번호도 바꿔서 대신 실습해주는것이 좋다 (3000번은 이전에 쓰고 있으니깐!)
// Require the framework and instantiate it
const fastify = require('fastify')({
logger: true
})
// Declare a route
fastify.get('/', function (request, reply) {
reply.send({ hello: 'glory' })
})
// Run the server!
fastify.listen(3001, '0.0.0.0', function (err, address) {
//도커를 쓸려면 호스트 네임을 '0.0.0.0' 로 해야한다.
if (err) {
fastify.log.error(err)
process.exit(1)
}
fastify.log.info(`server listening on ${address}`)
})
JavaScript
복사
•
이미 누가 우분투에 node를 얹은 이미지를 만들어 두었다.
•
우리는 그걸 쓰기만 하니 아래의 코드를 보면
# 1. node 설치
FROM ubuntu:20.04
RUN apt-get update
RUN DEBIAN_FRONTEND=noninteractive apt-get install -y nodejs npm
# 2. 소스복사
COPY . /usr/src/app
# 3. Node js 패키지 설치
WORKDIR /usr/src/app
RUN npm install
# 4. WEB 서버 실행 (Listen 포트 정의)
EXPOSE 3000
CMD node app.js
Docker
복사
•
이렇게 되어있는 1번 부분을 이렇게 변경하여서 쓸수 있다.
# 1. node 설치
FROM node:12
# 2. 소스복사
COPY . /usr/src/app
# 3. Node js 패키지 설치
WORKDIR /usr/src/app
RUN npm install
# 4. WEB 서버 실행 (Listen 포트 정의)
EXPOSE 3000
CMD node app.js
Docker
복사
•
또한 코드를 계속 수정하게 되면 위의 코드에서 npm install 부분이 느려지게 되는데 이유는 코드가 바뀌면서 계속 다시 돌아가기 때문이다.
•
이걸 해결해주는 방법으로는 패키지를 우선으로 복사를 하게 하면 되는데 코드는 이렇게 바꾸면 된다.
# 1. node 이미지 사용
FROM node:12
#2.패키지 우선 복사
COPY ./package* /usr/src/app/
WORKDIR /usr/src/app
RUN npm install
# 3. 소스 복사
COPY . /usr/src/app
# 4. WEB 서버 실행 (Listen 포트 정의)
EXPOSE 3000
CMD node app.js
Docker
복사
•
소스를 복사하기 전에 패키지를 먼저 복사하는 방법이다.
•
node:12에는 상당히 많은 내용이 담겨져있는데 이걸 경량화 시켜서 다운로드 받을수 있다.
# 1. node 이미지 사용
FROM node:12-alpine
#2.패키지 우선 복사
COPY ./package* /usr/src/app/
WORKDIR /usr/src/app
RUN npm install
# 3. 소스 복사
COPY . /usr/src/app
# 4. WEB 서버 실행 (Listen 포트 정의)
EXPOSE 3000
CMD node app.js
Docker
복사
복습
FROM
FROM [--platform=<platform>] <image>[:<tag>] [AS <name>]
Docker
복사
•
의미 : 베이스 이미지 지정
•
예시
FROM ubuntu:latest
FROM node:12
FROM python:3
COPY
COPY [--chown=<user>:<group>] <src>... <dest>
Docker
복사
•
의미 : 파일 또는 디렉토리 추가
•
예시
COPY index.html /var/www/html/
COPY ./app /usr/src/app
RUN
RUN <command>
Docker
복사
•
의미 : 명령어 실행
•
예시
RUN apt-get update
RUN npm install
WORKDIR
WORKDIR /path/to/workdir
Docker
복사
•
의미 : 작업 디렉토리 변경
•
예시
WORKDIR /app
EXPOSE
EXPOSE [PORT]
Docker
복사
•
의미 : 컨테이너에서 사용하는 포트 정보
•
예시
EXPOSE 8000
CMD
CMD ["executable","param1","param2"]
CMD command param1 param2
Docker
복사
•
의미 : 컨테이너 생성시 실행할 명령어
•
예시
CMD ["node", "app.js"]
CMD node app.js