[ Node.js ] Express 라이브러리 사용하기(IntelliJ)

 

 

Express ?

Node.js 환경에서 사용되는 웹 애플리케이션 프레임워크

웹 서버를 쉽게 구축할 수 있도록 도와주는 도구

---

 

인텔리제이를 실행시킨 뒤 [NEW PROJECT] 버튼을 눌러준다

Generators에서 Express 를 선택해 주고
프로젝트 이름을 입력하고
View Engine을 EJS로 설정해 준다

(기본값은 Pug(Jade)로 설정되어 있었는데 나는 익숙하지가 않아 EJS로 해줬다)

[CREATE]를 눌러주면

 

 

이렇게 자동으로 프로젝트가 생성되는데
package.json 파일도 자동으로 생성된다 (intellij 짱)

 

✅ 설명: package.json

1. 프로젝트의 정보 저장
2. 의존성 관리
3. 스크립드 정의
4. 프로젝트의 시작 및 빌드 설정
5. 배포 및 버전 관리

등 프로젝트의 빌드 및 실행환경, 다양한 패키지를 관리하는데 필요함

 

[ app.js ]

const createError = require('http-errors');
const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const logger = require('morgan');

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

const app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use((err, req, res, next) => {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

 

✅ 설명: 모듈 가져오기

• http-errors: HTTP 오류 상태 코드(예: 404, 500 등)를 생성하는 모듈 
• express: Express.js는 Node.js에서 사용되는 웹 프레임워크로, 서버를 설정하고 요청을 처리하는 데 필요한 기능을 제공
• path: 파일 및 디렉토리 경로를 처리하는 내장 모듈
• cookie-parser: 요청에 포함된 쿠키를 파싱하는 미들웨어
• morgan: HTTP 요청 로그를 기록하는 미들웨어

 

✅ 설명: View 엔진 설정

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

• app.set('views', ...): 템플릿 파일이 저장될 디렉토리 위치를 설정
• app.set('view engine', 'ejs'): EJS(Embedded JavaScript) 템플릿 엔진을 사용하도록 설정

 

✅ 설명: 미들웨어 설정

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

• app.use(logger('dev')): morgan을 사용하여 HTTP 요청 로그를 개발용으로 출력
• app.use(express.json()): 클라이언트가 보낸 JSON 형식의 데이터를 파싱하는 미들웨어
• app.use(express.urlencoded({ extended: false })): URL-encoded 데이터를 파싱하는 미들웨어
• app.use(cookieParser()): 요청에서 쿠키를 파싱하여 req.cookies에 저장
• app.use(express.static(path.join(__dirname, 'public'))): public 디렉토리 안에 있는 정적 파일(css, js, 이미지 등)을 클라이언트가 접근할 수 있도록 설정

 

✅ 설명: 라우터 설정

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

app.use('/', indexRouter);
app.use('/users', usersRouter);

• app.use('/', indexRouter): 기본 URL(/)에서 요청을 처리할 해당 라우터로 연결
• app.use('/users', usersRouter): /users 경로로 시작하는 요청을 처리할 라우터로 **usersRouter**를 설정

 

✅ 설명: 404 에러 핸들링

app.use(function(req, res, next) {
  next(createError(404));
});

• 404 에러 핸들러: 클라이언트가 요청한 URL이 정의되지 않은 경우, next(createError(404))를 호출하여 404 에러를 발생시키고,  에러 핸들러로 넘김

 

✅ 설명: 에러 처리 핸들링

app.use((err, req, res, next) => {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

 

• 에러 처리 미들웨어: 서버에서 발생한 에러를 처리함. 에러 메시지와 에러 객체를 res.locals에 저장하고, 이를 템플릿 파일 error.ejs에 전달하여 에러 페이지를 렌더링해줌
  • 개발 환경에서는 상세 에러 메시지를 출력하고, 배포 환경에서는 사용자에게 친숙한 에러 메시지만 보여줍니다.
• res.status(err.status || 500): 에러에 맞는 HTTP 상태 코드(404, 500 등)를 설정함. (err.status가 없으면 기본적으로 500)

 

✅ 설명: 모듈로 내보내기

module.exports = app;

• 이 파일에서 생성한 app 객체를 외부로 내보내는 역할. 외부에서 require()로 가져와서 사용 가능

 

 

 

이제 터미널에서 

$ npm start

라는 명령어를 입력하면 서버가 실행된다

 

제대로 실행됐는지 확인하기 위해서

http://localhost:3000/

 

주소창에 입력하고 확인해 보면

이렇게 연결이 되어있는 것을 확인할 수 있음

 

프로젝트 생성 완료!