TIL

Express.js

김영재0412 2022. 11. 26. 15:56

Express.js의 이해

 

Express.js

Express.jsNode.js로 서버를 빠르고 간편하게 만들 수 있게 도와주는 웹 프레임워크이다.

라이브러리 - 기계,레시피, 프레임워크 - 스타벅스 같은 프랜차이저라 생각하면 쉽다.

 

Express.js 이외에 다양한 웹 프레임워크가 존재하지만 오늘날 가장 많은 Node.js 웹서버가 Express.js 프레임워크를 통해 개발되었다.

ex ) Nest.js, fastify, koa.js, socket.io 등등

 

 

웹 서버와 Express.js의 차이점

Express.js는 웹서버 자체가 아닌 Node.js를 위한 웹 프레임워크로 웹 서버를 구현하기 위해 사용 되는 것이 Express.js 프레임워크이다.

즉, Express.js와 웹서버는 동일하지않다.

 

 

 

API Client

API Client란 개발단계에서 우리가 작성한 API의 요청을 확인하거나 테스팅 할 때 도움을 주는 툴이며 API Client를 사용함으로 개발 속도를 높이거나 치명적인 에러를 예방하는데 도움을 받을 수 있다.

 

Postman, Insomnia, Thunder Client 등 여러 API Client가 있다. 난 포스트맨을 이용할 것이다. 

 

즉, 클라이언트를 개발하지않더라도 클라이언트 대신 쓸 수 있으며 서버와 통신을 해주는 툴이다.

 

 

 

Express.js로 웹 서버 구현

먼저 app.js 파일을 만들고 npm init으로 package.json을 만들어준다.

 

그 후 npm install 로 express를 깔아준다. 여기서 nodemon은 자동재시작 해주는 모듈이고 dotenv는 환경변수 모듈이다.

 

 

그후 package.json을 보면 깔린 것을 확인할 수 있고 nodemoulde 폴더도 확인할 수 있다.

 

이제 app.js에 기본 express 코드를 쳐주면 서버를 열 수 있다.

 

 

 

 

Routing 이해 및 Router 학습

 

Routing은 클라이언트의 요청 조건(메서드, 주소 등)에 대응해 응답하는 방식을 말한다. Router는 클라이언트의 요청을 쉽게 처리 할 수 있게 도와주는 Express.js 기본 기능중 하나입니다.

 

router.METHOD(PATH, HANDLER);

/*                                   */

const express = require('express');
const router = express.Router();

router.get('/', (req, res)=> {
	res.status(200).json({message: "GET 연결"})
})

module.exports = router;

일반적으로 Router는 위와 같은 구조를 가진다.

 

  • router: express의 라우터를 정의하기 위해 사용합니다.
  • METHOD: HTTP Method를 나타냅니다. (ex: get, post, put, delete …)
  • PATH: 실제 서버에서 API를 사용하기 위한 경로를 나타냅니다.
  • HANDLER: 라우트가 일치할 때 실행되는 함수힙니다.

 

// app.js

const posting = require("./routes/posting");
const review = require("./routes/review");

// localhost:3000/api -> posting
app.use("/api", [posting, review]);

이런식으로 app.use에 배열형식으로도 쓸 수 있다.

 

 

 미들웨어(Middleware)란 뭘까요?

웹 서버에서 요청을 받을때 가끔 모든 요청에 대해 공통적인 처리를 하고싶은 경우가 생길 수 있다. 그럴때 미들웨어를 이용하여 웹 서버의 요청/응답에 대해 공통적으로 관리가 가능하다.

 

 

 

 

 

Module의 이해

 

모듈(Module)은 Javascript 파일 단위로 분리된 코드를 일컫는다. 여기서 Javascript 파일은 특정한 기능을 가진 여러 개의 함수변수들의 집합이다.

 

  1. 모듈(Module)은 하나의 모듈에서 다른 모듈호출하여 사용할 수 있다.
  2. 모듈(Module)은 그 자체로도 하나의 프로그램이면서 다른 프로그램의 부품으로도 사용할 수 있다.
  3. 보통 1개의 파일1개의 모듈이 된다.

 

모듈은 왜 필요할까요?

  1. 코드 베이스분리할 수 있으며, 이를 통해 코드를 구조적으로 관리할 수 있다.
  2. 코드를 재사용 가능하게 만들어줍니다. 즉, 모듈화(modularize) 됩니다.
  3. 모듈의 **인터페이스(Interface)**만 노출 시킬 수 있습니다. 즉, 인터페이스 이외에는 모든 정보를 은닉하는 **정보은닉**(information hiding)을 구현 할 수 있게 됩니다.
  4. 종속성관리할 수 있게 됩니다.

 

 모듈은 어떻게 사용할까요?

  • export 명령어를 변수함수 앞에 붙이면 외부 모듈에서 해당 변수나 함수에 접근할 수 있다.
  • import, require 명령어를 사용하면 외부 모듈의 기능을 가져올 수 있다.
  • require는 CommonJS로 모듈 시스템을 관리할 때 사용한다.
  • import는 **ES6(ES2015)**로 모듈 시스템을 관리할 때 사용한다.
