Я начал изучать React несколько месяцев назад, читая официальную документацию, просматривая руководства и разрабатывая несколько проектов. Я многому научился в своем путешествии по React и теперь собираю это для разработчиков, которые хотят начать изучать React.

Что такое Реакт?

Согласно официальной документации React;

React — это декларативная, эффективная и гибкая библиотека JavaScript для создания пользовательских интерфейсов. Он позволяет создавать сложные пользовательские интерфейсы из небольших и изолированных фрагментов кода, называемых «компонентами».

Проще говоря, React — это библиотека JavaScript, которая использует подход, основанный на компонентах, для создания эффективных пользовательских интерфейсов.

Шаги по созданию нового реагирующего приложения

Хорошо, мы уже знаем, что такое React. Теперь давайте посмотрим на шаги, связанные с созданием приложения для реагирования.

  1. Прежде всего, нам нужно установить узел на нашем компьютере. Если у вас не установлен узел, вы можете скачать и установить его с официального сайта https://nodejs.org. После завершения установки мы можем открыть наш терминал или командную строку.
  2. Затем мы вводим код ниже в наш терминал и нажимаем Enter

Хорошо, что делает этот код?

Он создает новое приложение для реагирования, как следует из названия, со структурой папок и устанавливает последние зависимости, необходимые для работы нашего приложения для реагирования.

  • npx — это инструмент для запуска пакетов, который поставляется с node.
  • create-react-app — как следует из названия, он создает реагирующее приложение.
  • my-app  — это имя папки нашего приложения, мы можем назвать ее как угодно.

Создание может занять некоторое время в зависимости от нашего интернет-соединения.

После завершения процесса создания нам нужно перейти в папку «my-app», выполнив приведенный ниже код.

Этот код изменяет наш каталог на папку «my-app».

Теперь мы можем открыть нашу недавно созданную папку приложения в любом текстовом редакторе по нашему выбору.

Наконец, мы можем вернуться к нашему терминалу и запустить:

запуск нпм

Это запустит наш сервер разработки на локальном хосте: 3000.

И вот как мы создаем наше первое приложение для реагирования.

Папки, созданные React

Наконец, давайте взглянем на структуру папок, созданную React.

  • node_modules  — содержит все зависимости и подзависимости, указанные в package.json.
  • public  – содержит HTML-файл, который можно изменить, например заголовок страницы.
  • src  — это сердце нашего приложения, оно содержит файлы наших компонентов, файлы css, тестовые файлы и т. д.
  • .gitignore  — используется git для обозначения файлов и папок, которые следует игнорировать при фиксации кода.
  • package-lock.json  — содержит точное дерево зависимостей для установки в /node_modules
  • package.json  — содержит зависимости и скрипты, необходимые для проекта.
  • README.md  — этот файл можно использовать для определения резюме нашего проекта, инструкций и т. д.

Если вам понравилась эта статья, пожалуйста, нажмите кнопку хлопка 🤭

LinkedIn: https://www.linkedin.com/in/jhoell-pelumi

Твиттер: https://twitter.com/JhoellDevIt?t=-EM8fdcvrx8H3mjH1Lu23A&s=09

Электронная почта: [email protected]