简单在线商店
等级： 中级
在你实现的产品登陆页项目中，你提供了一个登陆页向用户提供产品信息，并希望提高你网站的转化率。
简单在线商店的目标是让用户能够选择要购买的产品，查看购买信息，将其添加到在线购物车中，最终在购物车中实际购买产品。
限制
- 最开始你可以实现一个产品库存作为Javascript对象的数组，如果你是用Javascript开发的。对于其他语言，请随意选择你选择的内存解决方案。
用户故事
- [ ] 用户可以在登陆页点击
查看产品按钮来展示产品页面。 - [ ] 用户在产品页面可以看到每个产品的卡片，显示产品缩略图、名称、价格、简短描述和一个
选择按钮。 - [ ] 当点击
选择按钮时，用户可以看到一个产品详情页面，显示与产品卡片相同的信息，但还有一个唯一的产品id、详细描述、添加到购物车按钮和一个查看更多产品按钮。 - [ ] 当产品添加到购物车时，用户可以看到一个确认消息。
- [ ] 用户可以点击
查看更多产品页面返回到产品页面。 - [ ] 用户在登陆页或产品页面都可以看到一个
购物车按钮。提示：顶部栏可能是这个按钮的合适位置。 - [ ] 用户可以点击
购物车按钮来展示购物车页面，包含之前添加到购物车的每个产品的产品id、名称、价格和数量输入框。 - [ ] 用户可以在购物车页面看到一个总购买金额，计算方法是将每个订购产品的数量乘以单位价格的总和。
- [ ] 用户可以调整订购产品的数量来调整总购买金额。
- [ ] 用户可以在购物车页面点击
下订单按钮来完成订单。用户将看到下单确认号。 - [ ] 用户可以在购物车页面点击
取消订单按钮来取消订单。用户将看到产品数量和总购买金额重置为零。 - [ ] 用户可以在购物车页面点击
查看更多产品按钮返回到产品页面。如果订单还没有下达，这将不会清除已经添加到产品页面的产品。
额外功能
- [ ] 如果订购的数量超过了产品的
现货数量，用户会看到一个错误消息。 - [ ] 当用户在购物车页面下订单时，可以指定收货地址。
- [ ] 用户可以看到添加到总购买金额的运费。
- [ ] 用户可以看到添加到总购买金额的销售税。
- [ ] 开发者将在一个外部文件或数据库中实现产品库存。
有用的链接和资源
有很多电子商务网站页面。你可以使用Dribbble和Behance寻找灵感。