Express.js

🧑🏻‍💻 Node.js

🚀 Node.js 란

Node.js는 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경입니다.

• Node.js는 웹 브라우저 밖에서 자바스크립트를 실행할 수 있게 해주는 역할을 합니다.
• 비동기 I/O 처리에 강점이 있어 실시간 통신이 필요한 웹 서버나 네트워크 애플리케이션을 구축하는 데 주로 사용됩니다.

 

📖 Package.json 파일 구조

package.json은 프로젝트의 메타데이터와 의존성(dependencies)을 관리하는 파일입니다.

• 프로젝트에서 어떤 패키지들을 사용하는지 프로젝트 이름과 버전은 무엇인지 등을 정의

{
  "name": "my-test-app", 
  "version": "1.0.0",
  "description": "A simple application.",
  "main": "index.js",
  "scripts": {
    "start": "node index.js"
  },
  "keywords": [],
  "author": "beomsic",
  "license": "ISC",
  "dependencies": {
    "express": "^4.18.2"
  }
}

• name: 프로젝트의 이름
• version: 프로젝트의 버전
• description: 프로젝트에 대한 설명
• main: 프로젝트의 진입점(entry point) 파일
• scripts: 프로젝트에서 실행할 수 있는 명령어들을 정의합니다.
  • 예를 들어 npm start를 실행하면 node index.js 명령어가 실행됩니다.
• dependencies: 프로젝트가 실행될 때 필요한 패키지들(라이브러리)을 나열합니다.

 

🔍 package.json과 package-lock.json

package.json은 모듈의 버전을 정의시 '~4.xx.1' 또는 '^2.xx.0' 같은 version range를 사용한다.

package-lock.json은 정확한 버전을 명시

 

💡 version range

• 버전의 이상, 미만 등을 나타낼 수 있는 방법

 

🤔 package-lock.json은 왜 필요한가?

package.json에 명확한 버전을 입력하면 package-lock.json이 필요 없지 않을까?

 

⚠️ package.json에 항상 명확한 버전을 입력한다면 모든 개발자의 환경에서 버전 업데이트가 일어날 때마다 npm install을 해줘야한다.

 

각자 조금씩 다른 버전은 pacakge.json의 version range 이점을 사용해 개발하고

버전 문제로 큰 버그가 생긴다면 package-lock.json으로 버전을 명확히 일치시켜 해결할 수 있다.

 

package-lock.json이 존재한다면, npm install 시 packag.json이 아닌 package-lock.json의 버전으로 install

 

👨‍💼 npm(Node Package Manager) 이란?

npm은 Node.js의 패키지 매니저입니다.

 

Node.js 프로젝트에 필요한 다양한 모듈(패키지)을 설치, 관리, 삭제하는 역할을 합니다.

전 세계 개발자들이 만든 수많은 패키지들을 npm 레지스트리에서 다운로드하여 손쉽게 사용할 수 있습니다.

• 다운 받은 모듈들은 ./node\_modules 에 설치

 

🌠 Express.js

Express.js는 Node.js 환경에서 웹 서버를 더 쉽고 효율적으로 구축할 수 있도록 도와주는 경량 웹 프레임워크입니다.

 

Node.js가 Javascript를 서버에서 실행할 수 있게 해주는 런타임 환경이라면 Express.js는 그 위에서 웹 서버를 쉽게 구축할 수 있게 해주는 프레임워크입니다.

 

복잡한 서버 로직을 간결하게 처리할 수 있도록 HTTP 요청 처리, 라우팅, 미들웨어 등 다양한 기능을 제공합니다.

• express는 http 모듈을 이용하여 웹 서버를 구축하고 데이터를 표시하는 방식을 좀 더 추상화하여 웹 서비스나 웹 애플리케이션 개발을 더 편리하고 수월하게 하는 여러 API를 제공합니다.

 

⚙️ 설치

npm init -y

• npm 초기화를 진행
• package.json파일이 생성

 

npm install -D express

 

🧑‍💻 Express.js 실행해보기

const express = require("express");
const app = express();
const port = 3000;

app.get("/", (req, res) => {
  res.send("Hello World!");
});

app.listen(port, () => {
  console.log(port, "번 포트에서 대기 중");
});

 

$npx node express.js

-----------------
3000 번 포트에서 대기 중

 

🖥️ 결과

 

🔍 미들웨어란?

💡 미들웨어는 Express 의 핵심 개념입니다.

 

