По моему мнению, веб-страницу можно разделить на небольшие подразделы, которые выполняют свои функции. Мы называем эти специальные части, каждая из которых выполняет свою функцию, компонентами. Думайте о своем сайте как об одной большой головоломке.
С React , сначала вы создаете кусочки головоломки один за другим, а затем комбинируете их, чтобы создать общую картину.

Например, мы можем разделить страницу Medium на три компонента:
компонент профиля, публикации и темы выглядит следующим образом.

Компоненты React — это стандартные блоки, формирующие пользовательский интерфейс, выполняющие определенные задачи, определяемые как классы или функции, возвращающие элементы реакции (JSX) и, возможно, принимающие параметры (props).
В основном существует два типа компонентов. Это классовые и функциональные компоненты. Давайте посмотрим, что они из себя представляют.

— — — — — — — — — — — — — — — — — — — — — — — — — — —

Компоненты на основе классов (Sınıf Tabanlı)

Учитывая, что вы освоили логику наследования, которая является одним из предметов, включенных в подход объектно-ориентированного программирования. Я бы сказал, как классы javascript, которые расширяются от класса «Компонент» в библиотеке React.

Поскольку эти классы расширяются от React Component, они также включают процессы жизненного цикла компонентов.

Базовый компонент на основе класса, как показано на рисунке выше,
можно создать.

Функциональные компоненты (Фоксиёнел)

Элементы Basic React (JSX), также называемые фиктивными и тупыми компонентами, представляют собой возвращаемые функции javascript. Причина в том, что они не могут получить доступ к состоянию. Эта структура изменилась с версией v.16.8. Теперь работает компоненты также могут получить доступ к состоянию.

В версии v.16.8 нет большой разницы между двумя типами компонентов, кроме синтаксиса. Мы полностью можем выбрать компонент в соответствии с целью использования, в соответствии с работой, которую вы будете выполнять.

— — — — — — — — — — — — — — — — — — — — — — — — —

Если вы спросите, в чем разница между функциональным компонентом и компонентом класса.

=› Хуки можно использовать только в функциональных компонентах.

=›Методы жизненного цикла можно использовать только в компонентах класса.

— — — — — — — — — — — — — — — — — — — — — — — — —