Merge branch 'fullstack-hy2020:source' into brazilian-portuguese-translation

Author: CassivsGabriellis

src/content/0/zh/part0b.md

@@ -767,7 +767,7 @@ var sendToServer = function(note) {
 
 <div class="tasks">
 <!--   <h3>Exercises 0.1.-0.6.</h3>-->
- <h3>练习0.1.-0.6.</h3> </h3>
+ <h3>练习0.1.-0.6.</h3>
 
 <!-- The exercises are submitted via GitHub, and by marking the exercises as done in the [submission system](https://studies.cs.helsinki.fi/stats/courses/fullstackopen).-->
  练习通过GitHub提交，并在[提交系统](https://studies.cs.helsinki.fi/stats/courses/fullstackopen)中标记练习完成。

src/content/1/en/part1a.md

@@ -563,7 +563,7 @@ See this [example submission repository](https://github.com/fullstack-hy2020/exa
 
 For each part of the course, there is a directory, which further branches into directories containing a series of exercises, like "unicafe" for part 1.
 
-Most of the exercises of the course build a larger application, eg. courseinfo, unicafe and anecdotes in this part, bit by bit. In is enough to submit the completed application. You can make a commit after each exercise, but that is not compulsory. For example the course info app is build in the exercises 1.1.-1.5. It is just the end result after 1.5 that you need to submit!
+Most of the exercises of the course build a larger application, eg. courseinfo, unicafe and anecdotes in this part, bit by bit. It is enough to submit the completed application. You can make a commit after each exercise, but that is not compulsory. For example the course info app is build in the exercises 1.1.-1.5. It is just the end result after 1.5 that you need to submit!
 
 For each web application for a series of exercises, it is recommended to submit all files relating to that application, except for the directory <i>node\_modules</i>.
 

src/content/1/zh/part1a.md

@@ -7,6 +7,7 @@ lang: zh
 
 <div class="content">
 <!-- We will now start getting familiar with probably the most important topic of this course, namely the [React](https://reactjs.org/)-library. Let's start off with making a simple React application as well as getting to know the core concepts of React.-->
+
  我们现在将开始入门的可能是本课程最重要的主题，即[React](https://reactjs.org/)-库。让我们从制作一个简单的React应用开始，同时了解React的核心概念。
 
 <!-- The easiest way to get started by far is by using a tool called [create-react-app](https://github.com/facebook/create-react-app). It is possible (but not necessary) to install <i>create-react-app</i> on your machine if the <i>npm</i> tool that was installed along with Node has a version number of at least <i>5.3</i>.-->

src/content/1/zh/part1b.md

@@ -287,10 +287,10 @@ const result = average(2, 5)
 
 <div class="tasks">
 <!--   <h3>Exercises 1.3.-1.5.</h3>-->
- <h3>练习1.3.-1.5.</h3> </h3
+ <h3>练习1.3.-1.5.</h3> 
 
 
-<i>我们将继续构建我们在之前练习中开始编写的应用程序。您可以将代码编写到同一个项目中，因为我们只对提交的应用程序的最终状态感兴趣。<i>
+<i>我们将继续构建我们在之前练习中开始编写的应用程序。您可以将代码编写到同一个项目中，因为我们只对提交的应用程序的最终状态感兴趣。</i>
 
 <!-- **Pro-tip:** you may run into issues when it comes to the structure of the <i>props</i> that components receive. A good way to make things more clear is by printing the props to the console, e.g. as follows:-->
  **建议：**当涉及到组件接收的<i>props</i>的结构时，你可能会遇到问题。一个让事情更明确的好方法是把prop打印到控制台，例如，如下所示。
@@ -333,7 +333,7 @@ const App = () => {
 ```
 
 <!--   <h4>1.4: course information step4</h4>-->
- <h4>1.4：课程信息步骤4</h4
+ <h4>1.4：课程信息步骤4</h4>
 
 <!-- And then place the objects into an array. Modify the variable definitions of <i>App</i> into the following form and modify the other parts of the application accordingly:-->
 然后将对象放入一个数组。将<i>App</i>的变量定义修改为以下形式，并相应地修改应用的其他部分。
@@ -385,7 +385,7 @@ const App = () => {
 ```
 
 <!--   <h4>1.5: course information step5</h4>-->
- <h4>1.5: 课程信息步骤5</h4
+ <h4>1.5: 课程信息步骤5</h4>
 <!-- Let's take the changes one step further. Change the course and its parts into a single JavaScript object. Fix everything that breaks.-->
  让我们再进一步改变。把课程和它的部分改成一个单一的JavaScript对象。修复所有破坏的地方。
 
@@ -417,7 +417,6 @@ const App = () => {
 }
 ```
 
-</div>
 
 <div class="content">
 

src/content/1/zh/part1d.md

@@ -1191,9 +1191,9 @@ const App = () => {
  你可能会发现下面的链接很有用。
 
 <!-- - The [official React documentation](https://reactjs.org/docs/hello-world.html) is worth checking out at some point, although most of it will become relevant only later on in the course. Also, everything related to class-based components is irrelevant to us;-->
- - [官方React文档](https://reactjs.org/docs/hello-world.html)值得在某些时候查看，尽管它的大部分内容在课程的后期才会变得相关。另外，与基于类的组件有关的一切都与我们无关。
+  - [官方React文档](https://reactjs.org/docs/hello-world.html)值得在某些时候查看，尽管它的大部分内容在课程的后期才会变得相关。另外，与基于类的组件有关的一切都与我们无关。
 <!-- - Some courses on [Egghead.io](https://egghead.io) like [Start learning React](https://egghead.io/courses/start-learning-react) are of high quality, and recently updated [The Beginner's Guide to React](https://egghead.io/courses/the-beginner-s-guide-to-reactjs) is also relatively good; both courses introduce concepts that will also be introduced later on in this course. **NB** The first one uses class components but the latter uses the new functional ones.-->
- - [Egghead.io](https://egghead.io)上的一些课程，如[开始学习React](https://egghead.io/courses/start-learning-react)质量很高，最近更新的[The Beginner's Guide to React](https://egghead.io/courses/the-beginner-s-guide-to-reactjs)也比较好；这两个课程介绍的概念也将在本课程的后面介绍。**NB**前者使用类组件，但后者使用新的功能组件。
+  - [Egghead.io](https://egghead.io)上的一些课程，如[开始学习React](https://egghead.io/courses/start-learning-react)质量很高，最近更新的[The Beginner's Guide to React](https://egghead.io/courses/the-beginner-s-guide-to-reactjs)也比较好；这两个课程介绍的概念也将在本课程的后面介绍。**NB**前者使用类组件，但后者使用新的功能组件。
 
 </div>
 

src/content/10/zh/part10b.md

@@ -763,7 +763,7 @@ const BodyMassIndexCalculator = () => {
  在这个例子中，我们在<em>BodyMassIndexCalculator</em>组件中定义了<em>Formik</em>上下文，并为它提供了初始值和一个提交回调。初始值是通过[initialValues](https://jaredpalmer.com/formik/docs/api/formik#initialvalues-values)prop提供的，是一个以字段名为键、以相应的初始值为值的对象。提交回调是通过[onSubmit](https://jaredpalmer.com/formik/docs/api/formik#onsubmit-values-values-formikbag-formikbag--void--promiseany)prop提供的，它在<em>handleSubmit</em>函数被调用时被调用，条件是没有任何验证错误。<em>Formik</em>组件的子女是一个函数，它被调用的[props](https://jaredpalmer.com/formik/docs/api/formik#formik-render-methods-and-props)包括与状态有关的信息和行动，如<em>handleSubmit</em>函数。
 
 <!-- The <em>BodyMassIndexForm</em> component contains the state bindings between the context and text inputs. We use the [useField](https://jaredpalmer.com/formik/docs/api/useField) hook to get the value of a field and to change it. _useField_ hooks has one argument which is the name of the field and it returns an array with three values, <em>[field, meta, helpers]</em>. The [field object](https://jaredpalmer.com/formik/docs/api/useField#fieldinputpropsvalue) contains the value of the field, the [meta object](https://jaredpalmer.com/formik/docs/api/useField#fieldmetapropsvalue) contains field meta information such as a possible error message and the [helpers object](https://jaredpalmer.com/formik/docs/api/useField#fieldhelperprops) contains different actions for changing the state of field such as the <em>setValue</em> function. Note that the component that uses the <em>useField</em> hook has to be _within the Formik's context_. This means that the component has to be a descendant of the <em>Formik</em> component.-->
- <em>BodyMassIndexForm</em>组件包含上下文和文本输入之间的状态绑定。我们使用[useField](https://jaredpalmer.com/formik/docs/api/useField)钩子来获取一个字段的值并改变它。_useField_钩子有一个参数，是字段的名称，它返回一个有三个值的数组，<em>[field, meta, helpers]</em>。字段对象](https://jaredpalmer.com/formik/docs/api/useField#fieldinputpropsvalue)包含字段的值，[元对象](https://jaredpalmer.com/formik/docs/api/useField#fieldmetapropsvalue)包含字段的元信息，如可能的错误信息，[帮助者对象](https://jaredpalmer.com/formik/docs/api/useField#fieldhelperprops)包含改变字段状态的不同操作，如<em>setValue</em>函数。请注意，使用<em>useField</em>钩子的组件必须在Formik's context_之内。这意味着该组件必须是<em>Formik</em>组件的一个子嗣。
+ <em>BodyMassIndexForm</em>组件包含上下文和文本输入之间的状态绑定。我们使用[useField](https://jaredpalmer.com/formik/docs/api/useField)钩子来获取一个字段的值并改变它。_useField_钩子有一个参数，是字段的名称，它返回一个有三个值的数组，<em>[field, meta, helpers]</em>。[字段对象](https://jaredpalmer.com/formik/docs/api/useField#fieldinputpropsvalue)包含字段的值，[元对象](https://jaredpalmer.com/formik/docs/api/useField#fieldmetapropsvalue)包含字段的元信息，如可能的错误信息，[帮助者对象](https://jaredpalmer.com/formik/docs/api/useField#fieldhelperprops)包含改变字段状态的不同操作，如<em>setValue</em>函数。请注意，使用<em>useField</em>钩子的组件必须在Formik's context_之内。这意味着该组件必须是<em>Formik</em>组件的一个子嗣。
 
 <!-- Here is an interactive version of our previous example: [Formik example](https://snack.expo.io/@kalleilv/formik-example).-->
  这里是我们之前例子的互动版本。[Formik例子](https://snack.expo.io/@kalleilv/formik-example)。

src/content/10/zh/part10c.md

@@ -70,12 +70,12 @@ const fetchMovies = async () => {
  接下来，让我们在实践中尝试Fetch API。Rate-repository-api 服务器提供了一个端点，用于返回一个分页的已审核仓库的列表。一旦服务器运行，你应该能够访问[http://localhost:5000/api/repositories](http://localhost:5000/api/repositories)这个端点。数据是以常见的[基于游标的分页格式](https://graphql.org/learn/pagination/)分页的。实际的存储库数据在<i>node</i>键后面的<i>edges</i>阵列中。
 
 <!-- Unfortunately, we can't access the server directly in our application by using the <i>http://localhost:5000/api/repositories</i> URL. To make a request to this endpoint in our application we need to access the server using its IP address in its local network. To find out what it is, open the Expo development tools by running <em>npm start</em>. In the development tools you should be able to see an URL starting with <i>exp://</i> above the QR code:-->
- 不幸的是，我们不能通过使用<i>http://localhost:5000/api/repositories</i> URL在我们的应用中直接访问该服务器。为了在我们的应用中向这个端点发出请求，我们需要使用其本地网络中的IP地址访问服务器。要知道它是什么，通过运行<em>npm start</em>打开Expo开发工具。在开发工具中，你应该能够看到二维码上面有一个以<i>exp://<i>开头的URL。
+ 不幸的是，我们不能通过使用<i>http://localhost:5000/api/repositories</i> URL在我们的应用中直接访问该服务器。为了在我们的应用中向这个端点发出请求，我们需要使用其本地网络中的IP地址访问服务器。要知道它是什么，通过运行<em>npm start</em>打开Expo开发工具。在开发工具中，你应该能够看到二维码上面有一个以<i>exp://</i>开头的URL。
 
 ![Development tools](../../images/10/10.png)
 
 <!-- Copy the IP address between the <i>exp://</i> and <i>:</i>, which is in this example <i>192.168.100.16</i>. Construct an URL in format <i>http://<IP_ADDRESS>:5000/api/repositories</i> and open it in the browser. You should see the same response as you did with the <i>localhost</i> URL.-->
- 复制<i>exp://<i>和<i>:</i>之间的IP地址，在这个例子中是<i>192.168.100.16</i>。构建一个格式为<i>http://<IP_ADDRESS>:5000/api/repositories</i>的URL，并在浏览器中打开它。你应该看到与<i>localhost</i> URL相同的响应。
+ 复制<i>exp://</i>和<i>:</i>之间的IP地址，在这个例子中是<i>192.168.100.16</i>。构建一个格式为<i>http://<IP_ADDRESS>:5000/api/repositories</i>的URL，并在浏览器中打开它。你应该看到与<i>localhost</i> URL相同的响应。
 
 <!-- Now that we know the end point's URL let's use the actual server-provided data in our reviewed repositories list. We are currently using mock data stored in the <em>repositories</em> variable. Remove the <em>repositories</em> variable and replace the usage of the mock data with this piece of code in the <i>RepositoryList.jsx</i> file in the <i>components</i> directory:-->
  现在我们知道了端点的URL，让我们在审查的存储库列表中使用服务器提供的实际数据。我们目前正在使用存储在<em>repositories</em>变量中的模拟数据。删除<em>repositories</em>变量，用<i>components</i>目录下的<i>RepositoryList.jsx</i>文件中的这段代码替换模拟数据的使用。

src/content/10/zh/part10d.md

@@ -193,7 +193,7 @@ describe('Greeting', () => {
  React Native Testing Library's documentation有一些关于[如何查询不同种类的元素](https://callstack.github.io/react-native-testing-library/docs/how-should-i-query)的好提示。另一个值得阅读的指南是Kent C. Dodds的文章[Making your UI tests resilient to change](https://kentcdodds.com/blog/making-your-ui-tests-resilient-to-change)。
 
 <!-- The <em>render</em> function returns the queries and additional helpers, such as the <em>debug</em> function. The [debug](https://callstack.github.io/react-native-testing-library/docs/api#debug) function prints the rendered React tree in a user-friendly format. Use it if you are unsure what the React tree rendered by the <em>render</em> function looks like. We acquire the <em>Text</em> node containing certain text by using the <em>getByText</em> function. For all available queries, check the React Native Testing Library's [documentation](https://callstack.github.io/react-native-testing-library/docs/api-queries). The <em>toHaveTextContent</em> matcher is used to assert that the node's textual content is correct. The full list of available React Native specific matchers can be found in the [documentation](https://github.com/testing-library/jest-native#matchers) of the jest-native library. Jest's [documentation](https://jestjs.io/docs/en/expect) contains every universal Jest matcher.-->
- <em>render</em>函数返回查询和额外的辅助工具，例如<em>debug</em>函数。[debug](https://callstack.github.io/react-native-testing-library/docs/api#debug)函数以用户友好的格式打印出渲染的React树。如果你不确定<em>render</em>函数所渲染的React树是什么样子的，可以使用它。我们通过使用<em>getByText</em>函数获得包含某些文本的<em>Text</em>节点。关于所有可用的查询，请查看React Native Testing Library's [document](https://callstack.github.io/react-native-testing-library/docs/api-queries)。<em>toHaveTextContent</em>匹配器用于断定节点的文本内容是正确的。可用的React Native特定匹配器的完整列表可以在jest-native库的【文档】(https://github.com/testing-library/jest-native#matchers)中找到。Jest's [document](https://jestjs.io/docs/en/expect) 包含了所有通用的Jest匹配器。
+ <em>render</em>函数返回查询和额外的辅助工具，例如<em>debug</em>函数。[debug](https://callstack.github.io/react-native-testing-library/docs/api#debug)函数以用户友好的格式打印出渲染的React树。如果你不确定<em>render</em>函数所渲染的React树是什么样子的，可以使用它。我们通过使用<em>getByText</em>函数获得包含某些文本的<em>Text</em>节点。关于所有可用的查询，请查看React Native Testing Library's [document](https://callstack.github.io/react-native-testing-library/docs/api-queries)。<em>toHaveTextContent</em>匹配器用于断定节点的文本内容是正确的。可用的React Native特定匹配器的完整列表可以在jest-native库的[文档](https://github.com/testing-library/jest-native#matchers)中找到。Jest's [document](https://jestjs.io/docs/en/expect) 包含了所有通用的Jest匹配器。
 
 <!-- The second very important React Native Testing Library concept is firing events. We can fire an event in a provided node by using the [fireEvent](https://callstack.github.io/react-native-testing-library/docs/api#fireevent) object's methods. This is useful for example typing text into a text field or pressing a button. Here is an example of how to test submitting a simple form:-->
  第二个非常重要的React Native测试库概念是发射事件。我们可以通过使用[fireEvent](https://callstack.github.io/react-native-testing-library/docs/api#fireevent)对象的方法在所提供的节点中触发一个事件。这对于在文本字段中输入文本或按下按钮是很有用的。下面是一个如何测试提交一个简单表单的例子。