wengyeyulu/README.md
2025-12-15 12:45:54 +08:00

94 lines
3.2 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 翁爷语录 (WengyeYulu) - 聊天记录归档查看器
这是一个基于 **Bun** + **Elysia** + **React** 构建的全栈聊天记录归档与查看应用。它演示了如何使用现代高性能 TypeScript 运行时 Bun 构建端到端类型安全End-to-End Type Safety的 Web 应用。
## 🛠 技术栈
本项目采用以下前沿技术构建:
### 核心运行时
- **[Bun](https://bun.sh)**: 极速的 TypeScript 运行时、打包器和包管理器。
### 后端 (Backend)
- **[ElysiaJS](https://elysiajs.com)**: 基于 Bun 的高性能 Web 框架。
- **[Bun:sqlite](https://bun.sh/docs/api/sqlite)**: Bun 内置的高性能 SQLite 驱动。
- **TypeScript**: 全后端类型支持。
### 前端 (Frontend)
- **[React 19](https://react.dev)**: 用于构建用户界面。
- **[@elysiajs/eden](https://elysiajs.com/eden/overview.html)**: 实现了**端到端类型安全**。前端直接调用后端 API 类型,无需手动编写 Fetch 代码或类型定义。
- **[TailwindCSS](https://tailwindcss.com)**: 实用优先的 CSS 框架。
- **[Lucide React](https://lucide.dev)**: 漂亮的图标库。
### 部署 (Deployment)
- **Docker**: 容器化部署。
- **Docker Compose**: 服务编排。
- **Traefik**: 支持并预配置了 Traefik 标签,方便作为反向代理接入。
## ✨ 功能特性
- **端到端类型安全**: 后端修改 API 定义,前端类型自动更新,开发体验极佳。
- **微信风格 UI**: 仿微信 PC 端界面,简洁熟悉。
- **高性能**: 利用 Bun 和 SQLite 的高性能特性,秒级加载大量聊天记录。
- **全文搜索**: 支持实时搜索聊天内容。
- **数据导入**: 包含管理员后台,支持导入 JSON 格式的聊天记录。
## 🚀 快速开始 (开发模式)
### 前置要求
请确保已安装 [Bun](https://bun.sh/docs/installation)。
### 1. 安装依赖
```bash
bun install
```
### 2. 启动开发服务器
```bash
bun dev
```
服务器将在 `http://localhost:3000` 启动。
* Bun 会自动处理前端资源的 HMR热更新
* 后端 API 变更也会自动重启。
## 🐳 Docker 部署 (生产环境)
本项目提供了完整的 Docker 支持,包含 Traefik 标签配置,适合在生产环境中部署。
### 1. 配置环境变量
复制示例配置文件并设置你的域名:
```bash
cp .env.example .env
```
打开 `.env` 文件,修改 `DOMAIN_NAME` 为你的实际域名(例如 `chat.example.com`。如果不修改Traefik 将默认监听 `example.com`
### 2. 启动服务
使用 Docker Compose 一键启动:
```bash
docker-compose up -d --build
```
### 3. 数据持久化
所有数据SQLite 数据库文件)将保存在项目根目录下的 `./data` 文件夹中,容器重启或删除后数据不会丢失。
## 📂 项目结构
```
src/
├── backend/ # 后端代码
│ ├── api.ts # Elysia API 定义
│ ├── db.ts # 数据库连接与 Schema
│ └── index.ts # 服务端入口
└── frontend/ # 前端代码
├── client.ts # Eden 客户端 (API 类型推断)
├── components/ # React 组件
├── App.tsx # 主应用逻辑
└── index.tsx # 前端入口
```
## 📝 许可证
MIT License