[Nodejs] Express 에서 router 연결

Node js로 웹 페이지를 개발 할 수 있는 프레임워크 중 하나인 Express 에서 클라이언트 측 요청에 대한 처리 방법을

 

일반적으로 프로젝트 폴더 바로 아래에 index.js (이름 변경 가능) 파일 내 기재한다.

 

// index.js

const express = require("express") // 프레임워크 호출
const app = express(); // 실행
const port = 3000();


// 1. 도메인 + '/' (초기 페이지) 접속 시 처리 로직
app.get('/' (req, res) => {
	res.send('Hello world!');
}

// 2. 도메인 + '/goods' (상품 페이지) 접속 시 처리 로직
app.get('/goods' (req, res) => {
	res.send('This is goods Page');
}

// 3. 도메인 + '/boards' (게시판 페이지) 접속 시 처리 로직
app.get('/boards' (req, res) => {
	res.send('This is boards Page');
}

위의 경우에는 코드상으로 크게 2 가지의 서비스 (1. 상품 페이지 2. 게시판)가  존재하는데

 

각 서비스에서 제공하는 기능들 (ex. 게시글 등록, 수정, 삭제 등)을 한 파일 (여기서는 index.js)에서 수정하는 경우,

 

서비스 및 기능이 많아질수록 각 서비스를 처리하는 코드가 어디에 위치하는지 어려워져, 유지 및 보수에 더 많은 시간이 들 것이다.

 

// 서비스별 기능 1개 추가 예시

const express = require("express") // 프레임워크 호출
const app = express(); // 실행
const port = 3000();


// 1. 도메인 + '/' (초기 페이지) 접속 시 처리 로직
app.get('/' (req, res) => {
	res.send('Hello world!');
}

// 2. 도메인 + '/goods' (상품 페이지) 접속 시 처리 로직
app.get('/goods' (req, res) => {
	res.send('This is goods Page');
}

// 2 - 1. 도메인 + '/goods' (상품 페이지) 상품 등록 로직
app.get('/goods' (req, res) => {
	const data = {
    	title : "title",
        price : 10000
    }
    await Goods.create({ ...data });
	res.send('Post complete');
}

// 3. 도메인 + '/boards' (게시판 페이지) 접속 시 처리 로직
app.get('/boards' (req, res) => {
	res.send('This is boards Page');
}

// 3 - 1. 도메인 + '/boards' (게시판 페이지) 상품 등록 로직
app.get('/boards' (req, res) => {
	const data = {
    	title : "new_title",
        content : "new_content"
    }
    await Boards.create({ ...data });
	res.send('Post complete');
}

비교적 길지 않다고 생각되는 로직으로 각 서비스 별로 1개씩 추가 해주었을 뿐인데, 눈에 띄게 양이 늘어난 것이 보인다.

 

기능 별로 코드를 나눠서 관리하기 위해 파일을 분리하는 것이 바람직하다.

 

사용 방법은, index.js 파일 위치와 동일한 곳에 router 폴더를 만든 후, 서비스 이름(여기서는 goods.js) 을 가진 js 파일을 생성한다.

 

// goods.js 파일

const express = require('express');
const router = express.Router(); 

// 2. 도메인 + '/goods' (상품 페이지) 접속 시 처리 로직
router.get('/goods' (req, res) => {
	res.send('This is goods Page');
}

// 2 - 1. 도메인 + '/goods' (상품 페이지) 상품 등록 로직
router.get('/goods' (req, res) => {
	const data = {
    	title : "title",
        price : 10000
    }
    await Goods.create({ ...data });
	res.send('Post complete');
}

moules.export = router; // index.js 에서 호출하기 위해 패키지화

 

그 후 index.js 파일에서 require 로 호출하며, app.use 를 이용해 관련 요청이 들어오는 경우

goods.js 에서 먼저 찾아본 후 처리한다.

 

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

const goodsRouter = require('./routes/goods.js'); // goods.js 파일과 연

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

app.use("/api", [goodsRouter]); // 도메인 + api + @ url 요청 시 goods.js 파일에서 먼저 탐색

Express 에서 위 파일의 처리 방식은 위에서 부터 아래로 순차적으로 진행된다.

 

위를 기준으로 /api/goods 로 POST 혹은 GET을 요청한다면 app.use 내 goods.js 파일에서 찾아서 진행할 것이나,

 

그 윗 줄인 app.get('/') ... 의 요청 처리 url 이 /api/goods 인 경우에는 Hello world 를 반환할 것이다.

 

그러므로 미들 웨어 설정을 하기 전에 먼저, 분산 시켜야하는 서비스들의 코드 위치를 고려해야 한다.