PROGRAMING/FULL STACK

[Back End] Setting up an Express server

donghunl 2024. 3. 9. 09:21
반응형

Express 서버 설정하기.

 

서버사이드를 구성하기 위해서 Express server에서 Node.js를 이용하여 서버측을 구성하도록 합니다.

지금까지 이용한 클라이언트측 Front End 폴더에서 벗어나 새로운 Back End 폴더를 생성해서 그곳에서 서버측 프로젝트를 완성하도록 하겠습니다. 

 

그러기 위해서 Terminal에서 새로운 폴더를 구성하여 Back End 프로젝트를 생성합니다. 명령어는 아래와 같습니다.

 

새로운 VS Code 프로젝트 창이 열립니다.

그곳에서 이제부터 Back End 작업을 합니다. 먼저 NPM 패키지를 초기화합니다. 명령어는 다음과 같습니다.

npm init -y

 

package.json파일이 생성되고 이제 Express를 설치합니다. 명령어는 다음과 같습니다.

 

npm install express

 

Express 설치가 완료되면 소스 코드를 저장할 소스 폴더를 만들어줍니다.

 

import, export같은 최신 javascript 구문을 사용할수 있도록 pakage.json파일에 다음 구문을 추가해줍니다.

"type": "module",

 

src폴더 안에 모든 서버코드를 작성할 server.js파일을 만들어주고 다음과 같은 코드를 작성합니다.

server.js

import express from 'express';

const app = express();

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

app.listen(8000, () => {
    console.log('Server is listening on port 8000');
});

 

서버 확인을 위해 다음 명령어를 실행해서 "Server is listening on 8000" 이 표시 되는지 확인합니다.

node src/server.js

 

그리고 브라우저에서는 다음과 같이 확인할수 있습니다.

 

포트 8000번으로 Express를 사용할 준비가 되었습니다.

반응형