아마존 E-commerce 클론 -5) Node.js server 만들기

이번엔 서버를 만들어보자. 

 

먼저 amazon 폴더로 가서 (최상위)

 

npm init으로 서버를 설치해준다. 

backend 폴더도 생성해준다. 

 

 

 

backend>server.js파일을 만들고 

npm install express해준다. 

다음 익스프레스와 서버를 연결하는 가장 기본적인 코드로 실행여부를 확인한다. 

 

package.json파일로가서 다음과 같이 타입을 모듈추가해준다. 

{
  "name": "amazon-clone",
  "type":"module",
  "version": "1.0.0",
  "description": "e-commerce clone",
  "main": "index.js",

 

server.js

import express from 'express';

const app = express();


app.get('/', (req, res)=>{
    res.send('Server is ready');
})

app.listen(5000, ()=>{
    console.log('Serve at http://localhost:5000');
})

터미널에 node backend/server.js실행시켜본다. 

 

 

정상작동

 

우리가 작성했던 data.js(상품의 타입)을 복사해서 백엔드 폴더로 가지고 올 것이다. 

 

 

이번엔 server.js에 라우트를 생성해서 data를 가지고 올것이다. 

 

 

다음과 같이 입력하고 다시 서버를 켜보면, 

다음과 같이 상품정보들이 다 들어와있는 것을 확인할 수 있다. 

 

 

추가로 로드몬을 설치해주자. 

npm install --save-dev nodemon해주고 

package.json파일을 다음과 같이 추가해준다. 

  "scripts": {
    "start":"nodemon --watch backend --exec node --experimental-modules backend/server.js"
    },

 

마지막으로 server.js파일에 다음과 같이 포트정보를 수정해주자. 

import express from 'express';
import data from './data.js';

const app = express();


app.get('/api/products' ,(req, res)=>{
    res.send(data.products);
})
app.get('/', (req, res)=>{
    res.send('Server is ready');
})


const port = proccess.env.PORT ||5000;
app.listen(port, ()=>{
    console.log(`Serve at http://localhost:${port}`);
})