본문으로 건너뛰기

Express.js 개요.

소개

Express.js는 Node.js용 빠르고 최소한의 웹 애플리케이션 프레임워크입니다. Express.js는 웹 애플리케이션과 API를 구축하기 위한 간단하고 강력한 방법을 제공합니다. 강력한 기능 세트와 사용하기 쉬운 문법을 가지고 있어, Express.js는 가장 인기 있는 웹 개발 프레임워크 중 하나가 되었습니다.

역사

Express.js는 TJ Holowaychuk에 의해 2010년에 만들어졌으며, 출시되었습니다. 당시에 사용 가능한 더 복잡하고 기능이 풍부한 프레임워크들에 대한 경량 대안으로 설계되었습니다. Express.js는 출시 이후로 많은 활발한 개발자 커뮤니티를 얻어, Node.js에서 웹 애플리케이션을 구축하기 위한 선택 도구로 자리매김하게 되었습니다.

기능

  1. 라우팅: Express.js를 사용하면 다양한 HTTP 요청을 처리하기 위한 라우트를 정의할 수 있습니다. 다음은 루트 URL ("/")로 GET 요청이 들어올 때 "Hello, World!"라는 응답을 보내는 기본적인 라우트의 예시입니다:
const express = require('express');
const app = express();

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

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 코드를 실행하고 브라우저에서 http://localhost:3000을 방문하면 "Hello, World!"라는 메시지가 표시됩니다.

  1. 미들웨어: Express.js는 미들웨어 함수를 사용하여 요청을 처리하고 추가 작업을 수행합니다. 미들웨어 함수는 로깅, 인증, 오류 처리 등과 같은 작업에 사용될 수 있습니다. 다음은 모든 요청의 URL을 로깅하는 미들웨어 함수의 예시입니다:
const express = require('express');
const app = express();

app.use((req, res, next) => {
console.log(`받은 요청: ${req.url}`);
next();
});

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

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 코드를 실행하고 어떤 URL에 대한 요청을 만들면, 서버는 해당 URL을 콘솔에 기록합니다.

  1. 템플릿 엔진: Express.js는 EJS와 Pug와 같은 다양한 템플릿 엔진을 지원합니다. 다이나믹 HTML 페이지를 렌더링하기 위해 EJS 템플릿 엔진을 사용하는 예시입니다:
const express = require('express');
const app = express();

app.set('view engine', 'ejs');

app.get('/', (req, res) => {
res.render('index', { name: 'John' });
});

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

views라는 디렉토리에 index.ejs라는 파일을 만들고 다음 내용을 추가합니다:

<html>
<head>
<title>Hello, <%= name %></title>
</head>
<body>
<h1>Hello, <%= name %></h1>
</body>
</html>

이 코드를 실행하고 http://localhost:3000을 방문하면 "Hello, John"이라고 표시되는 페이지가 표시됩니다.

  1. 정적 파일: Express.js를 사용하면 CSS와 JavaScript 파일과 같은 정적 파일을 디렉토리에서 직접 제공할 수 있습니다. 다음은 public이라는 디렉토리에서 정적 파일을 제공하는 예시입니다:
const express = require('express');
const app = express();

app.use(express.static('public'));

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

정적 파일(CSS 파일인 styles.css 등)을 public 디렉토리에 위치시킵니다. 그런 다음 HTML에서 다음과 같이 정적 파일을 참조할 수 있습니다:

<link rel="stylesheet" href="/styles.css">
  1. 오류 처리: Express.js는 요청 처리 중 발생하는 오류를 처리하기 위한 오류 처리 미들웨어를 제공합니다. 다음은 오류 처리 미들웨어의 예시로, 오류 메시지를 기록하고 사용자 정의 오류 페이지를 보냅니다:
const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
const error = new Error('오류가 발생했습니다');
next(error);
});

app.use((err, req, res, next) => {
console.error(err.stack);
res.status(500).send('뭔가 잘못되었습니다!');
});

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

http://localhost:3000을 방문하면 오류가 발생하고, 오류 처리 미들웨어가 오류를 기록하고 "뭔가 잘못되었습니다!"라는 메시지를 응답으로 보냅니다.

더 자세한 정보와 예시는 expressjs.com에서 공식 Express.js 문서를 참조할 수 있습니다.

예시

  1. 기본 Express.js 서버:
const express = require('express');
const app = express();

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

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 예시는 기본적인 Express.js 서버를 만들며, 루트 URL ("/")로 GET 요청이 들어오면 "Hello, World!"라는 응답을 보냅니다.

  1. 미들웨어 사용:
const express = require('express');
const app = express();

app.use((req, res, next) => {
console.log(`받은 요청: ${req.url}`);
next();
});

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

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 예시는 Express.js에서 미들웨어 사용하는 방법을 보여줍니다. 미들웨어 함수는 요청을 다음 핸들러로 전달하기 전에 모든 요청의 URL을 기록합니다.

  1. 다이나믹 페이지 렌더링:
const express = require('express');
const app = express();

app.set('view engine', 'ejs');

app.get('/', (req, res) => {
res.render('index', { name: 'John' });
});

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 예시에서는 EJS 템플릿 엔진을 사용하여 다이나믹 HTML 페이지를 렌더링합니다. index.ejs 템플릿 파일은 name 변수를 받아 개인화된 인사말을 표시합니다.

  1. 정적 파일 제공:
const express = require('express');
const app = express();

app.use(express.static('public'));

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 예시는 public 디렉토리에서 정적 파일(CSS, JavaScript 등)을 제공하는 방법을 보여줍니다. 정적 파일은 HTML에서 상대 경로를 사용하여 참조할 수 있습니다.

  1. 오류 처리:
const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
const error = new Error('뭔가 잘못되었습니다');
next(error);
});

app.use((err, req, res, next) => {
console.error(err.stack);
res.status(500).send('뭔가 잘못되었습니다!');
});

app.listen(3000, () => {
console.log('서버가 3000 포트에서 시작되었습니다.');
});

이 예시에서는 루트 URL을 방문할 때 의도적으로 오류가 발생합니다. 오류 처리 미들웨어는 오류 스택 트레이스를 기록하고 "뭔가 잘못되었습니다!"라는 사용자 정의 오류 응답을 보냅니다.

이러한 예시들은 Express.js의 강력함과 유연성을 엿볼 수 있습니다. 공식 문서를 참조하고 다양한 코드 조각을 실험해보면 더 많은 기능과 기능을