amplify aws_第一种AWS Amplify方法：使用简单的Web应用程序教授数学

amplify aws

During the past AWS Summit I attended an interesting session concerning AWS Amplify. It quickly convinced me to try this framework. A few days later I had the right opportunity: keep my son trained with the multiplication tables during summer. I decided to develop a simple web application with AWS Amplify in order to discover its strengths and weaknesses.

在过去的AWS峰会上，我参加了有关AWS Amplify的有趣会议。 它很快说服了我尝试这个框架。 几天后，我得到了正确的机会：在夏天让儿子接受乘法表的训练。 我决定使用AWS Amplify开发一个简单的Web应用程序，以发现其优势和劣势。

This is the GitHub repository hosting source code explained in this post and the deployed web application.

这是托管此帖子中说明的GitHub存储库源代码以及已部署的Web应用程序 。

什么是放大？ (What’s Amplify?)

AWS Amplify is a set of tools and services that allow a developer to build modern full stack applications using AWS cloud services. For example, having to create a React web application, Amplify allows us to manage the development and deployment of the frontend, backend services and the related CI/CD pipeline. For the same application it is possible to have multiple environments (for example dev, test, stage & production). Amplify also allows to integrate some AWS services very quickly into your frontend, writing very few lines of code: one example above all, authentication with AWS Cognito.

AWS Amplify是一组工具和服务，使开发人员可以使用AWS云服务构建现代的全栈应用程序。 例如，必须创建一个React Web应用程序，Amplify允许我们管理前端，后端服务和相关的CI / CD管道的开发和部署。 对于同一应用程序，可能有多个环境(例如，开发，测试，阶段和生产)。 Amplify还允许将一些AWS服务非常快速地集成到您的前端中，只需编写很少的代码行：最重要的一个示例是使用AWS Cognito进行身份验证。

Great! There seems to be everything one-man-band developer needs to quickly build an application! Let’s try.

大！ 一个人开发人员似乎拥有快速构建应用程序所需的一切！ 我们试试吧。

了解乘法表 (Learn the multiplication tables)

As a first step, better clarify the ideas of what we want to achieve: whether they are four sketches on a sheet of paper (my case) or a good mockup in Balsamiq, let’s try to imagine UI & UX of our application.

第一步，更好地阐明我们要实现的想法：无论是纸上的四个草图(以我的情况为例)还是Balsamiq中的一个好的模型，让我们尝试想象一下应用程序的UI和UX。

The main purpose is to train the knowledge of the multiplication tables by subjecting the user to a test: 10 multiplications relating to the same multiplication table, randomly chosen from 2 to 10 (I do not have to explain why I have excluded the multiplication table of 1, right?).

主要目的是通过对用户进行测试来训练乘法表的知识：与同一个乘法表相关的10个乘法，从2到10中随机选择(我不必解释为什么我排除了乘法表1，对吗？)。

It would be interesting to keep track of errors and time spent answering questions, in order to have a scoreboard with the best result for each table.

跟踪错误和回答问题所花费的时间，以使每个表的成绩都达到最佳，这将是很有趣的。

Do we want to show each user their own scoreboard and push them to improve themselves? We will therefore have to memorize it and we need an authentication process!

我们是否要向每个用户展示自己的计分板并推动他们提高自身水平？ 因此，我们将不得不记住它，并且我们需要一个认证过程！

Having the scoreboard of each user, we can also choose the times table object of the next challenge based on the previous results, in order to train the user on the multiplication tables for which he has encountered greater difficulties.

有了每个用户的记分牌，我们还可以根据以前的结果选择下一个挑战的时间表对象，以便在用户遇到较大困难的乘法表上训练用户。

And by magic, the UI of our application appears.

神奇地，我们的应用程序的UI出现了。

第一步 (First steps)

Now that we have the clearest ideas on what to do, let’s take the first steps. We have already decided to use React and Amplify. Let’s see the prerequisites and create our project, as explained in