使用 React + Redux 以及 Stripe 支付集成构建完整的食品订购应用程序

这是一个可以添加到您的作品集和简历中的伟大项目。

本文介绍如何使用 React + Redux 构建完整的食品订购应用程序来学习。

我最近推出了一门新的Mastering Redux课程。

查看您将在本课程中构建的应用程序的以下预览：

请注意，在此应用程序中，我使用 INR 作为显示价格的货币，但您只需在应用程序中进行一次配置更改即可轻松地将其更改为 USD 或 AUD 或任何其他货币。

在本课程中，您将学习：

• 从绝对开始的 Redux
• Redux 的基础和高级概念
• 如何使用 react-redux 库
• 如何使用多个 Reducer 来管理复杂的 Redux 状态
• 如何调试 Redux 应用程序
• 如何使用 Strapi CMS 管理产品库存
• 使用 REST API 访问 Strapi CMS 中添加的数据
• 如何使用 redux-thunk 库处理异步 API 调用
• 如何构建产品页面、购物车和结账功能
• 使用 Cloudinary 存储和管理图像
• 如何整合 Stripe 来接受付款
• 如何使用 MongoDB 存储用户和订单详细信息
• 如何将应用程序部署到生产环境

等等。

当谈到集成支付网关来接受付款时，Stripe 是首选，因为它最受欢迎，并且允许在更短的时间内付款而无需提供大量信息。

Stripe 允许在电商网站上为单件商品或一系列商品付款。但说到如何集成 Stripe，你几乎找不到任何教程/文章从头到尾讲解。

大多数教程/文章仅解释如何成功付款，但没有解释付款成功后如何进行后期处理，因为这很复杂，但对于每个生产应用程序来说都是必要的，并且是条纹集成中必须知道的事情。

后期处理可能包括付款成功后发送电子邮件或向用户发送发票或存储订单和用户的详细信息并通知用户。

因此，在Mastering Redux课程中，您将学习如何从头到尾集成 Stripe，包括后期处理。

除了条纹集成之外，在课程中，您还将学习如何使用 Strapi CMS 管理产品库存。

Strapi CMS 是最受欢迎的无头 CMS 之一，可用于管理任何类型的数据。它提供了一种从 UI 轻松添加数据并使用 REST API 即时访问添加数据的方法。

查看下面的屏幕截图以获得 Strapi CMS 的概览。

您还将学习如何从 Strapi CMS 添加/编辑/删除产品图像，并自动获取 Cloudinary 中反映的更改，而无需手动执行。

Cloudinary 是网络上最流行的图像存储方式，因为它可以轻松压缩，并且还允许我们仅通过提供尺寸即可生成特定宽度和高度的图像。

作为预发布优惠，Mastering Redux课程目前仅售 12 美元，原价 19 美元，有效期至 2021 年 5 月 19 日。

参加 Mastering Redux 课程后，您还将免费获得一本我广受欢迎的《Mastering Modern JavaScript》一书，有效期至 2021 年 5 月 19 日。

5 月 19 日之后，课程价格将上涨至 19 美元，并且您将无法免费获得《掌握现代 JavaScript》一书。

如果您需要 React Router 的介绍，您还可以查看我的免费React Router 介绍课程。

点击下面的图片立即加入课程。

想要定期了解有关 JavaScript、React 和 Node.js 的最新内容吗？请在 LinkedIn 上关注我。