const express = require("express");

import express from 'express';

 

 

Module 사용해보기

// modules/math.js
function add(a, b) {
 return a + b;
}

module.exports = add;
// modules/run.js
const add = require("./math");
console.log(add(3, 4));
// Print: 7

 

 

🧩  Module을 export하는 다양한 방법

/** 화살표 함수 exports **/

// 모듈을 호출했을 때, add 키 값에는 add 변수 함수가 가지고 있는 값이 할당된다.
const add = (a, b) => {
  return a + b;
}
exports.add = add;
/** 익명 함수 exports **/

// 모듈을 호출했을 때, add 키 값에는 (a,b){return a + b;} 익명 함수가 할당되는 방법
exports.add = function (a, b) {
  return a + b;
}
/** Module.exports = Object **/

// 모듈을 호출했을 때, add 키 값에는 add 함수가 들어가는 방법이다.
function add(a, b) {
  return a + b;
}
module.exports = { add: add };
/** module.exports = Function **/

// 모듈 그 자체를 add 함수로 할당
function add(a, b) {
  return a + b;
}
module.exports = add;

 

 

 

 

Request와 Response

 

Request클라이언트가 서버에게 전달하려는 정보나 메시지를 담는 객체를 의미하며 Response서버에서 클라이언트로 응답 메시지를 전송시켜주는 객체이다.

 

req 객체

  • req.app : req 객체를 통해 app 객체에 접근할 수 있습니다.
  • req.ip: 요청한 Client의 ip 주소가 담겨 있습니다.
  • req.body: Request를 호출할 때 body로 전달된 정보가 담긴 객체입니다.
    • express.json() Middleware를 이용하여야 해당 객체를 사용할 수 있습니다.
  • req.params: 라우터 매개 변수에 대한 정보가 담긴 객체입니다.
  • req.query: Request를 호출할 때 쿼리 스트링으로 전달된 정보가 담긴 객체입니다.
  • req.cookies: Request를 호출할 때 Cookie 정보가 담긴 객체입니다.
    • cookie-parser Middleware를 이용하여야 해당 객체를 사용할 수 있습니다.
  • req.get(Header): 헤더에 저장된 값을 가져오고 싶을 때 사용합니다.

res 객체

  • res.app : res 객체를 통해 app 객체에 접근할 수 있습니다.
  • res.status(코드) : Response에 HTTP 상태 코드를 지정합니다.
  • res.send(데이터) : 데이터를 포함하여 Response를 전달합니다.
  • res.json(JSON) : JSON 형식으로 Response를 전달합니다.
  • res.end() : 데이터 없이 Response를 전달합니다.
  • res.direct(주소) : 리다이렉트할 주소와 함께 Response를 전달합니다.
  • res.cookie(Key, Value, Option) : 쿠키를 설정할 때 사용합니다.
  • res.clearCookie(Key, Value, Option) : 쿠키를 제거할 때 사용합니다.

 

❓ Request body, params, query을 더 자세하게 알아보기

 

req.body (Body)

  • 클라이언트가 요청(Request)을 보냈을 때, Body에 데이터를 삽입하였을 때 사용된다.
  • Key-Value의 데이터 형식을 가지고 있으며, 대표적으로 JSON 형태를 띄고 있다.
  • Body는 Query String, Path Variable(params)과 다르게, URL만을 가지고 어떤 데이터를 전달하였는지 확인할 수 없는 특징을 가지고 있다.
  • 데이터를 생성하거나 수정이 필요한 데이터의 전달을 위해 사용된다. ex) 사용자의 ID, 사용자의 Password, 게시글 제목 등
  • POST, PUT과 같은 Http Method에서 사용된다.

 

req.query (Query String)

  • 클라이언트가 요청(Request)을 보냈을 때, URL에 원하는 Key-Value를 삽입하여 데이터를 전달한다.
  • URL의 마지막에 ?기호를 이용해 Query String을 사용할 수 있다. ex) https://sparta.com**?name=이용우&age=29**
  • 특정 콘텐츠의 위치를 표시하거나 웹 페이지에 특정한 옵션을 설정할 때 사용한다. ex) 게시글의 정렬, 특정 날짜의 게시글만 출력하는 옵션 설정 등
  • GET과 같은 Http Method에서 사용된다.

 

req.params (Path Variable)

  • 클라이언트가 요청(Request)을 보냈을 때, URL에 원하는 데이터를 삽입하여 전달한다.
  • URL 특정 경로를 매개 변수로써 사용한다.
  • 특정 게시글을 선택하거나 명확한 리소스를 지정해야할 때 사용한다. ex) 게시글의 상세 정보 조회, 사용자의 상세 정보 조회

 

 

https://youngjae0412.tistory.com/26

 

'TIL' 카테고리의 다른 글

MongoDB, Mongoose  (0) 2022.11.28
JavaScript의 ES  (0) 2022.11.27
HTTP / Web Server  (0) 2022.11.26
객체 리터럴(object literal), Error handling, 클래스(Class)  (0) 2022.11.26
동기(Sync) & 비동기(Async) & Promise  (0) 2022.11.25