React — это библиотека JavaScript. Это не рамки. Многие люди во всем мире путают React с некоторыми другими фреймворками, но нет, это не фреймворк, а библиотека. Он завершен? Есть ли в нем все решения, которые нам нужны при создании веб-сайтов? Нет, конечно, нет. Но это легкая, простая в использовании библиотека на основе компонентов, которая используется во всем мире благодаря своим простым функциям.
Почему реагировать?
Теперь вы можете спросить, почему я должен использовать React? Я могу использовать любой фреймворк, который мне нужен, и у них есть решения для некоторых очень важных проблем. Так почему я должен использовать библиотеку вместо фреймворка? Теперь ответ на ваш вопрос прост. Когда мы используем фреймворки, мы должны кодировать определенным образом. Если мы будем кодировать немного иначе, чем хочет от нас фреймворк, то проект может рухнуть. В одном предложении рамки не гибкие.
С другой стороны, вы можете использовать React очень гибко. Это небольшая библиотека, которая сосредоточена на выполнении одной задачи, и делает это очень хорошо. Во-первых, это Создание пользовательских интерфейсов. Так что, если вам нужно что-то легкое и гибкое, вы знаете, что выбрать.
Как работает React?
По своей сути React в основном поддерживает дерево. Думайте о HTML-коде как о дереве. На самом деле именно так браузер и обращается с DOM. React фактически создает виртуальное дерево, состоящее из изменений, внесенных в код, и с помощью алгоритма сравнения сравнивает его с реальным деревом и выясняет, где внесены изменения. Затем он отправляет только те изменения, которые действительно сделаны.
React — это не что иное, как компоненты
React — это в основном библиотека, основанная на компонентах. Думайте об этом как о функции. Как и в случае с функцией, мы можем повторно использовать компоненты снова и снова. По своей сути компонент — это обычная функция JavaScript. Может быть много типов компонентов, но в целом мы можем видеть два типа компонентов, и они похожи на вид, но отличаются по данным и различны по внешнему виду и отличаются по данным. Один лучшее, что может сделать компонент, это то, что он может фактически иметь состояние для хранения данных, которые могут быть изменены в течение жизненного цикла компонента.
Как создать приложение React?
Это действительно очень просто. Вам просто нужно открыть свой любимый редактор кода или командную строку и перейти в папку, в которой у вас есть все ваши проекты.
Затем введите npx create-react-app my-app (вместо моего приложения вы можете использовать имя своего приложения)
Затем cd my-app, чтобы перейти в папку приложения.
и, наконец, npm запускает приложение.
JSX
JSX означает JavaScript XML. Он добавляет HTML в приложение React. JSX — очень важная функция React. Потому что React должен быть в области видимости JSX. Вместо написания компонентов React с использованием синтаксиса React.createElemnt мы используем синтаксис, очень похожий на HTML, а затем используем компилятор для его преобразования в вызовы React.createElemnt.
Имя должно начинаться с заглавной буквы
Первая буква имени должна быть заглавной — это одно из требований для React. Потому что при использовании реакции мы будем иметь дело с множеством элементов HTML, а также с элементами React. Теперь компилятор JSX будет рассматривать имена со строчными буквами как элемент HTML, чего мы не хотим. Поэтому, если мы хотим облегчить себе жизнь, нам придется начинать имя с заглавной буквы в React.
Создание компонентов
Поскольку React — это не что иное, как компонент, мы должны научиться создавать компонент. Самый простой способ создать компонент — использовать компоненты на основе хуков. Что очень легко. Теперь уделите небольшое внимание ниже,
Функциональное приложение () {
возвращение(
‹див›
‹h1›Это компонент ‹/h1›
‹/дел›);
}
Это буквально компонент с именем App. Теперь вы видите, как легко было создать компонент. И да, если вы думаете, что это не что иное, как функция, то вы абсолютно правы, что компоненты и есть функции.
Компоненты против элементов
Иногда люди путаются с компонентами и элементами. Ты часто путаешь эти два. Теперь слушай внимательно,
«Компонент React — это не что иное, как шаблон или функция (или класс), в которой вы пишете свой код. А элементы — это те коды, которые возвращаются из компонента. Это объект, который виртуально описывает узлы DOM, которые представляет компонент».
Зачем использовать компоненты?
Вы можете спросить, почему вы должны использовать компоненты. И ответ очень прост. Компонент можно использовать повторно. Вы можете использовать один компонент в различных случаях. Это держит ваше приложение в чистоте. Что вы делаете, так это делите свое приложение на несколько небольших частей с компонентами, а затем используете их с помощью реквизита и создаете свои веб-приложения. Это делает вашу работу чище, а код — более пригодным для повторного использования. Если ваш код становится сложным, вы всегда можете создать новый компонент и разделить существующие коды на несколько небольших частей и использовать их вместе.
