# chat_app

**Repository Path**: cLMC/chat_app

## Basic Information

- **Project Name**: chat_app
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-03-20
- **Last Updated**: 2025-03-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Chat Application

这是一个基于 React 和 Node.js 的实时聊天应用程序，使用 Material-UI 进行前端设计。

## 功能

- 实时消息传递
- 用户登录和注册
- 支持表情符号
- 消息历史记录
- 用户在线状态显示

## 技术栈

- 前端：React, Material-UI
- 后端：Node.js, Express
- 数据库：MongoDB
- 实时通信：Socket.IO

## 安装

### 前端

1. 克隆仓库

   ```bash
   git clone https://github.com/yourusername/chat-app.git
   cd chat-app
   ```

2. 安装依赖

   ```bash
   cd public
   npm install
   ```

3. 启动前端

   ```bash
   npm start
   ```

### 后端

1. 进入服务器目录

   ```bash
   cd server
   ```

2. 安装依赖

   ```bash
   npm install
   ```

3. 启动后端

   ```bash
   npm start
   ```

## 使用

1. 打开浏览器并访问 `http://localhost:3000`。
2. 注册一个新用户或使用现有账户登录。
3. 开始与其他用户聊天。

## 目录结构

chat-app/
│
├── public/ # 前端代码
│ ├── src/
│ │ ├── components/ # React 组件
│ │ ├── assets/ # 静态资源
│ │ └── utils/ # 工具函数
│ └── ...
│
└── server/ # 后端代码
├── models/ # 数据库模型
├── routes/ # API 路由
├── utils/ # 工具函数
└── ...

## 应用截屏
![输入图片说明](public/src/assets/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-20%20234928.png)
![输入图片说明](public/src/assets/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-20%20234932.png)
![输入图片说明](public/src/assets/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-20%20234949.png)
![输入图片说明](public/src/assets/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202025-03-20%20234942.png)