从入门到专家的 AI 动手项目。选一个挑战，开始构建。
选一个合适的学习主题，生成一个交互式的学习网站
构建一个响应式作品集网站，包含深色/浅色模式切换、平滑滚动导航、项目展示区和联系表单。使用现代 CSS 技术，如 grid、flexbox 和动画。
构建一个全栈短链接服务，支持自定义短链接、点击分析（地理位置、设备、来源）、二维码生成以及链接管理仪表盘。
接手一个故意做得很慢的 Web 应用并对其进行优化，以达到 Lighthouse 满分 100 分。修复渲染阻塞资源、实现代码分割、优化图片等。
构建一个微前端系统，包含模块联邦、独立部署、共享状态管理，以及一个编排多个微应用的壳应用。
设计并构建一个 GraphQL API，包含查询、变更、订阅、自定义标量类型，以及带有文档和查询历史的交互式探索环境。
构建一个视频平台，支持上传、转码流水线、自适应码率流（HLS）、带自定义控件的视频播放器以及推荐信息流。
构建一个实时协作白板，多个用户可以绘图、添加形状和文本，支持撤销/重做、图层和导出为图片功能。
构建一个生产级认证系统，包含 OAuth 提供商、带 MFA 的邮箱/密码认证、密码重置流程、会话管理和安全最佳实践。
构建一个无头 CMS，包含富文本编辑器（类似 Notion 的块级编辑器）、内容类型、媒体管理、API 生成和基于角色的访问控制。
构建一个复杂的多步骤表单，包含条件逻辑、实时验证、进度指示器、审核步骤，以及在各步骤之间前后导航的能力。
创建一个拖拽式文件上传器，包含进度追踪、图片/视频预览、文件类型验证、大文件分片上传和已上传文件的画廊视图。
构建一个基于 WebSocket 连接的实时聊天应用，支持聊天室、输入状态指示器、已读回执、表情回应和消息搜索功能。
构建一个类似 Trello 的看板，支持在列之间拖放卡片、富文本卡片编辑、标签、截止日期以及面板数据持久化。
构建一个管理员分析仪表盘，包含交互式图表、带排序/过滤的数据表、日期范围选择器、导出功能和带侧边栏导航的响应式布局。
创建一个社交媒体信息流，支持无限滚动、帖子创建（文字/图片）、点赞和评论功能、分享按钮以及用户个人资料卡片。
构建一个完整的电商店铺，包含商品列表、搜索和过滤、购物车、带表单验证的结账流程和订单确认。使用模拟支付处理。
构建一个平台，用户可以创建包含多种题型（多选题、判断题、填空题）的测验、在限时内完成测验，并查看成绩分析。
创建一个瀑布流图片画廊，支持灯箱查看、懒加载、无限滚动、分类筛选和流畅动画。支持图片缩放和键盘导航。
构建一个科学计算器，包含标准和科学模式、计算历史、多种主题、键盘支持和流畅的按钮按压动画。
构建一个精美的番茄工作法效率计时器，包含可自定义的工作/休息间隔、会话追踪、统计仪表盘、提示音效和进度可视化。
创建一个食谱搜索应用，用户可以按食材搜索，按菜系和饮食限制进行筛选，收藏喜欢的食谱，并查看详细的烹饪步骤。
构建一个高级待办事项应用，支持分类、优先级、拖拽排序、截止日期、本地存储持久化和带流畅动画的精美界面。
构建一个天气仪表盘，从天气 API 获取数据。展示当前天气状况、5天预报图表、带自动补全的位置搜索以及动画天气图标。
创建一个静态博客，渲染 Markdown/MDX 内容，支持语法高亮、目录和预计阅读时间。包含分类过滤和搜索功能。
复刻一个知名 SaaS 产品的落地页（如 Linear、Vercel 或 Stripe）。专注于像素级精确的排版、间距、微妙的动画效果以及在所有设备上的响应式表现。
