mongoDB와 React 연결시도

mongoDB는 크로스 플랫폼 도큐먼트 지향 데이터베이스 시스템이다. NoSQL 데이터베이스로 분류되는 mongoDB는 JSON과 같은 동적 스키마형 도큐먼트들을 선호함에 따라 전통적인 테이블 기반 관계형 데이터베이스 구조의 사용을 삼간다. 그래서 특정한 종류의 애플리케이션을 더 쉽고 빠르게 데이터 통합을 가능하게 한다.

 

내가 Wanderlust라는 여행지 추천사이트를 만들때 React.js와 mongoDB 서버 연결에 애를 먹었는데 그 과정을 기록하고자 한다.

 

헤쳐간 과정들🤔

1) react서버와 node서버가 각각 구동되어야 하기에 폴더별로 정리를 잘해야한다. 나같은 경우는 프로젝트 루트 폴더안에 client폴더를 만들어서 프론트엔드를 동작하게 했고, client폴더 바깥에 백엔드를 동작하게 했다.  

//server.js
const express = require("express");
const connectDB = require("../wanderlust/client/src/config/db");

const app = express();
const PORT = process.env.PORT || 5000;


app.get("/", (req, res) => {
  res.send("API RUNNING...");
});

// Connect DB
connectDB();

app.listen(PORT, () => console.log(`Server started on port ${PORT}`));

app.use(express.json({ extended: false })); 
app.use("/api/register", require("../wanderlust/client/src/routes/api/register"));

 

2) package.json안에 명령어를 통해 server와 client가 돌아가게 했고 concurrently를 install함으로써 두가지를 합쳐서 하나의 명령어로 동작하게 했다. 

npm install concurrently --save

 

3) node module때문에 계속 애를 먹었었는데 이때 할수 있는 방법들로는 node module을 삭제하고 다시 install하거나 --force등의 명령어를 할수 있지만.. 결국 나한테 통했던 것은 '상위 폴더에 존재하고 있었던 node module을 삭제하기'였다. 알고보니 프로젝트 상위에 존재하는 node module때문에 종속되었던 것이라서 계속 프로젝트 내에 있던 모듈을 삭제해도 소용이 없었던 것이다..이거때문에 삽질을 얼마나 한건지ㅠㅠ 여러방면으로 확인해주도록 하자!