미들웨어는 요청과 응답 사이에 위치해 다양한 기능을 수행하는 함수들입니다.

• 웹 요청과 응답에 대한 정보를 통해 필요한 처리를 진행

 

🤖 미들웨어 함수 구성 요소

 

req: 요청 객체

res: 응답 객체

next: 다음 미들웨어를 호출하는 함수.

• next()를 호출하지 않으면 요청-응답 주기가 중단됩니다.
• next(): 다음 미들웨어 함수로 이동합니다.
• next('route'): 현재 라우트의 나머지 미들웨어를 건너뛰고 다음 라우터로 이동합니다.

 

var express = require('express');
var app = express();

app.use(function (req, res, next) {
  req.requestTime = Date.now(); // req라는객체에 requestTime 키와 밸류를 래퍼로 등록. requestTime는 사용자가 정한 값이다.
  next(); // 다음 미들웨어 함수를 작동
});

app.get('/', function(req, res, next) {
  res.send(req.requestTime);
})

app.listen(3000);

• function(req, res, next) {} 부분이 바로 미들웨어

 

app.use()

• Express 에서 항상 실행하는 미들웨어 역할
• app.get(), app.post() 등과 달리 요청 URL을 지정하지 않아도 사용 가능
  • URL에 상관없이 매번 실행

 

 

사용 예시	설명
app.use(미들웨어)	모든 요청에서 해당 미들웨어 실행
app.use(’/path’, 미들웨어)	path로 시작하는 요청에서 미들웨어 실행
app.post(’path’, 미들웨어)	path로 시작하는 POST 요청에서 미들웨어 실행

 

👍 미들웨어의 역할

• 요청 본문(body), 쿠키등의 데이터를 파싱
• 요청에 대한 로깅을 수행
• 인증(Authentication) 및 인가(Authorization) 처리
• 오류(Error)를 처리

 

💣 에러처리 미들웨어

Express는 특별한 에러 처리 미들웨어를 제공합니다.

app.use((err, req, res, next) => {
  console.error(err.stack)
  res.status(500).send('Something broke!')
})

에러처리 미들웨어는 (err, req, res, next)와 같이 4개의 인수를 받는 함수로 정의됩니다.

일반적인 미들웨어 체인에서 오류가 발생하면 Express는 이 에러 처리 미들웨어를 호출하여 오류를 처리합니다.

 

📖 본문 파싱 미들웨어

express.urlencoded와 express.json 미들웨어는 Express.js에서 요청 본문(body)의 데이터를 파싱하기 위해 사용됩니다.

• 클라이언트가 보낸 데이터를 서버에서 사용할 수 있도록 도와줍니다.

 

express.urlencoded

app.use(express.urlencoded({ extended: true }));

• HTML 폼을 통해 제출된 데이터를 파싱하는 미들웨어

 

express.json

app.use(express.json());

• application/json 형식으로 전송된 JSON 데이터를 파싱합니다

 

↗️ 라우터

라우팅은 클라이언트의 요청 URL에 따라 적절한 핸들러 함수를 연결하는 과정입니다.

Express.js는 app.get(), app.post() 등의 메서드를 통해 라우팅을 간단하게 설정할 수 있습니다.

• app.get(path, handler): 특정 path로 들어온 GET 요청 처리
• app.post(path, handler): 특정 path로 들어온 POST 요청 처리

// hello.js
const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
    res.send('Hello, Router !');
});

module.exports = router;

// express.js
const express = require("express");
const app = express();
const port = 3000;

const helloRouter = require("./hello");

app.use("/", helloRouter); // 경로에 미들웨어 장착

app.use((req, res, next) => {
  // 다른곳 진입했을경우 실행
  res.status(404).send("Not Found");
});

app.listen(port, () => {
  console.log(port, "번 포트에서 대기 중");
});

 

 

🖥️ 실행

$npx node express.js

----------

3000 번 포트에서 대기 중

📚 Ref.

https://velog.io/@hbin12212/Express.js로-간단한-서버-만들기

https://brunch.co.kr/@uxn00b/243

https://expressjs.com/ko/guide/using-middleware.html

https://expressjs.com/ko/guide/error-handling.html

https://inpa.tistory.com/entry/EXPRESS-📚-익스프레스-설치-사용해보기

https://inpa.tistory.com/entry/EXPRESS-📚-미들웨어-💯-이해-정리

https://doozi0316.tistory.com/entry/Nodejs란-NPM이란-NVM이란