Node.js 기초 : spa_mall 만들어보기

1. spa_mall 폴더 생성

2. app.js 파일 생성

3. 새 터미널

4. npm init -y

: npm init을 하는데 생성 순서에 따른 대답은 다 yes이다.

5. npm i express

6. 코드스니펫에서 app.js 예시 가져와서 실행해 보기.

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

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

app.listen(port, () => {
  console.log(port, '포트로 서버가 열렸어요!');
});

7. 확장프로그램 thunder client 설치

thunder client 세부사항

Query 에는 물음표를 기준으로 ?key=value

body 는 json 방식으로 데이터

특별한 프로젝트마다 API 목록을 정리해서 사용할 수 있다.

Collections는 여러가지의 API를 그룹화 시킬 수 있습니다. 

 

 

8. 1차 완료

app.js

const express = require('express');
const app = express();
const port = 3000;
const goodsRouter = require('./routes/goods.js')

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


// localhost:3000/api - goodsRouter
// app.use(express.json());
app.use("/api", [goodsRouter]);

app.post("/", (req, res) => {
    console.log(req.body);
    res.send("기본 URI에 POST메소드가 정상적으로 실행되었습니다")
})

app.get("/", (req, res) => {
    console.log(req.query);
    const obj = {
        "Keykey": "value입니다.",
        "이름입니다": "이름입니다."
    }
    res.json(obj)
})

app.listen(port, () => {
    console.log(port, '포트로 서버가 열렸어요!');
});

app.get("/:id", (req, res) => {
    console.log(req.params)
    res.send(":id URI에 정상적으로 반환되었습니다.")
})

 

routes/goods.js

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

const goods = [
    {
        goodsId: 4,
        name: "상품 4",
        thumbnailUrl:
            "https://cdn.pixabay.com/photo/2016/09/07/02/11/frogs-1650657_1280.jpg",
        category: "drink",
        price: 0.1,
    },
    {
        goodsId: 3,
        name: "상품 3",
        thumbnailUrl:
            "https://cdn.pixabay.com/photo/2016/09/07/02/12/frogs-1650658_1280.jpg",
        category: "drink",
        price: 2.2,
    },
    {
        goodsId: 2,
        name: "상품 2",
        thumbnailUrl:
            "https://cdn.pixabay.com/photo/2014/08/26/19/19/wine-428316_1280.jpg",
        category: "drink",
        price: 0.11,
    },
    {
        goodsId: 1,
        name: "상품 1",
        thumbnailUrl:
            "https://cdn.pixabay.com/photo/2016/09/07/19/54/wines-1652455_1280.jpg",
        category: "drink",
        price: 6.2,
    },
];

router.get("/goods", (req, res) => {
    res.status(200).json({ "goods": goods })
})

router.get("/goods/:goodsId", (req, res) => {
    const { goodsId } = req.params;
    for (const good of goods) {
        if (Number(goodsId) == good.goodsId) {
            result = good;
        }
    }
    res.status(200).json({ "detail": result })
})

module.exports = router;

9. 프로젝트에 mongoose 설치

npm install mongoose

 

10. schemas 폴더 생성

11. schemas > index.js 생성

index.js

const mongoose = require("mongoose");

const connect = () => {
    mongoose
        .connect("mongodb://localhost:27017/spa_mall")
        .catch(err => console.log(err));
};

mongoose.connection.on("error", err => {
    console.error("몽고디비 연결 에러", err)
});

module.exports = connect

 

 

---

12. 최종 완성

https://github.com/verdantjuly/node_spa_mall

 

출처 : 스파르타 코딩 클럽 내일 배움 캠프 [노드 입문]