Хотите сделать свой React-сайт максимально быстрым и доступным? Вы пришли в нужное место!
React — это библиотека с открытым исходным кодом, которая упрощает создание пользовательских интерфейсов. Этот путь обучения будет охватывать различные API и инструменты в экосистеме, которые вам следует рассмотреть для повышения производительности и удобства использования вашего приложения.
Это руководство покажет вам, как начать работу с приложением React. Во всех остальных руководствах этого раздела будут рассмотрены темы по оптимизации скорости или доступности приложения React.
Почему это полезно?
Существует много контента, объясняющего, как создавать быстрые и надежные приложения, но не так много материалов, показывающих, как создавать быстрые и надежные приложения React . В этих руководствах все это рассматривается с точки зрения приложения React, где упоминаются только библиотеки, API и функции, специфичные для экосистемы React.
Чему вы научитесь?
Учебные пособия по этому пути обучения не фокусируются на:
- Как использовать Реагировать
- Как React работает под капотом
Хотя обе эти концепции будут затронуты при необходимости, все руководства и лабораторные работы в этом разделе вместо этого будут сосредоточены на том, как создавать быстрые и доступные сайты React. По этой причине необходимы базовые знания React .
Создать приложение React
Create React App (CRA) — это самый простой способ начать создавать приложения React. Он обеспечивает настройку по умолчанию с рядом встроенных основных функций, включая систему сборки, содержащую сборщик модулей (webpack) и транспилятор (Babel).
В оболочке командной строки вам нужно всего лишь запустить следующее, чтобы создать новое приложение:
npx create-react-app app-name
После завершения выполнения команды вы можете перейти к приложению и запустить его с помощью следующих команд:
cd new-app
npm start
Следующая вставка показывает структуру каталогов и фактическую веб-страницу только что загруженного приложения CRA.
Существует несколько файлов конфигурации и сценариев сборки, которые CRA использует для настройки веб-пакета и процесса сборки Babel, который включает базовую настройку Jest для тестирования. Чтобы упростить задачу пользователю, эти файлы скрыты, и к ним нельзя получить доступ, пока вы не удалите их из CRA. Всегда лучше избегать извлечения, когда это возможно, поскольку это означает использование всех этих файлов конфигурации в качестве собственного исходного кода, которым может быть сложно управлять.
Структура каталогов нового приложения CRA содержит только те файлы, которые вам действительно необходимо изменить для работы с вашим приложением. Документация CRA объясняет это подробно.
Что дальше?
Теперь, когда вы знаете, как приступить к созданию приложения Create React, узнайте, как повысить производительность и доступность вашего приложения, используя все руководства этого пути обучения: