[번역] node.js 이용한 마이크로서비스 앱 만들기
building a Timestamp Microservice app
Learn Node.js by building a Timestamp Microservice app
https://medium.freecodecamp.org/microservice-8edfdb9be811
Timestamp Microservice 앱을 구축하여 Node.js를 배웁니다.
사진 데본 Janse 반 Rensburg 에 Unsplash
Node.js가 애플리케이션 구축을위한 훌륭한 플랫폼 인 이유 중 하나는 사실상 모든 일반적인 사용 사례를 위해 커뮤니티에서 개발 한 풍부한 라이브러리입니다. 따라서 비교적 짧은 시간 안에 아이디어를 생산 준비가 된 응용 프로그램으로 쉽게 이동할 수 있습니다.
즉, Node.js의 표준 라이브러리를 이해하면 Node.js의 작동 방식을 더 깊이 이해하고자 할 때 특히 유용 할 것입니다.
이 기사에서는 몇 가지 기본 제공 Node.js 모듈을 사용하여 타임 스탬프 마이크로 서비스 를 작성하는 방법을 학습합니다 . 여기에 우리가 만들 것의 라이브 데모 가 있습니다. 이 GitHub 레포 에서이 프로젝트의 전체 소스 코드를 찾을 수 있습니다 .
선결 요건
이전에 브라우저에서 JavaScript 애플리케이션을 빌드 한 경험이 있어야하지만, Node.js에 대한 사전 경험이 필요하지 않습니다. 계속하기 전에 Node.js가 npm 설치되어 있어야합니다.
Node.js 웹 사이트 를 방문 하여 운영 체제의 설치 지침을 볼 수 있습니다 . npm 은 Node와 번들로 제공되므로 일단 Node를 설치하면 npm 명령에 액세스 할 수 있습니다
이 프로젝트를 빌드하는 동안 사용한 버전은 다음과 같습니다.
Node.js v10.9.0
npm
터미널에서 다음 명령을 실행하여 Node의 버전을 볼 수 있습니다
node -v
npm -v
사용자 스토리
이 프로젝트의 사용자 스토리는 다음과 같습니다.
API 엔드 포인트는 GET [project_url]/api/timestamp/:date_string?
시작하기
컴퓨터에서 새 터미널 인스턴스를 연 다음 파일 시스템에이 프로젝트의 새 디렉토리를 만들고 다음 명령을 사용하여이 디렉토리로 변경하십시오.
mkdir timestamp -microservice
cd timestamp -microservice
새 Node 프로젝트를 시작할 때 첫 번째 단계는
package.json 파일 로 초기화하는 것입니다
이 파일에는 프로젝트의 이름, 설명, 작성자 및 관련 패키지에 대한 정보가 포함되어 있습니다.
다음 package.json 은 프로젝트 파일을 만드는 데 도움이되는 명령입니다
npm init
위 명령을 실행하면 프로젝트의 특정 부분에 대한 정보를 다음 순서로 입력 할 수있는 프롬프트가 열립니다.
프로젝트의 이름.
명령이 각 필드 옆에 괄호로 표시된 제안에 만족하면 Enter 키를 눌러 명령을 수락하고 명령이 종료 될 때까지 다음 필드로 이동하십시오. 또한 모든 기본값으로 파일 npm init -y 을 빠르게 채울 수 있습니다
package.json.
다음 단계는 index.js 프로젝트 디렉터리의 루트에 파일을 만드는 것 입니다.
여기가이 프로젝트의 코드를 작성하는 곳입니다.
touch index.js
마지막으로 views 프로젝트 디렉토리의 루트에 폴더를 만듭니다
이 폴더에는 두 개의 HTML 파일을 포함합니다 :
index.html 와 404.html
.
mkdir views
touch views/index.html views/404.html
좋아하는 텍스트 편집기에서 프로젝트 폴더를 엽니 다. 이제 응용 프로그램을 빌드 할 수 있습니다.
HTTP 웹 서버 만들기
index.js 열어 다음 코드를 입력하십시오.
const http = require ( "http");
const requestHandler = (req, res) => {
console.log (req.url);
res.end ( 'Hello world!');
};
const server = http.createServer (requestHandler);
server.listen (process.env.PORT || 4100, err => {
if (err) throw err;
console.log (`PORT $ {server.address (). port}`에서 실행중인 서버);
});
첫 번째 줄에는 http Node와 함께 제공되는 모듈이 필요 하며 http 변수를 통해 액세스 할 수 있습니다
그런 다음 createServer HTTP 모듈의 메소드를 사용하여 HTTP 서버의 새 인스턴스를 만든 다음
server 변수에 저장 합니다.
통지
requestHandler 세 이하 생성 기능
http 변수.
이 함수는 웹 서버에 들어오는 요청이있을 때마다 호출됩니다.
req 및 res 인수는 각각 클라이언트와 서버 응답의 요청을 나타내는 개체입니다.
이 listen 방법은 서버를 시작하고 PORT 환경 변수 (process.env 객체에서 사용 가능)에서 들어오는 연결을 수신 하거나 4100 아무것도 없는 경우 수신 대기하도록 합니다
listen 메서드에 전달 된 콜백 함수는 서버가 시작될 때 실행됩니다.
제공된 포트가 이미 사용 중이거나 다른 이유로 서버를 시작할 수없는 경우 오류가 발생합니다.
그렇지 않으면 console.log() 명령.이 터미널에 인쇄됩니다.
node index.js 터미널에서 실행하여 서버를 시작할 수 있습니다
서버가 실행되면
브라우저에서
http : // localhost : 4100 을 방문 하십시오
"Hello world!"라는 단어가 나타납니다.
루트 경로 만들기
http 모듈은 매우 기본 이기 때문에 라우터를 제공하지 않습니다.
따라서 각 경로에 대해 수행 할 작업을 결정하기 위해 URL을 수동으로 확인해야합니다.
데모에서와 마찬가지로 루트 경로에 도달하면 타임 스탬프 마이크로 서비스를 사용하는 방법에 대한 지침을 제공하고자합니다.
다음 requestHandler과 같이 함수를 수정하면됩니다.
const requestHandler = (req, res) => {
if (req.url === "/") {
// Do something
}
};
간단한 if진술은 들어오는 요청 URL이 정확한지 확인하고 중괄호 사이에 해당 경로의 논리를 넣을 수 있습니다.
이 경우 마이크로 서비스가 어떻게 작동하는지 설명하는 HTML을 반환하고자합니다. 계속하기 전에
views/index.html 앞서 작성한 파일에 다음을 복사하여 붙여넣고 파일을 저장하십시오.
<! DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<메타 이름 = "뷰포트"content = "폭 = 장치 폭, 초기 눈금 = 1.0">
< meta-http-equiv = "X-UA 호환"content = "ie = edge">
<title> Timestamp Microservice </ title>
<
body > {
font-family : -apple-system, BlinkMacSystemFont, 'Segoe UI' Roboto, Oxygen-Sans, 우분투, Cantarell, 'Helvetica Neue', sans-serif;
color:# # 333;
배경색 : # f6f6f6;
}
.container {
width : 100 %;
최대 너비 : 800px;
margin-left : 자동;
margin-right : 자동;
}
li {
margin-bottom : 10px;
}
li, p {
글꼴 크기 : 18px;
}
코드 {
글꼴 크기 : 90 %;
}
a {
color : # 006fc6;
}
</ 스타일>
</ 머리>
<BODY>
<DIV 클래스 = "용기">
<H1> API 프로젝트 : 타임 스탬프 Microservice </ H1>
<H3> 사용자 기사 : </ H1>
<OL 클래스 = "사용자 이야기 "
<code> new Date </ code>에
의해 성공적으로 구문 분석 될 수있는 경우 날짜 문자열이 유효합니다. <br>
unix 타임 스탬프는 <strong> 밀리 초 </ strong>를 지정하는 <strong> 정수 </ strong> (문자열이 아님)이어야합니다. <br>
<li> 날짜 문자열이 <strong> 비어 있음 </ strong>이면 <code> new Date () </ code>를 트리거하는 것과 동일해야합니다. 즉, 서비스는 현재 타임 스탬프를 사용합니다. </ li>
<li> 날짜 문자열은 <strong> 유효 </ strong>입니다. API는 <code> { "unix": & lt; date.getTime () & gt; "utc": & lt; date.toUTCString () & gt; } </ code>
<li>
<li> <li> <li> <li> <li> 날짜 문자열은 <strong> 유효하지
않음 </ strong>입니다. API가 구조를 갖는 JSON을 반환합니다. <br> <code> { "error": "Invalid Date"} < / code>.
</ li>
</ ol>
<h3> 예제 사용법 : </ h3>
<ul>
<li>
<a href="api/timestamp/2015-12-25"> [프로젝트 URL] / api / timestamp / 2015-12-25 </a>
</ li>
<li>
<a href="api/timestamp/1450137600000"> [프로젝트 URL] / api / timestamp / 1450137600 </a>
</ li>
</ ul>
<H3> 예제 출력 </ H3>
<p>
<부호> { "유닉스"1451001600000 "UTC": "2015년 12월 25일 (금) 그리니치 표준시 00시 00분 0초"} </ 코드>
</ p>
< / div>
</ body>
</ html>
그렇다면 브라우저에 HTML 응답을 보내려면 어떻게해야할까요? 내장
fs
모듈을 사용하여 파일을 읽은 다음
res
서버의 응답을 나타내는 인수를
사용하여 파일 내용을 브라우저로 보낼 수 있습니다
.
fs
아래
http그림과 같이모듈 바로 아래에 모듈이필요합니다.
const http = require ( "http");
const fs = require ( "fs");
그런 다음이 requestHandler함수를 다음과 같이수정하십시오
.
CONST RequestHandler를 = (REQ, 해상도) => {
경우 (req.url === "/") {
fs.readFile ( "보기 / index.html을", "UTF8"(ERR, HTML) => {
경우 ( err) throw err;
res.writeHead (200, { "Content-Type": "text / html"});
res.end (html);
});
}
};
이 readFile()메서드
views/index.html
는 제공된 encoding (utf8)을사용하여첫 번째 인수 ()에 제공된 파일을 비동기 적으로 읽고 제공된 콜백 함수를 실행합니다.
파일을 읽는 중 오류가 발생하면 예외가 throw됩니다.
그렇지 않으면html이 경우
콜백 함수 (
)
의 두 번째 인수에서 파일의 내용을 사용할 수있게됩니다
.
이제 html 브라우저의 내용을 브라우저로 보낼 수 있습니다
그러나
HTTP 응답 코드를 설정하고 응답 헤더를 설정하여 브라우저에 반환 된 내용의 미디어 유형이 실제로 무엇인지 알려줄 필요가 있습니다.
이 writeHead() 경우 서버 응답 객체의 메서드가 사용됩니다.
상태 코드를 첫 번째 인수로 받아들이고 응답 헤더를 두 번째 인수로 나타내는 객체를 사용합니다.
브라우저가 응답 내용을 HTML로 해석하도록
Content-Type헤더를text/html로 설정했습니다
그런 다음 end()메서드는index.html 파일내용을 응답 본문의 브라우저로 보내고 서버 응답의 끝을 알립니다.
코드에 새로 추가 된 것을 시험해 보려면 Ctrl-C로 서버를 멈추고 node server.js 브라우저를 사용하여 다시 시작한 다음 브라우저를 새로 고쳐야합니다.
views/index.html 페이지의파일에서html을보아야합니다
.
Nodemon이 노드 프로세스를 자동으로 다시 시작하도록 설정
기본적으로 코드를 변경할 때마다 서버 프로세스를 종료하고 다시 시작해야하지만, 그 주위에는 쉬운 방법이 있습니다.
코드가 바뀔 때마다 노드 프로세스를 자동으로 다시 시작하는 Nodemon 이라는 도구를 설치해야합니다 . 이 도구는 다음과 같은 방법으로 컴퓨터에 설치할 수 있습니다
npm
.
npm install -g nodemon
Nodemon이 설치되면 서버 프로세스를 종료하고 다시 시작하십시오
nodemon index.js
.
이제 코드를 변경할 때마다 웹 서버가 자동으로 다시 시작됩니다.
꽤 깔끔한 응?
다음 단계는 타임 스탬프 마이크로 서비스에 대한 경로를 설정하는 것입니다. 사용자 스토리 # 1에 따르면,이 서비스는
/api/timestamp/:date_string?
where에
제공되어야합니다.
여기서는 :date_string?서비스에 전달 될 날짜 문자열을 나타냅니다.
다음과 같이 index.js파일을수정하십시오
// 명령문을 요구한다.
const getTimestamp = date => ({
unix : date.getTime (),
utc : date.toUTCString ()
});
CONST RequestHandler를 = (REQ, 해상도) => {
경우 (req.url === "/") {
fs.readFile ( "보기 / index.html을"(ERR, HTML) => {
경우 (ERR) ERR 던져 ;
res.writeHead (200, { "Content-Type": "text / html"});
res.end (html);
});
} else if (req.url.startsWith ( "/ api / timestamp")) {
const dateString = req.url.split ( "/ api / timestamp /") [1];
시간 기록을 남겨 둬라.
if (dateString === undefined || dateString.trim () === "") {
timestamp = getTimestamp (new Date ());
} else {
const date =! isNaN (dateString)
? 새 날짜 (parseInt (dateString))
: 새 날짜 (dateString);
if (! isNaN (date.getTime ())) {
timestamp = getTimestamp (date);
} else {
timestamp = {
오류 : "잘못된 날짜"
};
}
}
res.writeHead (200, { "Content-Type": "application / json"});
res.end (JSON.stringify (timestamp));
}
};
// 파일의 나머지 부분
처리해야 할 코드가 많아서 조금씩 살펴 보도록하겠습니다. 요청 URL이 시작하는지 확인 하는
else if문
requestHandler
이 있습니다
/api/timstamp
.
그렇다면split요청 URL을 2 개로 채우고dateString결과 배열의 일부를 가져옵니다.
경우 dateString이다
undefined
빈 문자열, 그것은 어떤 날짜 문자열이 요청에 제공되지 않았 음을 의미합니다.
사용자 스토리 # 3은 현재 날짜가 요청 된 것처럼 그 상황을 처리하도록 지시합니다
getTimestamp(new Date())
.
a dateString가 존재할 경우 유닉스 타임 스탬프인지 또는 ISO-8601 날짜 문자열 (예 : "2018-11-22")인지 확인하여 숫자 나 문자열을 전달할지 여부를 결정할 수 있습니다
new Date()
unix 타임 스탬프를 문자열로 전달new Date() 하면 잘못된 결과를 얻게됩니다.
이것이 바로이 단계가 필요한 이유입니다.
다음으로 date변수에저장된 날짜 객체가 유효한지 확인합니다.
그렇다면 이전처럼 timestamp 객체를 얻습니다. 그렇지 않으면timestamp사용자 스토리 # 5에 지정된대로 유효하지 않은 날짜에 대한 구조로 변수를설정합니다
마지막 단계는 timestamp변수의 내용을브라우저로 보내는 것입니다.
이 경우응답 본문이 JSON으로 올바르게 해석되도록Content-Type헤더를설정합니다
application/json.
또한 메서드JSON.stringify(timestamp)호출하고 출력을 전달하여유효한 JSON 값을 전송하는지 확인합니다
end
.
이제 유효한 날짜 문자열이나 유닉스 타임 스탬프를 전달하여 앱을 테스트하거나 날짜 문자열을
/api/timestamp/
그대로 두어 현재 날짜에 대한 JSON 응답을 얻으십시오.
잘못된 날짜 문자열을 전달하여 서비스에서 유효하지 않은 날짜로 인식하는지 확인할 수도 있습니다.
404 페이지 구현
이 애플리케이션에 대한 모든 사용자 스토리를 완료했지만, 우리가하고 싶은 마지막 한 가지가 있습니다. 브라우저가 아닌 URL /또는 시작하는 URL을 요청하면 브라우저/api/timestamp에 404 응답을 보내도록 서버를 설정해야합니다.
먼저 views/404.html파일을 다음 코드로 채웁니다
.
<! DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<메타 이름 = "뷰포트"content = "폭 = 장치 폭, 초기 눈금 = 1.0">
< meta http-equiv = "X-UA 호환"content = "ie = edge">
<title> 404 찾을 수 없음
</ head>
<body>
<h1> undefined, h1>
<p> 방금 404'd. <a href="/"> 홈페이지 </a>로 돌아 가야 할 수도 있습니다. </ p>
<script> </ script>
</ body>
</ html>
다음 과 같이 보이도록 requestHandler함수를수정하십시오
index.js
.
CONST RequestHandler를 = (REQ, 해상도) => {
경우 (req.url === "/") {
fs.readFile ( "보기 / index.html을"(ERR, HTML) => {
경우 (ERR) ERR 던져 ;
res.writeHead (200, { "Content-Type": "text / html"});
res.end (html);
});
} else if (req.url.startsWith ( "/ api / timestamp")) {
const dateString = req.url.split ( "/ api / timestamp /") [1];
시간 기록을 남겨 둬라.
if (dateString === undefined || dateString.trim () === "") {
timestamp = getTimestamp (new Date ());
} else {
const date =! isNaN (dateString)
? 새 날짜 (parseInt (dateString))
: 새 날짜 (dateString);
if (! isNaN (date.getTime ())) {
timestamp = getTimestamp (date);
} else {
timestamp = {
오류 : "잘못된 날짜"
};
}
}
res.writeHead (200, { "Content-Type": "application / json"});
res.end (JSON.stringify (timestamp));
} else {
fs.readFile ( "views / 404.html", (err, html) => {
if (err) throw err;
res.writeHead (404, { "Content-Type": "text / html"});
res.end (html);
});
}
};
나는 최종 추가 한 else의 끝에서 블록requestHandler의 내용을 읽는 기능
views/404.html
파일을 일치하지 않는 URL의 브라우저로 전송
/
하거나
/api/timestamp/:date_string?
.
그것을 밖으로 시도하십시오. 브라우저에 http : // localhost : 4100 / foo 와 같은 URL을 입력하고 작동하는지 확인하십시오!
헤로 쿠에 배치
아무도 그것을 사용할 수 없다면 타임 스탬프 마이크로 서비스는 무엇이 좋을까요? Heroku 에 배포하여 전 세계와 공유하십시오 .
첫 번째 단계는 무료 Heroku 계정 에 가입하는 것입니다 . 계정이 활성화되면 이 링크 를 따라 새 앱을 만드 십시오 . 고유 한 이름을 지정하십시오. 나는 "ayo-timestamp"라고 불렀다.
앱이 생성되면 여기 에 나온 지침 에 따라 컴퓨터에 Heroku CLI를 설치하십시오. 그런 다음 heroku login터미널에서명령을실행하여 Heroku 계정에 로그인하십시오.
프로젝트를위한 git 저장소를 초기화했는지 확인하십시오. 그렇지 않다면
git init
프로젝트 디렉터리의 루트에서 명령을 실행 한 다음 아래 명령을 실행하여 heroku를 git repo의 원격 저장소로 설정하십시오.
교체
<app name>
응용 프로그램의 이름으로.
heroku git : remote -a <app name>
그런 다음
Procfile
프로젝트 디렉토리 (
touch Procfile
)
의 루트에를만들고다음 내용을 붙여 넣습니다.
웹 : 노드 index.js
그런 다음 키 package.json아래에서 파일에 실행중인 노드의 버전을 지정하십시오
engines
.
내가10.9.0 컴퓨터에서 실행중인버전이므로버전을 지정했습니다
.머신에있는 Node의 버전과 일치하도록이 값을 변경해야합니다.
{
"name": "timestamp-microservice",
"version": "1.0.0",
"description": ""
"main": "index.js",
"scripts": {
"test": "echo \ "오류 : 테스트를 지정하지 않았습니다. \"&& exit 1 "
},
"keywords ": [],
"author ":"Ayo Isaiah ",
"license ":"MIT ",
"engines ": {
"node ":"10.9. 0 "
}
}
마지막으로 다음 명령을 사용하여 코드를 커밋하고 Heroku 리모컨으로 푸시합니다.
git add.
git commit -m "초기 커밋"
git push heroku master
배포 프로세스가 완료되면
https://<your-app-name>.heroku.com
프로젝트를보고 테스트
할 수 있습니다
.
마무리
우리는 내장 된 노드 모듈 만 사용하여 타임 스탬프 마이크로 서비스를 성공적으로 구축하고이를 Heroku에 배포했습니다. 익스프레스 와 같은 웹 프레임 워크를 사용하는 것이 중요하지 않은 응용 프로그램의 경우 더 쉽고 실용적이지만 커뮤니티가 가지고있는 것을 체크 아웃하기 전에 적어도 표준 라이브러리에 익숙하다면 훨씬 더 나은 Node 개발자가 될 것이다. 제공합니다.
