• ✨ 项目亮点
• 📸 界面预览
• 🚀 核心特性
• 🛠️ 技术栈
• 💻 代码库支持
• 🏁 快速开始
• 🔐 安全机制
• 🤝 参与贡献
• 📄 许可证
• 🌟 Star History

PType 不仅仅是一个打字练习工具，它是为了提升开发者生产力而生的训练场。

• 🎯 极致体验：基于 React 19 和 Framer Motion 打造的丝滑动画与响应式设计。
• 🌍 多语言支持：不仅支持英文、中文（现代/文言），更原生支持 10+ 种编程语言。
• 📊 专业分析：统一使用 CPM (Characters Per Minute) 作为核心指标，提供 WPM、准确率热力图等多维度数据分析。
• 🏆 竞技排行：内置全球排行榜与个人历史记录，实时监控你的成长曲线。
• ⚡ 实时对战：支持 1v1 在线对战，竞速模式和限时挑战两种对战方式。
• 🔐 请求签名：内置多层加密签名机制，防止 API 滥用和自动化攻击。
• 🌐 国际化：完整的中英文界面支持，基于 next-intl 实现。

程序员模式 - 沉浸式代码练习体验

查看更多截图

英文模式	中文模式
详细统计面板

• CPM (Characters Per Minute): 全局核心速度指标，统一衡量中英文及代码输入效率。
• WPM (Words Per Minute): 英文模式辅助参考指标。
• 准确率热力图: 识别你的高频错误按键。
• 历史回溯: 完整的练习历史记录与趋势分析。

• 账号系统: 完整的注册登录流程，JWT 认证，数据云端存储。
• 排行榜: 实时更新的全球速度排行，激发练习动力。
• 自定义文本: 支持用户上传自己的练习文本。

PType 现已支持实时在线对战功能，通过 WebSocket 技术实现毫秒级的同步体验。

对战特性：

• 🏎️ 竞速模式 - 看谁先打完所有文本，速度最快赢胜利
• ⏱️ 限时挑战 - 在固定时间内，比较谁的正确字符数更多
• 👥 灵活配对 - 支持邀请好友或与随机对手匹配
• ⚙️ 自定义规则 - 房主可设置比赛时间、文本内容等参数
• 📊 实时反馈 - 对战中实时显示双方的打字进度和速度对比
• 🏆 荣誉系统 - 赢得对战可获得荣誉分，登上对战排行榜

如何开始对战：

1. 登录后进入对战模式页面
2. 创建新房间或加入现有房间
3. 配置对战参数（选择模式、时间、文本等）
4. 邀请好友加入或等待随机匹配
5. 开始计时，看谁能更快更准地完成打字任务

本项目采用现代化的全栈技术构建，确保高性能与可维护性。

领域	技术选型
核心框架
样式与动画
后端与数据
状态管理
图表可视化
国际化
实时通信
认证安全

PType 内置了丰富的代码练习库，涵盖主流语言与工具：

特色内容：包含 LeetCode 热门算法题（两数之和、LRU 缓存等）和真实场景的系统运维命令。

git clone --depth 1 https://github.com/anYuJia/ptype.git
cd ptype

npm install

cp .env.example .env

编辑 .env 文件，设置必要的密钥：

# 数据库配置（可选，如不配置则使用默认）
DATABASE_URL="postgresql://user:password@localhost:5432/ptype?schema=public"

# 安全密钥（必须修改！使用 openssl rand -base64 32 生成）
JWT_SECRET="your-random-secret-key"
SIGNATURE_SECRET="your-random-secret-key"

# Cookie 设置（HTTP 环境设为 false）
SECURE_COOKIES=false

# Socket.io 服务器地址
NEXT_PUBLIC_SOCKET_URL="http://localhost:4000"

npx prisma generate
npx prisma db push

在新的终端窗口运行：

node server/server.js

Socket.io 服务器运行在 4000 端口。确保此端口未被占用。

在另一个终端窗口运行：

npm run dev

前端运行在 3000 端口。

打开浏览器访问 http://localhost:3000

现在你可以完整体验包括对战功能的所有特性！

# 构建并启动所有服务
docker-compose up -d --build

# 查看日志
docker-compose logs -f

# 停止服务
docker-compose down

cp .env.example .env
# 然后编辑 .env 配置 JWT_SECRET 和 SIGNATURE_SECRET

export PRISMA_ENGINES_MIRROR="https://registry.npmmirror.com/-/binary/prisma"
npx prisma generate

PType 内置了多层安全防护机制：

• JWT 认证 - 使用 JSON Web Token 进行用户身份验证
• HttpOnly Cookie - Token 存储在 HttpOnly Cookie 中，防止 XSS 攻击
• Secure Cookie - 生产环境（HTTPS）自动启用 Secure 标志

⚠️ HTTP 环境配置：如果服务器未配置 HTTPS，需要在 .env 中设置 SECURE_COOKIES=false

所有敏感的写操作（登录、注册、保存成绩等）都需要携带有效的请求签名。

安全特性：

• ⏱️ 时间戳验证 - 签名 5 分钟后自动过期
• 🔄 Nonce 防重放 - 每个签名只能使用一次
• 🔒 数据完整性 - 验证请求数据未被篡改
• 🌐 浏览器指纹 - 增加请求唯一性，防止跨设备重放
• 🔐 多轮 HMAC - 增加逆向破解难度

详细文档请参阅 src/lib/security/README.md

我们非常欢迎社区的贡献！无论是修复 Bug、添加新功能，还是丰富代码练习库。

1. Fork 本仓库
2. 创建你的特性分支 (git checkout -b feature/AmazingFeature)
3. 提交你的更改 (git commit -m 'Add some AmazingFeature')
4. 推送到分支 (git push origin feature/AmazingFeature)
5. 开启一个 Pull Request

所有代码库文件位于 /src/lib/code-libraries/。 你可以参考现有的 python.ts 或 java.ts 格式，创建一个新的语言文件并在 index.ts 中导出。

对战相关文件位于 /src/features/battle/，后端服务在 /server/ 目录。 欢迎改进对战机制、添加新的对战模式或优化 WebSocket 通信。

本项目基于 MIT 许可证 开源。详情请参阅 LICENSE 文件。