express 모듈을 이용하여 React의 서버를 구축하고자 한다.

클라이언트와 구분하기 위해 'server'라는 디렉토리와 js파일을 하나 생성한다.

Express 모듈 설치 및 적용

sever.js에는 서버에 관한 코드를 작성한다. 우선 Express 모듈을 설치해야 한다.
express는 node.js의 라이브러리 중 하나로 자바스크립트는 프론트엔드에서 사용할 수 있는 언어였었지만 node.js의 등장으로 백엔드의 영역까지 작업이 가능하게 되었다.

npm install express
yanr add express

모듈 설치 완료 후 sever.js로 이동하여 express모듈을 불러오는 코드와 app이라는 변수에 express를 담는 코드를 작성한다.

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

포트 할당

포트는 서버의 주소이다. 할당된 주소에 정확하게 접근해야 접속이 가능하다.

const PORT = process.env.PORT || 4000;
//4000이라는 포트번호를 서버에 할당

서버 응답 출력

서버를 실행했을 때 , 서버로 부터 응답을 출력하고 싶다면 'app.get' 함수를 사용한다.

app.get('/', (req, res) => {
	res.send(`Okay let's go`)
})

첫번째 인자인 '/'은 경로를 나타내며, 해당 경로로 접속했을때 응답을 렌더하게 된다.

서버 실행하기

express를 담은 app변수와 할당한 포트를 사용해 서버를 불러오자

app의 listen 메소드 사용

app.listen(PORT, () => {
	console.log(`Server on : http://localhost:${PORT}/`);
})

app.listen에 적용된 PORT 번호로 서버를 실행한다. 그리고 반드시 server.js 파일이 있는 디렉토리 경로에 있어야 한다.

해당 서버가 있는 디렉토리(server폴더)로 이동 후

node server.js

서버가 잘 작동한다면 listen에 있는 console.log 함수가 출력이 된다.

그리고 localhost:4000/으로 접속을 하게되면

정상적으로 렌더 완료!!

참고 : https://expressjs.com/