一款面向个人投资者的全栈股票交易应用，提供港股和美股的实时行情查看、股票交易、资产管理等核心功能。

• 实时行情：港股、美股实时价格和K线图表
• 股票交易：买入卖出操作，支持市价单和限价单
• 资产管理：持仓查看、盈亏统计、资金流水
• 自选股：个人关注股票列表和价格提醒
• 用户系统：注册登录、身份认证、安全设置
• 交易记录：历史订单和成交记录查询
• 响应式设计：适配移动端和桌面端
• 实时更新：WebSocket实时数据推送

• React 18 + TypeScript - 现代化前端框架
• Vite - 快速构建工具和开发服务器
• React Router - 客户端路由管理
• Zustand - 轻量级状态管理
• Tailwind CSS - 实用优先的CSS框架
• Recharts - 数据可视化和图表库
• Lucide React - 现代化图标库

• Express.js + TypeScript - Node.js Web框架
• PostgreSQL - 关系型数据库
• JWT - 用户身份认证
• bcrypt - 密码加密
• CORS - 跨域资源共享

• ESLint - 代码质量检查
• PostCSS - CSS处理工具
• Nodemon - 后端热重载
• Concurrently - 并发运行多个命令

港美股APP/
├── src/                    # 前端源码
│   ├── components/         # React组件
│   ├── pages/             # 页面组件
│   ├── hooks/             # 自定义Hooks
│   ├── services/          # API服务
│   ├── store/             # 状态管理
│   ├── utils/             # 工具函数
│   └── lib/               # 第三方库配置
├── api/                   # 后端源码
│   ├── controllers/       # 控制器
│   ├── routes/           # 路由定义
│   ├── middleware/       # 中间件
│   ├── config/           # 配置文件
│   └── server.ts         # 服务器入口
├── migrations/           # 数据库迁移文件
├── public/              # 静态资源
└── .trae/documents/     # 项目文档

• Node.js >= 18.0.0
• PostgreSQL >= 13.0
• npm 或 pnpm

# 克隆项目
git clone <repository-url>
cd 港美股APP

# 安装依赖
npm install

1. 复制环境变量文件：

cp .env.example .env

2. 配置数据库连接和其他环境变量：

# 数据库配置
DATABASE_URL=postgresql://username:password@localhost:5432/stock_trading_db

# JWT密钥
JWT_SECRET=your-super-secret-jwt-key

# 服务器配置
PORT=3001
NODE_ENV=development

# 创建数据库
createdb stock_trading_db

# 运行数据库迁移
psql -d stock_trading_db -f migrations/001_init_database.sql

# 同时启动前端和后端服务
npm run dev

# 或者分别启动
npm run dev:frontend  # 前端服务 (http://localhost:5173)
npm run dev:backend   # 后端服务 (http://localhost:3001)

页面	路由	功能描述
首页	/	市场概览、热门股票、资产概况
行情页面	/market	实时行情列表、涨跌排行
个股详情	/stock/:symbol	K线图表、基本信息、交易操作
自选股	/watchlist	关注股票列表、价格提醒
交易页面	/trade	买入卖出操作、订单确认
资产页面	/portfolio	持仓详情、盈亏统计
交易记录	/orders	历史订单、成交记录
个人中心	/profile	账户设置、安全管理

• POST /api/auth/login - 用户登录
• POST /api/auth/register - 用户注册
• POST /api/auth/logout - 用户登出

• GET /api/stocks - 获取股票列表
• GET /api/stocks/quote/:symbol - 获取股票报价
• GET /api/stocks/chart/:symbol - 获取K线数据

• POST /api/trades/order - 提交交易订单
• GET /api/trades/orders - 获取订单列表
• DELETE /api/trades/order/:id - 取消订单

• GET /api/portfolio/assets - 获取资产概况
• GET /api/portfolio/positions - 获取持仓列表
• GET /api/portfolio/transactions - 获取交易记录

• GET /api/watchlist - 获取自选股列表
• POST /api/watchlist - 添加自选股
• DELETE /api/watchlist/:symbol - 删除自选股

• users - 用户信息表
• stocks - 股票基础信息表
• orders - 交易订单表
• positions - 用户持仓表
• watchlists - 自选股表
• transactions - 交易记录表

• 用户与订单：一对多关系
• 用户与持仓：一对多关系
• 用户与自选股：多对多关系
• 股票与订单：一对多关系

# 构建前端
npm run build

# 构建后端
npm run build:backend

# 构建镜像
docker build -t stock-trading-app .

# 运行容器
docker run -p 3000:3000 -p 3001:3001 stock-trading-app

项目已配置 vercel.json，支持一键部署到Vercel：

# 安装Vercel CLI
npm i -g vercel

# 部署
vercel

# 代码检查
npm run lint

# 类型检查
npm run type-check

# 代码格式化
npm run format

# 运行测试
npm run test

# 测试覆盖率
npm run test:coverage

1. 组件开发：保持组件小而专注，单一职责
2. 状态管理：使用Zustand管理全局状态
3. API调用：统一使用services层处理API请求
4. 错误处理：实现统一的错误处理机制
5. 类型安全：充分利用TypeScript的类型系统

MIT License

欢迎提交Issue和Pull Request来改进项目！

如有问题或建议，请通过以下方式联系：

• 提交Issue
• 发送邮件
• 项目讨论区