You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/learn/installation.md
+6-34Lines changed: 6 additions & 34 deletions
Original file line number
Diff line number
Diff line change
@@ -8,20 +8,7 @@ React был спроектирован с самого начала с учёт
8
8
9
9
</Intro>
10
10
11
-
<<<<<<< HEAD
12
-
<YouWillLearnisChapter={true}>
13
-
14
-
*[Как создать новый React-проект](/learn/start-a-new-react-project)
15
-
*[Как добавить React в существующий проект](/learn/add-react-to-an-existing-project)
16
-
*[Как настроить редактор кода](/learn/editor-setup)
17
-
*[Как установить React Developer Tools](/learn/react-developer-tools)
18
-
19
-
</YouWillLearn>
20
-
21
11
## Попробовать React {/*try-react*/}
22
-
=======
23
-
## Try React {/*try-react*/}
24
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
25
12
26
13
Вам не нужно ничего устанавливать, чтобы попробовать React. Поредактируйте код в песочнице!
27
14
@@ -43,42 +30,27 @@ export default function App() {
43
30
44
31
Такие песочницы есть на большинстве страниц React-документации. За пределами React-документации также есть большое количество песочниц, поддерживающих React. Например: [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react) или [CodePen.](https://codepen.io/pen?template=QWYVwWN)
Чтобы попробовать React локально на вашем компьютере, [скачайте эту HTML страницу.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Откройте её в своем текстовом редакторе и браузере!
50
34
51
-
## Начать новый React-проект {/*start-a-new-react-project*/}
35
+
## Начать новый React-проект {/*creating-a-react-app*/}
52
36
53
-
Если вы хотите создать приложение или сайт полностью на React — [создайте новый React-проект.](/learn/start-a-new-react-project)
54
-
=======
55
-
To try React locally on your computer, [download this HTML page.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Open it in your editor and in your browser!
37
+
Если вы хотите создать приложение или сайт полностью на React — [создайте новый React-проект,](/learn/creating-a-react-app) используя рекомендуемые фреймворки.
56
38
57
-
## Creating a React App {/*creating-a-react-app*/}
39
+
## Создать React-приложение с нуля {/*build-a-react-app-from-scratch*/}
58
40
59
-
If you want to start a new React app, you can [create a React app](/learn/creating-a-react-app) using a recommended framework.
60
-
61
-
## Build a React App from Scratch {/*build-a-react-app-from-scratch*/}
62
-
63
-
If a framework is not a good fit for your project, you prefer to build your own framework, or you just want to learn the basics of a React app you can [build a React app from scratch](/learn/build-a-react-app-from-scratch).
64
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
41
+
Если существующие фреймворки не подходят вашему проекту, вы предпочитаете написать свой собственный или изучить внутренности React-приложения, вы можете создать [React-приложение с нуля](/learn/build-a-react-app-from-scratch).
65
42
66
43
## Добавить React в существующий проект {/*add-react-to-an-existing-project*/}
67
44
68
-
<<<<<<< HEAD
69
45
Если вы хотите попробовать React в существующем приложении или сайте — [добавьте React в существующий проект.](/learn/add-react-to-an-existing-project)
70
-
=======
71
-
If want to try using React in your existing app or a website, you can [add React to an existing project.](/learn/add-react-to-an-existing-project)
72
-
73
46
74
47
<Note>
75
48
76
-
#### Should I use Create React App? {/*should-i-use-create-react-app*/}
49
+
#### Должен ли я использовать Create React App? {/*should-i-use-create-react-app*/}
77
50
78
-
No. Create React App has been deprecated. For more information, see [Sunsetting Create React App](/blog/2025/02/14/sunsetting-create-react-app).
51
+
Нет. Create React App был признан устаревшим. Больше информации в статье об [остановке поддержки Create React App](/blog/2025/02/14/sunsetting-create-react-app).
## Мобильные устройства (React Native) {/*mobile-react-native*/}
58
-
React Developer Tools также можно использовать для отладки приложений, созданных с помощью [React Native](https://reactnative.dev/).
59
-
Самый простой способ использования React Developer Tools - установить их глобально:
57
+
Для отладки приложений, созданных с помощью [React Native](https://reactnative.dev/), вы можете использовать [React Native DevTools](https://reactnative.dev/docs/react-native-devtools), встроенный отладчик, который уже синтегрирован с React Developer Tools. Вся функциональность работает аналогично браузерному расширению, включая подсветку и выбор элементов.
60
58
61
-
```bash
62
-
# Yarn
63
-
yarn global add react-devtools
64
-
=======
65
-
## Mobile (React Native) {/*mobile-react-native*/}
66
-
67
-
To inspect apps built with [React Native](https://reactnative.dev/), you can use [React Native DevTools](https://reactnative.dev/docs/react-native-devtools), the built-in debugger that deeply integrates React Developer Tools. All features work identically to the browser extension, including native element highlighting and selection.
68
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
69
-
70
-
[Learn more about debugging in React Native.](https://reactnative.dev/docs/debugging)
71
-
72
-
<<<<<<< HEAD
73
-
Откройте инструменты разработчика в терминале.
74
-
```bash
75
-
react-devtools
76
-
```
77
-
78
-
Он подключится к любому локальному приложению React Native, которое запущено.
79
-
80
-
> Попробуйте перезагрузить приложение, если инструменты разработчика не подключатся через несколько секунд.
59
+
[Узнайте больше об отладке в React Native.](https://reactnative.dev/docs/debugging)
81
60
82
-
[Узнайте больше о отладке React Native.](https://reactnative.dev/docs/debugging)
83
-
=======
84
-
> For versions of React Native earlier than 0.76, please use the standalone build of React DevTools by following the [Safari and other browsers](#safari-and-other-browsers) guide above.
85
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
61
+
> Для версий React Native более ранних чем 0.76, пожалуйста, используйте автономную сборку React DevTools, следуя инструкции [Safari и другие браузеры](#safari-and-other-browsers) выше.
Copy file name to clipboardExpand all lines: src/content/learn/render-and-commit.md
+1-12Lines changed: 1 addition & 12 deletions
Original file line number
Diff line number
Diff line change
@@ -84,11 +84,7 @@ export default function Image() {
84
84
85
85
Этот процесс рекурсивен: если обновленный компонент возвращает какой-то другой компонент, React будет рендерить _этот_ компонент следующим, и если этот компонент тоже что-то возвращает, он будет рендерить _этот_ компонент следующим, и так далее. Этот процесс будет продолжаться до тех пор, пока не останется вложенных компонентов и React не будет точно знать, что должно быть отображено на экране.
86
86
87
-
<<<<<<< HEAD
88
-
В следующем примере React вызовет `Gallery()` и `Image()` несколько раз:
89
-
=======
90
-
In the following example, React will call `Gallery()` and `Image()` several times:
91
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
87
+
В следующем примере React вызовет `Gallery()` и `Image()` несколько раз:
## Часть 3: React фиксирует изменения в DOM {/*step-3-react-commits-changes-to-the-dom*/}
154
150
155
-
<<<<<<< HEAD
156
151
После рендеринга (вызова) ваших компонентов React модифицирует DOM.
157
152
158
153
***На начальном рендере,** React использует [`appendChild()`](https://developer.mozilla.org/ru/docs/Web/API/Node/appendChild) DOM API, чтобы вставить все DOM ноды, которые он создал на экране.
159
154
***Для ре-рендеров,** React будет применять минимально необходимые операции (вычисляемые во время рендеринга!), чтобы DOM соответствовал последнему выводу рендеринга.
160
-
=======
161
-
After rendering (calling) your components, React will modify the DOM.
162
-
163
-
***For the initial render,** React will use the [`appendChild()`](https://developer.mozilla.org/docs/Web/API/Node/appendChild) DOM API to put all the DOM nodes it has created on screen.
164
-
***For re-renders,** React will apply the minimal necessary operations (calculated while rendering!) to make the DOM match the latest rendering output.
165
-
>>>>>>> 55986965fbf69c2584040039c9586a01bd54eba7
166
155
167
156
**React изменяет узлы DOM только если есть разница между рендерами.** Например, вот компонент, который рендерится с разными пропсами, передаваемыми от родителя каждую секунду. Обратите внимание, как вы можете добавить некоторый текст в `<input>`, обновляя его `значение`, но текст не исчезает при повторном рендеринге компонента:
0 commit comments