# 基于React+Node.js+MongoDB+Socket.io的聊天程序

**Repository Path**: ouzexi/chat_app

## Basic Information

- **Project Name**: 基于React+Node.js+MongoDB+Socket.io的聊天程序
- **Description**: 学习websocket的小项目
参考https://github.com/koolkishan/chat-app-react-nodejs
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-03-10
- **Last Updated**: 2022-06-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React+Node.js+MongoDB+Socket.io --- CHATROOM

## 项目结构
- public 前端项目  
-- public 静态资源文件目录  
-- src 源文件目录  
--- assets 静态资源  
--- components 组件目录  
--- pages 视图目录  
---- Chat.jsx 聊天室主页  
---- Login.jsx 登录页  
---- Register.jsx 注册页  
--- utils 工具目录  
---- APIRoutes.js  
--- App.js 最外层容器组件  
--- index.css 公共样式  
--- index.js 入口文件  
- server 后端项目  
-- controllers 控制器目录  
--- userController.js 用户模块控制器  
-- model 数据对象模型目录  
--- userModel.js 用户模块模型  
-- routes 路由目录  
--- userRoutes.js 用户模块路由  
-- .env 环境变量配置文件  
-- index.hs 入口文件  

#### 2020.3.10 完成注册页的编写&建立用户数据表&注册API相关

![输入图片说明](example/image-20220312154156380.png)
#### 2020.3.11 完成登录页和头像设置

![输入图片说明](example/image-20220312154205793.png)

![输入图片说明](example/image-20220312154457811.png)

#### 2020.3.12 完成聊天页
![输入图片说明](example/image-20220313005830560.png)
![输入图片说明](example/image-20220313005902933.png)
![输入图片说明](example/image-20220313005738379.png)