Express, React, Mongoose 로 웹소켓 채팅앱 만들기. 1

 

쇼핑몰 애플리케이션에서 간단하게 구현해봤던 웹소켓을 이용해서 간단한 채팅앱을 구현해보기로 했다. 

 

Express, React, Mongoose 로 웹소켓 채팅앱 만들기. 1

 

1. 어떻게 만들 것인가? 

2. 오늘 겪은 문제

3. 해결 방법

4. 입력하기

추천글

위의 목차를 클릭하면 해당 글로 자동 이동 합니다.

 

1. 어떻게 만들 것인가?

1. 백엔드 세팅 : 데이터베이스 세팅, 웹소켓 세팅
2. 프론트엔드 세팅 : 웹소켓 세팅
3. 백엔드 프론트엔드 연결 테스트
4. 유저 로그인
5. 메세지 주고받기

핵심 포인트: mongoose schema 설정, dotenv로 db 연결정보 설정, index로 front, io, 서버 연결

2. 오늘 겪은 문제와 해결 방법

app.js 에서 mongoose 를 통해 db를 연결하고자 하는데, 아래와 같은 오류가 반복되었다. 

다행히 단순 오타 문제라 금방 해결하였음.

$ node app.js C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongodb\lib\connection_string.js:273 throw new error_1.MongoParseError(`${optionWord} ${Array.from(unsupportedOptions).join(', ')} ${isOrAre} not supported`); ^ MongoParseError: option usernewurlparser is not supported at parseOptions (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongodb\lib\connection_string.js:273:15) at new MongoClient (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongodb\lib\mongo_client.js:48:63) at NativeConnection.createClient (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongoose\lib\drivers\node-mongodb-native\connection.js:288:14) at NativeConnection.openUri (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongoose\lib\connection.js:755:34) at Mongoose.connect (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\node_modules\mongoose\lib\index.js:404:15) at Object.<anonymous> (C:\Users\cryst\OneDrive\바탕 화면\채팅앱 만들기\app.js:9:4) at Module._compile (node:internal/modules/cjs/loader:1254:14) at Module._extensions..js (node:internal/modules/cjs/loader:1308:10) at Module.load (node:internal/modules/cjs/loader:1117:32) at Module._load (node:internal/modules/cjs/loader:958:12) { [Symbol(errorLabels)]: Set(0) {} } Node.js v18.15.0

 

app.js 

const express = require('express');
const mongoose = require('mongoose');
require('dotenv').config();
const cors = require('cors');
const app = express();
app.use(cors());

mongoose
  .connect(process.env.DB, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
  })
  .then(() => console.log('connection established'));

module.exports = app;