오늘의 목표 : Server & Node 복습해보기
Node.js
node.js는 v8엔진으로 만들어진 자바스크립트 런타임이다.
what is v8 ?
- 자바스크립트를 기계어로 번역시켜준다!
- 런타임 : 프로그램이 구동되고있는 환경
- 이벤트 : 유저의 버튼클릭이나 네트워크에 리소스를 요청하는 것
blocking(블로킹) VS Nonblocking(논블로킹)
- 블로킹 : 다음 함수 실행이 현재 함수 실행종료를 기다림
- 논블로킹 : 다음 함수 실행이 현재 함수 실행종료를 기다리지않음 (node.js 특징)
NodeCore Modules (노드 코어 모듈)
- node와 함께 번들링 되어있는 모듈들
- require 방식으로 사용할 수 있다
- fs
- http
- url
- path
NPM
- Node package manager 오픈소스 라이브러리중 하나
- html 방식을 일반 js코드로 쉽게 쓸수 있게 만들어줄 수 있다.
- package.json에 모든 정보가 담겨있다.
package.json
프로젝트는 나혼자가 아닌 협업을 통해 이루어지며 팀원들이 무엇이 필요한지 적어둠으로서 소통과 코딩에 불편함을 줄이고자 작성하는 공간
- devDependencies
$ npm install mocha --save-dev--save-dev 옵션과 함께 install 실행시 자동으로 devDependencies에 추가됨
- dependencies
devDependencies와는 다르게, 이 프로젝트가 돌아가기 위해 반드시 필요한 모듈들이 무엇인지가 적혀 있다.
$ npm install --save react--save 옵션과 함께 (생략 가능) install 실행시
자동으로 dependencies에 추가됨
CORS
- cross origin resource sharing : 크로스 오리진에서 자원을 요청하여 공유한다.
- 브라우저 내에서 크로스 도메인 요청은 제한되어있다.
- 웹 애플리케이션 고도화를 위해 개선요청
고도화된 최근 앱
- 모든 도메인(*)을 허용
- 메소드는 GET POST PUT DELETE OPTIONS만 허용
- 헤더에는 content-type과 accept만 사용가능
- preflight request는 10초까지 허용
HTTP 트렌잭션 해부
서버생성
모든 node 웹 서버 애플리케이션은 웹 서버 객체를 만들어야 함.
이 때 createServer를 이용한다.
const http = require('http');
const server = http.createServer((request, response) => {
// 여기서 작업이 진행됩니다!
});이 서버로 오는 HTTP 요청마다 createServer에 전달된 함수가 한 번씩 호출된다.
const server = http.createServer(); server.on('request', (request, response) => { // 여기서 작업이 진행됩니다! });
요청을 실제로 처리하려면 listen 메서드가 server 객체에서 호출되어야 한다. 대부분은 서버가 사용하고자 하는 포트 번호를 listen에 전달하기만 하면 됨
메서드, URL, 헤더
주의: request 객체는 IncomingMessage의 인스턴스입니다. request에 headers라는 전용 객체가 있습니다.
const { headers } = request;
const userAgent = headers['user-agent'];오류 메시지와 스택트레이스 출력
request.on('error', (err) => {
// 여기서 `stderr`에 오류 메시지와 스택 트레이스를 출력합니다.
console.error(err.stack);
});RESTful
REpresentational State Transfer
웹 서비스를 만드는데 사용되는 제약(constraint) 모음
Roy T. Fielding
6가지 Constraints
- Client-Server
- Stateless
- Cacheable
- Uniform interface
- Layered system
- Code on demand ( js optional )
Common JS
- 모든 모듈은 자신만의 독립적인 실행 영역이 있다.
- 모듈 정의는 전역객체인 exports 객체를 이용한다.
- 모듈 사용은 requrie 함수를 이용한다.
express 설치
https://expressjs.com/en/starter/installing.html
$ mkdir myapp
$ cd myapp
사용 npm init만들 명령을 package.json응용 프로그램의 파일을. package.json작동 방식 에 대한 자세한 내용 은 npm의 package.json 처리 세부 사항을 참조하세요 .
$ npm init
이 명령은 응용 프로그램의 이름 및 버전과 같은 여러 항목을 묻는 메시지를 표시합니다. 지금은 RETURN을 눌러 다음 예외를 제외하고 대부분의 기본값을 수락 할 수 있습니다.
entry point: (index.js)를 입력 app.js하거나 기본 파일의 이름을 원하는대로 입력 합니다. 원하는 경우 index.jsRETURN을 눌러 제안 된 기본 파일 이름을 수락합니다.
이제 myapp디렉토리에 Express를 설치 하고 종속성 목록에 저장하십시오.
$ npm install express --save
Express를 임시로 설치하고 종속성 목록에 추가하지 않으려면 :
$ npm install express --no-save
기본 라우팅
라우팅 은 애플리케이션이 특정 엔드 포인트 (URI (또는 경로) 및 특정 HTTP 요청 메서드 (GET, POST 등))에 대한 클라이언트 요청에 응답하는 방법을 결정하는 것을 의미한다.
app.METHOD(PATH, HANDLER)
라우팅 은 애플리케이션의 엔드 포인트 (URI)가 클라이언트
var express = require('express')
var app = express()
// respond with "hello world" when a GET request is made to the homepage
app.get('/', function (req, res) {
res.send('hello world')
})요청에 응답하는 방식을 나타낸다.
경로 방법
경로 메서드는 HTTP 메서드 중 하나에서 파생되며 express클래스 의 인스턴스에 연결됩니다 .
다음 코드는 앱 루트에 대한 GET 및 POST 메서드에 대해 정의 된 경로의 예입니다.
// GET method route
app.get('/', function (req, res) {
res.send('GET request to the homepage')
})
// POST method route
app.post('/', function (req, res) {
res.send('POST request to the homepage')
})라우팅 설정과 응답코드
참고 : https://expressjs.com/en/starter/static-files.html
해당 사이트에서 express 에 대한 전반적인 흐름을 한번 훑고
sprint Refactor Chatterbox Server using Express를 해보는것을 오늘의 마무리로 정했다.
Bare minimum requirements
공식 문서를 통해 express를 설치하고, express를 이용해 간단한 웹 서버를 만들어 보세요. http 모듈이 express에 내장되어 있어서, 따로 http를 import할 필요는 없습니다.
express를 이용해 웹 서버를 만들어 보았다면, chatterbox server를 express를 이용해 다시 작성(refactoring)하세요.
먼저 기존 http 모듈을 이용한 chatterbox server를 Pull Request로 제출하세요.
예) codestates/master <-- kimcoding/master
image
완성된 chatterbox server로부터 새롭게 express라는 이름으로 git 브랜치를 만들고, express를 이용해 리팩토링을 진행합니다. 완성되면, 동일한 repo에 새로운 Pull Request를 보내세요.
예) codestates/master <-- kimcoding/express
image
위와 같이 im-sprint-chatterbox-server repository에 여러분의 PR이 두개 존재해야 합니다.
express로 리팩토링할 때, 유용한 미들웨어를 적용하세요.
일단 미들웨어가 무엇인지 이해하세요.
body parser 미들웨어를 적용하세요.
CORS 미들웨어를 적용하세요.
왜 새로보는 느낌이 드는걸까....... 그만큼 나의 개념이 깊지 않았다는 거겠지 ㅠㅠ
한번보다 두번이 두번보다 세번이 더 나아짐을 알기에 늦더라도 차근차근 진행해보자!!!
