本文档全面概述了 App Ideas 集合中的 Web 开发项目。这些项目旨在通过各种 Web 应用程序的实际动手实现，帮助开发人员提高他们的 Web 开发技能。本集合中的 Web 项目范围从简单的初学者着陆页到更复杂的电子商务应用程序，为不同技能水平的开发人员提供了进阶路径。
有关实用项目的信息，请参阅 Utility Projects。
该集合提供多个难度级别的 Web 项目，允许开发人员在处理日益复杂的实现时逐步提升技能。
来源： Projects/1-Beginner/Product-Landing-Page.md Projects/2-Intermediate/Simple-Online-Store.md
初学者 Web 项目侧重于基础 Web 开发技能，包括 HTML 结构、CSS 样式和基本用户交互。
产品着陆页是一个初学者级别的项目，教导开发人员如何为产品或服务创建有效的宣传网页。
| 用户故事 | 描述 |
|---|---|
| 产品展示 | 展示一个或多个产品图片 |
| 功能列表 | 展示全面的产品功能列表 |
| 价值主张 | 解释产品如何改善买家的生活 |
| 联系信息 | 提供用户与团队联系的方式 |
来源： Projects/1-Beginner/Product-Landing-Page.md13-29
来源： Projects/1-Beginner/Product-Landing-Page.md
中级 Web 项目建立在初学者概念的基础上，引入更复杂的功能、状态管理和用户交互。
简单的在线商店项目扩展了产品着陆页的概念，以创建功能性的电子商务体验。
| 组件 | 目的 |
|---|---|
| 产品列表 | 显示带有缩略图、名称、价格和描述的产品卡片 |
| 产品详情 | 显示所选产品的详细信息 |
| 购物车 | 管理选定的产品、数量并计算总价 |
| 订单处理 | 允许用户下订单或取消订单 |
来源： Projects/2-Intermediate/Simple-Online-Store.md20-54
来源： Projects/2-Intermediate/Simple-Online-Store.md20-54
随着开发人员在本系列 Web 项目中不断深入，他们将建立日益复杂的技能和能力。
来源： Projects/1-Beginner/Product-Landing-Page.md Projects/2-Intermediate/Simple-Online-Store.md
对于产品着陆页等初学者项目，内容组织至关重要
来源： Projects/1-Beginner/Product-Landing-Page.md17-20
对于简单的在线商店等中级项目，适当的数据处理变得至关重要
来源： Projects/2-Intermediate/Simple-Online-Store.md15-19 Projects/2-Intermediate/Simple-Online-Store.md39-44
来源： Projects/2-Intermediate/Simple-Online-Store.md22-54
集合中的项目想法经常提出自然的进阶路径。例如，产品着陆页项目明确建议在掌握基本概念后继续学习简单的在线商店。
"完成此应用程序和奖励功能后，尝试通过将其扩展到包含简单在线商店中指定的其他功能来提升您的技能。"
这种结构化的进阶允许开发人员在现有代码库和知识的基础上，逐步添加更复杂的功能。
来源： Projects/1-Beginner/Product-Landing-Page.md9-11
该集合为从事 Web 项目的开发人员提供有用的外部资源
来源： Projects/1-Beginner/Product-Landing-Page.md31-38 Projects/2-Intermediate/Simple-Online-Store.md67-74