Используйте встроенный набор инструментов для лучшего взаимодействия пользователя и разработчика.
\nНа этой странице описано несколько популярных наборов инструментов React, которые помогают в таких задачах как:
\nРекомендованные на этой странице инструменты не требуют дополнительной настройки для начала работы.
\nЕсли у вас нет проблем, описанных выше, или пока не чувствуете себя уверенно, используя инструменты JavaScript, рассмотрите возможность добавления React в виде простого тега <script> на HTML странице, при необходимости с JSX.
Также это самый простой способ добавить React в существующий веб-сайт. Вы всегда можете расширить набор инструментов, если посчитаете это нужным.
\nКоманда React в первую очередь рекомендует следующие решения:
\nCreate React App — удобная среда для изучения React и лучший способ начать создание нового одностраничного приложения на React.
\nИнструмент настраивает среду для использования новейших возможностей JavaScript, оптимизирует приложение для продакшена и обеспечивает комфорт во время разработки. Вам понадобятся Node.js не ниже версии 8.10 и npm не ниже версии 5.6 на вашем компьютере. Для создания проекта выполните команды:
\nnpx create-react-app my-app\ncd my-app\nnpm start\n\nПримечание
\n\n
npxв первой строке не является опечаткой. Это инструмент запуска пакетов, доступный в версиях npm 5.2 и выше.
Create React App не обрабатывает бэкенд логику или базы данных, он только предоставляет команды для сборки фронтенда, поэтому вы можете использовать его с любым бэкэндом. «Под капотом» используются Babel и webpack, но вам не нужно ничего знать о них.
\nКогда ваше приложение готово к развёртыванию в продакшене, запуск команды npm run build создаст оптимизированную сборку вашего приложения в папке build. Вы можете узнать больше о Create React App из его README и его пользовательского руководства.
Next.js — это популярный легковесный фреймворк для статических и серверных приложений, использующих React. Он включает в себя готовые решения для стилизации и маршрутизации и предполагает, что вы используете Node.js в качестве серверной среды.
\nУзнайте больше о Next.js из его официального руководства.
\nGatsby — лучший способ для создания статических сайтов с помощью React. Он позволяет использовать React-компоненты, но выводит предварительно отрендеренный HTML и CSS, чтобы гарантировать минимальное время загрузки.
\nУзнайте больше о Gatsby из его официального руководства и галереи стартовых комплектов.
\nСледующие наборы инструментов предлагают больше гибкости и выбора. Мы рекомендуем их более опытным разработчикам:
\nВ набор инструментов для сборки JavaScript обычно входят:
\nЕсли вы предпочтёте создать свой собственный набор JavaScript-инструментов с нуля, ознакомьтесь с этим руководством, в котором воссоздаются некоторые функции Create React App.
\nНе забудьте убедиться, что ваш набор инструментов правильно настроен для продакшена.
","frontmatter":{"title":"Создаём новое React-приложение","next":"cdn-links.html","prev":"add-react-to-a-website.html"},"fields":{"path":"content/docs/create-a-new-react-app.md","slug":"docs/create-a-new-react-app.html"}}},"pageContext":{"slug":"docs/create-a-new-react-app.html"}},"staticQueryHashes":[]}