익스프레스 프로젝트 시작하기
먼저 learn-express 폴더를 만듭니다. 항상 package.json을 제일 먼저 생성해야 합니다. package.json을 제일 먼저 생성해야 합니다. package.json을 생성해주는 npm init 명령어를 콘솔에서 호출해도 되고 직접 파일을 만들어도 됩니다. version이나 description, author, license는 원하는 대로 자유롭게 수정해도 괜찮습니다.
package.json
{
"name": "learn-express",
"version": "1.0.0",
"description": "익스프레스를 배우자",
"main": "app.js",
"scripts": {
"start": "nodemon app"
},
"author": "cherry",
"license": "MIT"
}
콘솔
$ npm i express
$ npm i -D nodemon
scripts 부분에 start 속성은 잊지 말고 넣어줘야 합니다. nodemon app을 하면 app.js를 nodemon으로 실행한다는 뜻입니다.
서버 코드에 수정 코드에 수정 수항이 생길 때마다 매번 서버를 재시작하기는 귀찮으므로 nodemon 모듈로 서버를 자동으로 재시작합니다. 앞으로 서버 코드를 수정하면 nodemon이 서버를 자동으로 재시작합니다. nodemon이 실행되는 콘솔에 rs를 입력해서 수동으로 재시작할 수도 있습니다.
nodemon은 개발용으로만 사용하는 것을 권장합니다. 배포 후에는 서버 코드가 빈번하게 변경될 일이 없으므로 nodemon을 사용하지 않아도 됩니다.
서버의 역할을 할 app.js를 다음과 같이 작습니다.
const express = require("express");
const app = express();
app.set("port", process.env.PORT || 3000);
app.get("/", (req, res) => {
res.send("Hello, Express");
});
app.listen(app.get("port"), () => {
console.log(app.get("port"), "번 포트에서 대기 중");
});
Express 모듈을 실행해 app 변수에 할당합니다. 익스프레스 내부에 http 모듈이 내장되어 있으므로 서버의 역할을 할 수 있습니다.
app.set('port', 포트)로 서버가 실행될 포트를 설정합니다. process.env 객체에 PORT 속성이 있다면 그 값을 사용하고, 없다면 기본값으로 3000번 포트를 이용하도록 되어 있습니다. 이렇게 app.set(키, 값)을 사용해서 데이터를 저장할 수 있습니다. 나중에 데이터를 app.get(키)로 가져올 수 있습니다.
app.get(주소, 라우터)는 주소에 대한 GET 요청이 올 때 어떤 동작을 할지 적는 부분입니다. 메개변수 req는 요청에 관한 정보가 들어 있는 객체이고, res는 응답에 관한 정보가 들어 있는 객체입니다. 현재 GET / 요청 시 응답으로 Hello, Express를 전송합니다. 익스프레스에서는 res.write나 res.end 대신 res.send를 사용하면 됩니다.
GET 요청 외에도 POST, PUT, PATCH, DELTE, OPTIONS에 대한 라우터를 위한 app.post, app.put, app.patch, app.delete, app.options 메서드가 존재합니다.
listen을 하는 부분은 http 웹 서버와 동일합니다. 포트를 연결하고 서버를 실행합니다. 포트는 app.get('port')로 가져왔습니다.
콘솔
$ npm start
> learn-express@1.0.0 start
> nodemon app
[nodemon] 3.1.10
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,mjs,cjs,json
[nodemon] starting `node app.js`
3000 번 포트에서 대기 중
http://localhost:3000으로 접속하면 다음과 같은 페이지가 뜰 것입니다.
단순한 문자열 대신 HTML로 응답하고 싶다면 res.sendFile 메서드를 사용하면 됩니다. 단, 파일의 경로를 path 모듈을 사용해서 지정해야 합니다.
index.html
<html>
<head>
<meta charset="UTF-8" />
<title>익스프레스 서버</title>
</head>
<body>
<h1>익스프레스</h1>
<p>배워봅시다.</p>
</body>
</html>
app.js
const express = require("express");
const path = require("path");
const app = express();
app.set("port", process.env.PORT || 3000);
app.get("/", (req, res) => {
// res.send('Hello, Express');
res.sendFile(path.join(__dirname, "/index.html"));
});
app.listen(app.get("port"), () => {
console.log(app.get("port"), "번 포트에서 대기 중");
});
localhost:3000에 접속하면 HTML이 표시됩니다.
'프로그래밍 언어 > NODE JS' 카테고리의 다른 글
| morgan (0) | 2025.06.16 |
|---|---|
| 자주 사용하는 미들웨어 (0) | 2025.06.13 |
| 패키지 배포하기 (0) | 2025.06.07 |
| 기타 npm 명령어 (2) | 2025.06.07 |
| 패키지 버전 이해하기 (0) | 2025.06.04 |
