Розуміння Компонентів React

Додаток React складається з компонентів. Компонент — це багаторазовий фрагмент інтерфейсу користувача, який визначає, що відображається на екрані. Замість створення всієї сторінки як одного великого блоку, React заохочує розділяти інтерфейс на менші частини. Кожна частина відповідає за певну секцію інтерфейсу, наприклад, заголовок, кнопку або повідомлення.

У React компоненти пишуться за допомогою JavaScript і визначаються як функції. Кожен компонент повертає опис того, що має з’явитися на екрані, а React відповідає за його відображення.

Компоненти спрощують розуміння та підтримку інтерфейсів. Коли інтерфейс зростає, компоненти допомагають організувати код, повторно використовувати логіку та уникати дублювання. Нижче наведено простий приклад React-компонента:

function Welcome() {
  return <h1>Welcome to React</h1>;
}

Це компонент React з назвою Welcome. Він повертає елемент інтерфейсу, який React може відобразити на екрані. Вам поки не потрібно розуміти цей синтаксис. Цей приклад наведено, щоб показати, як виглядає компонент на загальному рівні.