从零开始用react + tailwindcs + express + mongodb实现一个聊天程序(二)

1.安装mogondb数据库

参考MongoDB安装配置教程(详细版)_mongodb安装详细步骤-CSDN博客

安装mondbcompass数据库连接工具参考https://www.mongodb.com/zh-cn/docs/compass/current/connect/

2.后端服务

1.创建src文件夹 并在src文件夹下创建 index.js 内容如下

javascript 复制代码
import express from 'express'
import http from 'http'

const app = express()

const server = http.createServer(app)

server.listen(3000, () => {
    console.log(`Server is running on port ${3000}`)
})

在packjson.json 加 配置 ES6引入

scripts配置启动命令

然后在server目录下 执行npm run start 在浏览器访问http://localhost:3000/ 效果如下

说明后端服务启动成功

3.连接数据库

新建.env 配置数据库连接地址 MONGODB_URI= mongodb://localhost:27017/chat

在src 文件夹下 新建lib文件夹 并创建db.js 代码如下

javascript 复制代码
import mongoose from 'mongoose';
import { config } from "dotenv";
config()
export const connectDB = async () => {
  try {
    await mongoose.connect(process.env.MONGODB_URI);
    console.log('Connected to MongoDB');
  } catch (error) {
    console.error('Error connecting to MongoDB', error);
  }
}

并在index.js 引入

复制代码
import express from 'express'
import http from 'http'
import {connectDB} from "./lib/db.js"
const app = express()

const server = http.createServer(app)

server.listen(3000, () => {
    console.log(`Server is running on port ${3000}`)
    connectDB();
})

再执行npm run start 命令显示

下篇 开发注册 登录 接口 敬请期待 谢谢!!

相关推荐
换日线°21 小时前
NFC标签打开微信小程序
前端·微信小程序
张3蜂1 天前
Python 四大 Web 框架对比解析:FastAPI、Django、Flask 与 Tornado
前端·python·fastapi
南风知我意9571 天前
【前端面试5】手写Function原型方法
前端·面试·职场和发展
qq_12498707531 天前
基于Java Web的城市花园小区维修管理系统的设计与实现(源码+论文+部署+安装)
java·开发语言·前端·spring boot·spring·毕业设计·计算机毕业设计
摘星编程1 天前
用React Native开发OpenHarmony应用:Image网络图片加载
javascript·react native·react.js
摘星编程1 天前
OpenHarmony环境下React Native:ImageBase64图片显示
javascript·react native·react.js
阿蒙Amon1 天前
TypeScript学习-第13章:实战与最佳实践
javascript·学习·typescript
小安驾到1 天前
【前端的坑】vxe-grid表格tooltip提示框不显示bug
前端·vue.js
萧曵 丶1 天前
MongoDB 核心原理 + 高频面试题
数据库·mongodb
去码头整点薯条981 天前
python第五次作业
linux·前端·python