这个项目能做什么

Ludo-Base 是一款构建在 Base 上的去中心化 Ludo 游戏体验,以 Next.js 16 应用程序形式打包,旨在兼容 Farcaster。它将玻璃拟态仪表盘界面与链上钱包连接及多人房间流程相结合。 功能特性 - 游戏大厅:包含药丸形分段标题、水平游戏模式选择、比赛类型(1v1, 2v2, 4P)、带有大数字输入框、步进控件和快速选择标签的入场费投注区域,以及“快速匹配”和“与好友对战”的行动按钮。 - 游戏玩法:app/components/Board.tsx 实现了核心 Ludo 棋盘,app/components/SnakesBoard.tsx 提供了蛇形棋变体。 - 多人模式:通过 PeerJS 和 hooks/TeamUpContext.tsx 处理与好友对战的房间创建/加入状态。 - 持久化:lib/matchRecorder.ts 包含由 Supabase 支持的比赛结果持久化辅助工具。 - 钱包与链上:Wagmi 和 Coinbase OnchainKit 为 Base 网络提供钱包集成。 技术栈 Next.js 16 (App Router), React 19, TypeScript 5, Tailwind CSS 4, Framer Motion, Wagmi + Coinbase OnchainKit, Supabase 和 PeerJS。 UI 设计方向 文档记录的视觉方向为深色终端玻璃表面,使用青色 (#00E5FF) 作为焦点和激活状态,背景采用炭灰色/石墨色渐变 (#0B0F14 至 #141A22) 并带有细微的纹理噪点,支持文本使用等宽字体。README 还记录了绝对仓库相对文件路径、PascalCase React 组件文件名以及在移动端和桌面端保持一致的简短、动作导向的界面文案规范。 本地运行 需要 Node.js 20+ 和 npm。使用 npm install 安装依赖,然后通过 npm run dev 启动开发服务器;应用运行在 http://localhost:3000。生产构建使用 npm run build 后接 npm start,可通过 npm run lint 进行 lint 检查。必须创建 .env.local 文件,并根据部署环境配置钱包/网络、Supabase 以及 Farcaster/Neynar 集成的值。 状态与注意事项 README 指出其当前状态截至 2026 年 3 月,最近的变更日志集中在大厅布局和内边距一致性、投注控件样式、比赛类型状态以及主题/页脚调整。部分面板在后端连接扩展期间仍使用占位符或模拟数据,TeamUp 和比赛持久化流程在重新连接和边缘情况方面仍需持续强化。仓库中包含一份游戏设计文档和视觉资产指南。