Apply suggestions from code review

Co-authored-by: Nick Tishkevich <[email protected]>

Author: pblyp

src/content/learn/index.md

@@ -22,7 +22,7 @@ title: Quick Start
 
 Приложения на React собираются из *компонентов*. Компонент — это часть пользовательского интерфейса, у которого есть собственная логика и внешность. Компонент может быть маленьким, как кнопка, или большим, как целая страница.
 
-Компоненты React — это функции JavaScript, которые возвращают разметку:
+React-компоненты — это функции JavaScript, которые возвращают разметку:
 
 ```js
 function MyButton() {
@@ -114,7 +114,7 @@ React не ограничивает вас в том, как добавлять
 
 ## Отображение данных {/*displaying-data*/}
 
-Фигурные скобки внутри JSX-разметки позволяют использовать JavaScript, например для того чтобы отобразить свою переменную пользователю. Код ниже отобразит `user.name`:
+Фигурные скобки внутри JSX-разметки позволяют использовать JavaScript, например, для того, чтобы отобразить свою переменную пользователю. Код ниже отобразит `user.name`:
 
 ```js {3}
 return (
@@ -295,11 +295,11 @@ function MyButton() {
 }
 ```
 
-Заметьте: у `onClick={handleClick}` нет скобок в конце! Не _вызывайте_ функцию обработчика событий: вам нужно просто ее *передать*. React вызовет ваш обработчик событий, когда пользователь кликнет по кнопке.
+Заметьте: у `onClick={handleClick}` нет скобок в конце! Не _вызывайте_ функцию обработчика событий: вам нужно просто её *передать*. React вызовет ваш обработчик событий, когда пользователь кликнет по кнопке.
 
 ## Обновление экрана {/*updating-the-screen*/}
 
-Вам может понадобиться, чтобы компонент «помнил» какую-то информацию и отображал её. Например, вы хотите посчитать сколько раз была нажата кнопка. Чтобы это сделать, добавьте *состояние* в ваш компонент.
+Вам может понадобиться, чтобы компонент «помнил» какую-то информацию и отображал её. Например, вы хотите посчитать сколько раз была нажата кнопка. Для этого добавьте *состояние* в ваш компонент.
 
 Сначала импортируйте [`useState`](/reference/react/useState) из React:
 
@@ -317,7 +317,7 @@ function MyButton() {
 
 `useState` вернет вам две вещи: текущее состояние (`count`) и функцию (`setCount`), которая обновляет его. Можно именовать их как вам угодно, но такого рода вещи принято называть `[something, setSomething]`.
 
-При первом показе кнопка `count` будет иметь значение `0`, потому что вы передали `0` в `useState()`. Чтобы изменить состояние, вызовите `setCount()` и передайте туда новое значение. Клик на эту кнопку будет увеличивать счётчик:
+При первом показе кнопка `count` будет иметь значение `0`, потому что вы передали `0` в `useState()`. Для изменения состояния вызовите `setCount()` и передайте туда новое значение. Клик на эту кнопку будет увеличивать счётчик:
 
 ```js {5}
 function MyButton() {
@@ -382,7 +382,7 @@ button {
 
 ## Использование хуков {/*using-hooks*/}
 
-Функции, которые начинаются с `use`, называются *хуками*. `useState` — это встроенный в React хук. В [справочнике API](/reference/react) приводятся другие встроенные хуки. Также, вы можете писать свои собственные хуки, совмещая их с уже существующими.
+Функции, которые начинаются с `use`, называются *хуками*. `useState` — это встроенный хук в React. В [справочнике API](/reference/react) приводятся другие встроенные хуки. Также, вы можете писать свои собственные хуки, совмещая их с уже существующими.
 
 У хуков больше ограничений, чем у других функций. Хуки могут вызываться только *в начале* ваших компонентов (или других хуков). Если вам нужен `useState` в условии или цикле, выделите новый компонент и используйте его там.
 
@@ -392,7 +392,7 @@ button {
 
 <DiagramGroup>
 
-<Diagram name="sharing_data_child" height={367} width={407} alt="Диаграмма, показывающая дерево из трех компонентов, состоящее из компонента-родителя под названием MyApp и двух дочерних компонентов под названием MyButton. Оба компонента MyButton содержат счётчик со значением, равным нулю.">
+<Diagram name="sharing_data_child" height={367} width={407} alt="Диаграмма, показывающая дерево из трёх компонентов, состоящее из компонента-родителя под названием MyApp и двух дочерних компонентов под названием MyButton. Оба компонента MyButton содержат счётчик со значением, равным нулю.">
 
 В начале у каждого `MyButton` состояние `count` равно `0`
 
@@ -428,7 +428,7 @@ button {
 
 </DiagramGroup>
 
-Теперь, когда вы нажимаете на любую из кнопок, `count` в `MyApp` будет менять своё значение, что в свою очередь повлечёт обновление счётчиков в обоих компонентах `MyButton`. Вот как это можно прописать в коде.
+Теперь, когда вы нажимаете на любую из кнопок, `count` в `MyApp` будет менять своё значение, что в свою очередь повлечёт обновление счётчиков в обоих компонентах `MyButton`. Вот как это можно выразить в коде.
 
 Сначала *переместите вверх состояние* из `MyButton` в `MyApp`:
 
@@ -489,7 +489,7 @@ function MyButton({ count, onClick }) {
 }
 ```
 
-Когда вы нажимаете на кнопку, срабатывает обработчик `onClick`. В каждой кнопке в качестве значения пропа `onClick` задана функция `handleClick` из `MyApp`, таким образом, исполняется код этой функции. Этот код вызывает `setCount(count + 1)`, тем самым увеличивая переменную состояния `count`. Новое значение `count` передается в качестве пропа каждой кнопке, таким образом все кнопки будут показывать это новое значение. Это называется "подъёмом состояния вверх". Поднимая состояние вверх, вы делаете его общим для всех компонентов.
+Когда вы нажимаете на кнопку, срабатывает обработчик `onClick`. В каждой кнопке в качестве значения пропа `onClick` задана функция `handleClick` из `MyApp`, таким образом, исполняется код этой функции. Этот код вызывает `setCount(count + 1)`, тем самым увеличивая переменную состояния `count`. Новое значение `count` передаётся в качестве пропа каждой кнопке, таким образом все кнопки будут показывать это новое значение. Это называется "подъёмом состояния вверх". Поднимая состояние вверх, вы делаете его общим для всех компонентов.
 
 <Sandpack>