|
1 | | ---- |
2 | | -title: Установка |
3 | | ---- |
4 | | - |
5 | | -<Intro> |
6 | | - |
7 | | -React был спроектирован так, чтобы его можно было внедрять постепенно. Вы можете начать с малого и использовать только ту функциональность React, которая необходима вам в данный момент. Информация в этом разделе будет полезна как при первом знакомстве с React, так и при создании простой динамической HTML-страницы или проектировании сложного React-приложения. |
8 | | - |
9 | | - |
10 | | -</Intro> |
11 | | - |
12 | | -<YouWillLearn isChapter={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 | | - |
| 1 | +--- |
| 2 | +title: Установка |
| 3 | +--- |
| 4 | + |
| 5 | +<Intro> |
| 6 | + |
| 7 | +React был спроектирован так, чтобы его можно было внедрять постепенно. Вы можете начать с малого и использовать только ту функциональность React, которая необходима вам в данный момент. Информация в этом разделе будет полезна как при первом знакомстве с React, так и при создании простой динамической HTML-страницы или проектировании сложного React-приложения. |
| 8 | + |
| 9 | + |
| 10 | +</Intro> |
| 11 | + |
| 12 | +<YouWillLearn isChapter={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 | 21 | ## Пробуем React {/*try-react*/} |
22 | | - |
23 | | -Чтобы попробовать React, даже устанавливать ничего не нужно. Редактируйте прямо в песочнице! |
24 | | - |
25 | | -<Sandpack> |
26 | | - |
27 | | -```js |
28 | | -function Greeting({ name }) { |
29 | | - return <h1>Hello, {name}</h1>; |
30 | | -} |
31 | | - |
32 | | -export default function App() { |
33 | | - return <Greeting name="world" /> |
34 | | -} |
35 | | -``` |
36 | | - |
37 | | -</Sandpack> |
38 | | - |
39 | | -Вы можете редактировать прямо здесь или же открыть код в новой вкладке, нажав на кнопку "Форкнуть" в правом верхнем углу. |
40 | | - |
41 | | -Такие песочницы есть на большинстве страниц React-документации. За пределами React-документации также есть большое количество песочниц, поддерживающих React. Например: [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react) или [CodePen.](https://codepen.io/pen?&editors=0010&layout=left&prefill_data_id=3f4569d1-1b11-4bce-bd46-89090eed5ddb) |
42 | | - |
| 22 | + |
| 23 | +Чтобы попробовать React, даже устанавливать ничего не нужно. Редактируйте прямо в песочнице! |
| 24 | + |
| 25 | +<Sandpack> |
| 26 | + |
| 27 | +```js |
| 28 | +function Greeting({ name }) { |
| 29 | + return <h1>Hello, {name}</h1>; |
| 30 | +} |
| 31 | + |
| 32 | +export default function App() { |
| 33 | + return <Greeting name="world" /> |
| 34 | +} |
| 35 | +``` |
| 36 | + |
| 37 | +</Sandpack> |
| 38 | + |
| 39 | +Вы можете редактировать прямо здесь или же открыть код в новой вкладке, нажав на кнопку "Форкнуть" в правом верхнем углу. |
| 40 | + |
| 41 | +Такие песочницы есть на большинстве страниц React-документации. За пределами React-документации также есть большое количество песочниц, поддерживающих React. Например: [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react) или [CodePen.](https://codepen.io/pen?&editors=0010&layout=left&prefill_data_id=3f4569d1-1b11-4bce-bd46-89090eed5ddb) |
| 42 | + |
43 | 43 | ### Поиграть с React локально {/*try-react-locally*/} |
44 | | - |
45 | | -Что бы поиграть с React локально на вашем компьютере, [скачайте эту HTML страницу.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Откройте ее в своем текстовом редакторе и браузере! |
46 | | - |
47 | | -## Начать новый проект на React {/*start-a-new-react-project*/} |
48 | | - |
49 | | -Если вы хотите создать приложение или сайт полностью на React — [создайте новый проект на React.](/learn/start-a-new-react-project) |
50 | | - |
| 44 | + |
| 45 | +Что бы поиграть с React локально на вашем компьютере, [скачайте эту HTML страницу.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Откройте ее в своем текстовом редакторе и браузере! |
| 46 | + |
| 47 | +## Начать новый React-проект {/*start-a-new-react-project*/} |
| 48 | + |
| 49 | +Если вы хотите создать приложение или сайт полностью на React — [создайте новый React-проект.](/learn/start-a-new-react-project) |
| 50 | + |
51 | 51 | ## Добавить React в существующий проект {/*add-react-to-an-existing-project*/} |
52 | | - |
53 | | -Если вы хотите использовать React в существующем приложении или сайте — [добавьте React в существующий проект.](/learn/add-react-to-an-existing-project) |
54 | | - |
| 52 | + |
| 53 | +Если вы хотите использовать React в существующем приложении или сайте — [добавьте React в существующий проект.](/learn/add-react-to-an-existing-project) |
| 54 | + |
55 | 55 | ## Дальнейшие шаги {/*next-steps*/} |
56 | | - |
57 | | -Перейдите к [Введению в React](/learn) для ознакомления с самыми важными его концепциями. |
58 | | - |
| 56 | + |
| 57 | +Перейдите к [Введению в React](/learn) для ознакомления с самыми важными его концепциями. |
| 58 | + |
0 commit comments