Фреймворк или библиотека?
Это заблуждение, что React — это фреймворк. React — это не фреймворк, это библиотека JavaScript. Фреймворки не гибкие. Фреймворк обычно хочет, чтобы мы кодировали все определенным образом. Где библиотека дает нам больше свободы. Фреймворки также обычно большие и полны функций. Если нам нужно использовать только небольшую их часть, мы все равно должны включить все это.
Манипуляции с DOM
React обновляет DOM особым образом. Если мы вносим какие-либо изменения в DOM, React не заменяет весь DOM, а создает виртуальный DOM и сопоставляет два DOM. Если React находит там какие-либо изменения, React просто обновляет только это изменение, не заменяя весь DOM. Вот почему React такой быстрый.
Компоненты
Мы можем создавать многоразовые, компонуемые и сохраняющие состояние компоненты в React. Нам не нужно повторять наш код, если мы используем компоненты. Компоненты делают наш код чистым, простым и легко читаемым. Мы определяем маленькие компоненты, а затем объединяем их, чтобы сформировать более крупные. Все компоненты, маленькие или большие, можно использовать повторно, даже в разных проектах. Можно повторно использовать один компонент в нескольких пользовательских интерфейсах, а компоненты могут содержать другие компоненты.
Реагировать на крючки
React Hooks — это не что иное, как специальная функция. Хуки обычно начинаются со слова «использовать». Например, «useState», «useEffect», «useContext», «useReducer», «useCallback» и так далее. Функции React hook можно использовать только в функциональных компонентах. Мы не можем использовать их в компонентах класса.
Реагировать JSX
React создает элемент с помощью React.createElement(component, props,…children) этой функции. JSX — это синтаксический сахар этой функции. Реагируйте, скомпилируйте этот JSX в эту функцию. Имя элемента JSX должно начинаться с заглавной буквы. Точно так же, как обычные атрибуты HTML, мы можем установить свойства в JSX.
Типы реквизита
Если вы изучаете React, вы обязательно должны знать, что такое props? Мы передаем разные типы данных с помощью реквизита. Но если мы передаем неправильный тип данных через props. Предположим, мы написали компонент, в котором мы отображаем массив. Но случайно мы передаем объект. Вот пакет npm под названием props-types, который помогает нам в отладке. Это не альтернатива машинописному тексту. Мы можем просто проверить тип реквизита.
Тернарный оператор
Ну, мы не можем использовать условный оператор if…else в JSX. Но иногда нам нужно условно отображать состояние или элемент JSX. Предположим, у вас есть состояние isNew. Если isNew равно true, вы хотите отобразить зеленый цвет фона в элементе JSX. Но если isNew равно false, тогда вы хотите отобразить серый цвет фона в элементе JSX. Хотя мы не можем использовать if…else в JSX, мы можем использовать тернарный оператор. Это проще, чем если бы… иначе. Если вы не знаете, что такое троичный оператор, троичный оператор — это простейшая версия if…else.
Ненужный поток
Каждый новичок в React считает, что ему нужно использовать реализацию Flux, такую как Redux. Редукс великолепен. Это самая популярная реализация Flux, но она может нам понадобиться. Если мы изучаем React, если наше приложение маленькое, если нам не нужно глобальное состояние или у нас нет проблем с отслеживанием изменений состояния в нашем приложении, нам не нужно его использовать.
Одностраничное приложение
Мы можем создать одностраничное веб-приложение, используя React. Эта функция делает React более мощным. Если мы создадим одностраничное веб-приложение, наш сайт будет быстрее любого другого обычного сайта. Потому что нам нужно загрузить только одну страницу для отображения. Вместо рендеринга многих страниц мы будем рендерить множество компонентов. Вот почему, когда мы переходим с одной страницы на другую, наш браузер не обновляет всю новую страницу. Вместо этого браузер отображает только определенные компоненты.
Язык шаблона
Многие фреймворки JavaScript используют язык шаблонов. Вместо языка шаблонов мы используем JSX в React. JSX проще, чем любой другой язык шаблонов. Мы можем делать все, что язык шаблонов делает с React. Это одна из причин, почему разработчики любят React.
