# Express examples and more

# Express examples

> Explore a collection of Express.js application examples covering various use cases, integrations, and advanced configurations to help you learn and build your projects.

# Express examples

This page contains list of examples using Express.

- [auth](https://github.com/expressjs/express/tree/master/examples/auth) - Authentication with login and password
- [content-negotiation](https://github.com/expressjs/express/tree/master/examples/content-negotiation) - HTTP content negotiation
- [cookie-sessions](https://github.com/expressjs/express/tree/master/examples/cookie-sessions) - Working with cookie-based sessions
- [cookies](https://github.com/expressjs/express/tree/master/examples/cookies) - Working with cookies
- [downloads](https://github.com/expressjs/express/tree/master/examples/downloads) - Transferring files to client
- [ejs](https://github.com/expressjs/express/tree/master/examples/ejs) - Working with Embedded JavaScript templating (ejs)
- [error-pages](https://github.com/expressjs/express/tree/master/examples/error-pages) - Creating error pages
- [error](https://github.com/expressjs/express/tree/master/examples/error) - Working with error middleware
- [hello-world](https://github.com/expressjs/express/tree/master/examples/hello-world) - Simple request handler
- [markdown](https://github.com/expressjs/express/tree/master/examples/markdown) - Markdown as template engine
- [multi-router](https://github.com/expressjs/express/tree/master/examples/multi-router) - Working with multiple Express routers
- [mvc](https://github.com/expressjs/express/tree/master/examples/mvc) - MVC-style controllers
- [online](https://github.com/expressjs/express/tree/master/examples/online) - Tracking online user activity with `online` and `redis` packages
- [params](https://github.com/expressjs/express/tree/master/examples/params) - Working with route parameters
- [resource](https://github.com/expressjs/express/tree/master/examples/resource) - Multiple HTTP operations on the same resource
- [route-map](https://github.com/expressjs/express/tree/master/examples/route-map) - Organizing routes using a map
- [route-middleware](https://github.com/expressjs/express/tree/master/examples/route-middleware) - Working with route middleware
- [route-separation](https://github.com/expressjs/express/tree/master/examples/route-separation) - Organizing routes per each resource
- [search](https://github.com/expressjs/express/tree/master/examples/search) - Search API
- [session](https://github.com/expressjs/express/tree/master/examples/session) - User sessions
- [static-files](https://github.com/expressjs/express/tree/master/examples/static-files) - Serving static files
- [vhost](https://github.com/expressjs/express/tree/master/examples/vhost) - Working with virtual hosts
- [view-constructor](https://github.com/expressjs/express/tree/master/examples/view-constructor) - Rendering views dynamically
- [view-locals](https://github.com/expressjs/express/tree/master/examples/view-locals) - Saving data in request object between middleware calls
- [web-service](https://github.com/expressjs/express/tree/master/examples/web-service) - Simple API service

## Additional examples

These are some additional examples with more extensive integrations.

경고

이 정보는 Expressjs 팀에서 관리하지 않는 서드파티 사이트, 제품 또는 모듈에 관한 것입니다. 여기에 나열된다고 해서 Expressjs 프로젝트 팀이 이를 보증하거나 추천한다는 의미는 아닙니다.

- [prisma-fullstack](https://github.com/prisma/prisma-examples/tree/latest/pulse/fullstack-simple-chat) - Fullstack app with Express and Next.js using [Prisma](https://www.npmjs.com/package/prisma) as an ORM
- [prisma-rest-api-ts](https://github.com/prisma/prisma-examples/tree/latest/orm/express) - REST API with Express in TypeScript using [Prisma](https://www.npmjs.com/package/prisma) as an ORM

  [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/examples.md          )

---

# 자주 묻는 질문(FAQ)

> Find answers to frequently asked questions about Express.js, including topics on application structure, models, authentication, template engines, error handling, and more.

# 자주 묻는 질문(FAQ)

## 애플리케이션을 어떻게 구조화해야 합니까?

이 질문에는 정확한 답이 없습니다. 그 답은
애플리케이션의 규모 및 참여하는 팀의 규모에 따라 달라질 수 있습니다. 최대한의
유연성을 유지하기 위하여, Express에는 구조에 대한 전제 조건이 없습니다.

라우트 및 기타 애플리케이션 특정 로직은 원하는 많큼 많은 파일에 존재할 수 있으며,
선호하는 모든 디렉토리 구조에 존재할 수 있습니다. 도움을 받으려면
다음의 예를 확인하십시오.

- [Route listings](https://github.com/expressjs/express/blob/4.13.1/examples/route-separation/index.js#L32-47)
- [Route map](https://github.com/expressjs/express/blob/4.13.1/examples/route-map/index.js#L52-L66)
- [MVC style controllers](https://github.com/expressjs/express/tree/master/examples/mvc)

또한, 이러한 패턴을 간략화할 수 있는 다음과 같은 Express용 써드파티 확장기능이 존재합니다.

- [Resourceful routing](https://github.com/expressjs/express-resource)

## 모델을 어떻게 정의해야 합니까?

Express에는 데이터베이스의 개념이 없습니다. 이러한 개념은
써드파티 Node 모듈에 따라 달라지며, 따라서 개발자는
거의 모든 데이터베이스를 사용할 수 있습니다.

모델 중심의 Express 기반 프레임워크에 대해서는 [LoopBack](http://loopback.io)을 참조하십시오.

## 어떻게 사용자를 인증할 수 있습니까?

인증은 또 다른 주관적인 영역이며, Express는
이에 관여하지 않습니다. 개발자는 자신이 원하는 어떠한 인증 체계라도 사용할 수 있습니다.
사용자 이름 / 비밀번호 체계에 대해서는 [이 예제](https://github.com/expressjs/express/tree/master/examples/auth)를 참조하십시오.

## Express는 어느 템플리트 엔진을 지원합니까?

Express는 `(path, locals, callback)` 시그니처를 준수하는 모든 템플리트 엔진을 지원합니다.
템플리트 엔진 인터페이스 및 캐싱을 정규화하려면
[consolidate.js](https://github.com/visionmedia/consolidate.js)
프로젝트를 참조하여 지원을 받으십시오. 목록에 포함되지 않은 템플리트 엔진이 Express 시그니처를 지원할 수도 있습니다.

For more information, see [Using template engines with Express](https://expressjs.com/ko/guide/using-template-engines.html).

## 404 응답을 어떻게 처리해야 합니까?

Express에서 404 응답은 오류로 인해 발생하는 결과가 아니며, 따라서
오류 핸들러(error-handler) 미들웨어는 이를 파악하지 않습니다. 이렇게 작동하는 이유는
404 응답은 단순히 실행해야 할 추가적인 작업이 없다는 것,
즉 Express는 모든 미들웨어 함수 및 라우트를 실행했으며 이들 중 어느 것도
응답하지 않았다는 것을 나타내기 때문입니다. 이를 처리하려면
다음과 같이 404 응답을 처리하기 위한 미들웨어 함수를 스택의 가장 아래(다른 모든 함수의 아래)에
추가하기만 하면 됩니다.

```
app.use((req, res, next) => {
  res.status(404).send("Sorry can't find that!")
})
```

Add routes dynamically at runtime on an instance of `express.Router()`
so the routes are not superseded by a middleware function.

## 오류 핸들러를 어떻게 설정해야 합니까?

오류 처리 미들웨어는 다른 미들웨어와 동일한 방식으로 정의할 수 있지만,
다음과 같이 오류 처리 함수는 3개가 아닌 4개의 인수, 구체적으로 말하면 `(err, req, res, next)` 시그니처를 갖는다는 점이 다릅니다.

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

자세한 정보는 [오류 처리](https://expressjs.com/ko/guide/error-handling.html)를 참조하십시오.

## 일반적인 HTML은 어떻게 렌더링해야 합니까?

렌더링할 필요가 없습니다! `res.render()` 함수를 이용해 HTML을 “렌더링”할 필요는 없습니다.
특정한 파일을 렌더링해야 하는 경우에는 `res.sendFile()` 함수를 사용하십시오.
하나의 디렉토리에서 여러 자산을 제공하는 경우에는 `express.static()`
미들웨어 함수를 사용하십시오.

## What version of Node.js does Express require?

- [Express 4.x](https://expressjs.com/ko/4x/api.html) requires Node.js 0.10 or higher.
- [Express 5.x](https://expressjs.com/ko/5x/api.html) requires Node.js 18 or higher.

  [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/faq.md          )

---

# Express 애플리케이션 생성기

> Learn how to use the Express application generator tool to quickly create a skeleton for your Express.js applications, streamlining setup and configuration.

# Express 애플리케이션 생성기

애플리케이션의 골격을 신속하게 작성하려면 애플리케이션 생성기 도구인 `express`를 사용하십시오.

You can run the application generator with the `npx` command (available in Node.js 8.2.0).

```
$ npx express-generator
```

For earlier Node versions, install the application generator as a global npm package and then launch it:

```
$ npm install -g express-generator
$ express
```

다음과 같이 `-h` 옵션을 이용해 명령의 옵션을 표시하십시오.

```
$ express -h

  Usage: express [options] [dir]

  Options:

    -h, --help          output usage information
        --version       output the version number
    -e, --ejs           add ejs engine support
        --hbs           add handlebars engine support
        --pug           add pug engine support
    -H, --hogan         add hogan.js engine support
        --no-view       generate without view engine
    -v, --view <engine> add view <engine> support (ejs|hbs|hjs|jade|pug|twig|vash) (defaults to jade)
    -c, --css <engine>  add stylesheet <engine> support (less|stylus|compass|sass) (defaults to plain css)
        --git           add .gitignore
    -f, --force         force on non-empty directory
```

예를 들면, 다음의 예에서는 *myapp_라는 이름의 Express 앱을 현재 작업 디렉토리에 작성합니다. The app will be created in a folder named _myapp* in the current working directory and the view engine will be set to [Pug](https://pugjs.org/):

```
$ express --view=pug myapp

   create : myapp
   create : myapp/package.json
   create : myapp/app.js
   create : myapp/public
   create : myapp/public/javascripts
   create : myapp/public/images
   create : myapp/routes
   create : myapp/routes/index.js
   create : myapp/routes/users.js
   create : myapp/public/stylesheets
   create : myapp/public/stylesheets/style.css
   create : myapp/views
   create : myapp/views/index.pug
   create : myapp/views/layout.pug
   create : myapp/views/error.pug
   create : myapp/bin
   create : myapp/bin/www
```

이후 다음과 같이 종속 항목을 설치하십시오.

```
$ cd myapp
$ npm install
```

MacOS 또는 Linux에서는 다음 명령을 사용하여 앱을 실행하십시오.

```
$ DEBUG=myapp:* npm start
```

Windows에서는 다음 명령을 사용하십시오.

```
> set DEBUG=myapp:* & npm start
```

다음의 명령을 이용해 `express`를 설치하십시오.

```
PS> $env:DEBUG='myapp:*'; npm start
```

이후 브라우저에서 `http://localhost:3000/`을 로드하여 앱에 액세스하십시오.

생성된 앱은 다음과 같은 디렉토리 구조를 갖습니다.

```
.
├── app.js
├── bin
│   └── www
├── package.json
├── public
│   ├── images
│   ├── javascripts
│   └── stylesheets
│       └── style.css
├── routes
│   ├── index.js
│   └── users.js
└── views
    ├── error.pug
    ├── index.pug
    └── layout.pug

7 directories, 9 files
```

생성기에 의해 작성된 앱 구조는 Express 앱을 구조화하는 여러 방법 중 하나에 불과합니다. 이러한 구조를 사용하거나 사용자의 요구사항에 가장 적합하도록 구조를 수정하십시오.

   [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/generator.md          )

---

# Hello world 예제

> Get started with Express.js by building a simple 'Hello World' application, demonstrating the basic setup and server creation for beginners.

# Hello world 예제

기본적으로 이 앱은 여러분이 작성할 수 있는 가장 간단한 Express 앱일 것입니다. 이 앱은 하나의 파일로 된 앱이며 [Express 생성기](https://expressjs.com/ko/starter/generator.html)를 통해 얻게 되는 앱과는 같지 *않습니다*. (이 예제와 달리 Express 생성기를 통해 얻게 되는 앱은 다양한 목적을 위한 여러 JavaScript 파일, Jade 템플리트 및 하위 디렉토리를 포함하는 전체 앱에 대한 스캐폴딩을 작성합니다.)

```
const express = require('express')
const app = express()
const port = 3000

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

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})
```

앱은 서버를 시작하며 3000번 포트에서 연결을 청취합니다. 앱은 루트 URL(`/`) 또는 _라우트_에
대한 요청에 “Hello World!”로 응답합니다. 다른 모든 경로에 대해서는 **404 Not Found**로 응답합니다.

### Running Locally

먼저, `myapp`이라는 이름의 디렉토리를 작성한 후 이 디렉토리로 이동하여 `npm init`를 실행하십시오. 이후 [설치 안내서](https://expressjs.com/ko/starter/installing.html)에 따라 `express`를 종속 항목으로서 설치하십시오.

`myapp` 디렉토리에 `app.js`라는 이름의 파일을 작성한 후 다음과 같은 코드를 추가하십시오.

`req`(요청) 및 `res`(응답)는 Node가 제공하는 동일한 오브젝트이며, 따라서
`req.pipe()`, `req.on('data', callback)` 그리고 Express의 관여가 필요 없는 다른 모든 항목을 호출할 수 있습니다.

다음의 명령을 이용하여 앱을 실행하십시오.

```
$ node app.js
```

이후 브라우저에서 [http://localhost:3000/](http://localhost:3000/)을 로드하여 결과물을 확인하십시오.

  [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/hello-world.md          )

---

# 설치

> Learn how to install Express.js in your Node.js environment, including setting up your project directory and managing dependencies with npm.

# 설치

[Node.js](https://nodejs.org/)가 이미 설치되었다고 가정한 상태에서, 애플리케이션을 보관할 디렉토리를 작성하고 그 디렉토리를 작업 디렉토리로 설정하십시오.

- [Express 4.x](https://expressjs.com/ko/4x/api.html) requires Node.js 0.10 or higher.
- [Express 5.x](https://expressjs.com/ko/5x/api.html) requires Node.js 18 or higher.

```
$ mkdir myapp
$ cd myapp
```

`npm init` 명령을 이용하여 애플리케이션에 대한 `package.json` 파일을 작성하십시오.
`package.json`의 작동 원리에 대한 자세한 정보는 [Specifics of npm’s package.json handling](https://docs.npmjs.com/files/package.json)을 참조하십시오.

```
$ npm init
```

이 명령을 실행하면 애플리케이션의 이름 및 버전과 같은 몇 가지 정보에 대해 프롬프트합니다.
지금은 다음의 항목을 제외한 대부분의 항목에서 ENTER 키를 눌러 기본값을 수락할 수 있습니다.

```
entry point: (index.js)
```

기본 파일의 이름을 `app.js`로 입력하거나 자유롭게 입력하십시오. 기본 파일의 이름을 `index.js`로 입력하기 원하는 경우에는 ENTER 키를 눌러 제안된 기본 파일 이름을 수락하십시오.

이제 `myapp` 디렉토리에 Express를 설치한 후 종속 항목 목록에 저장하십시오. 예를 들면 다음과 같습니다.

```
$ npm install express
```

Express를 임시로 설치하고 종속 항목 목록에 추가하지 않으려면, 다음과 같이 `--save` 옵션을 생략하십시오.

```
$ npm install express --no-save
```

`--save` 옵션을 통해 설치된 Node 모듈은 `package.json` 파일 내의 `dependencies` 목록에 추가됩니다. 이후 `app` 디렉토리에서 `npm install`을 실행하면 종속 항목 목록 내의 모듈이 자동으로 설치됩니다.

   [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/installing.md          )

---

# Express에서 정적 파일 제공

> Understand how to serve static files like images, CSS, and JavaScript in Express.js applications using the built-in 'static' middleware.

# Express에서 정적 파일 제공

이미지, CSS 파일 및 JavaScript 파일과 같은 정적 파일을 제공하려면 Express의 기본 제공 미들웨어 함수인 `express.static`을 사용하십시오.

The function signature is:

```
express.static(root, [options])
```

The `root` argument specifies the root directory from which to serve static assets.
For more information on the `options` argument, see [express.static](https://expressjs.com/ko/5x/api.html#express.static).

예를 들면, 다음과 같은 코드를 이용하여 `public`이라는 이름의 디렉토리에 포함된 이미지, CSS 파일 및 JavaScript 파일을 제공하십시오.

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

이제 다음과 같이 `public` 디렉토리에 포함된 파일을 로드할 수 있습니다.

```
http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html
```

Express는 정적 디렉토리에 대해 상대적으로 파일을 검색하며, 따라서 정적 디렉토리의 이름은 URL의 일부가 아닙니다.

여러 개의 정적 자산 디렉토리를 이용하려면 다음과 같이 `express.static` 미들웨어 함수를 여러 번 호출하십시오.

```
app.use(express.static('public'))
app.use(express.static('files'))
```

Express는 `express.static` 미들웨어 함수를 이용해 정적 디렉토리를 설정한 순서대로 파일을 검색합니다.

참고

For best results, [use a reverse proxy](https://expressjs.com/ko/advanced/best-practice-performance.html#use-a-reverse-proxy) cache to improve performance of serving static assets.

To create a virtual path prefix (where the path does not actually exist in the file system) for files that are served by the `express.static` function, [specify a mount path](https://expressjs.com/ko/5x/api.html#app.use) for the static directory, as shown below:

```
app.use('/static', express.static('public'))
```

이제 `/static` 경로 접두부를 통해 `public` 디렉토리에 포함된 파일을 로드할 수 있습니다.

```
http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html
```

그러나 `express.static` 함수에 제공되는 경로는 `node` 프로세스가 실행되는 디렉토리에 대해 상대적입니다. Express 앱을 다른 디렉토리에서 실행하는 경우에는 다음과 같이 제공하기 원하는 디렉토리의 절대 경로를 사용하는 것이 더 안전합니다.

```
const path = require('path')
app.use('/static', express.static(path.join(__dirname, 'public')))
```

For more details about the `serve-static` function and its options, see  [serve-static](https://expressjs.com/resources/middleware/serve-static.html).

  [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/starter/static-files.md          )

---

# Version Support

> Find information about the support schedule for different Express.js versions, including which versions are currently maintained and end-of-life policies.

# Version Support

Only the latest version of any given major release line is supported.

Versions that are EOL (end-of-life) *may* receive updates for critical security vulnerabilities, but the Express team offers no guarantee and does not plan to address or release fixes for any issues found.

| Major Version | Minimum Node.js Version | Support Start Date | Support End Date |
| --- | --- | --- | --- |
| v5.x | 18 | September 2024 | ongoing |
| v4.x | 0.10.0 | April 2014 | ongoing |
| v3.x | 0.8.0 | October 2012 | July 2015 |
| v2.x | 0.4.1 | March 2011 | July 2012 |
| v1.x | 0.2.0 | December 2010 | March 2011 |
| v0.14.x | 0.1.98 | December 2010 | December 2010 |

## Commercial Support Options

If you are unable to update to a supported version of Express, please contact one of our partners to receive security updates:

- [HeroDevs Never-Ending Support](http://www.herodevs.com/support/express-nes?utm_source=expressjs&utm_medium=link&utm_campaign=express_eol_page)

 [Edit this page](https://github.com/expressjs/expressjs.com/edit/gh-pages/ko/support/index.md          )
