Заняття 1 - Компоненти

• Знайомство
• Бібліотека React
  • Стандартизація розробки
  • Екосистема бібліотек
  • Компонентна розробка
• Інструменти розробника
• Рендер додатка в DOM у файлі main.jsx
  • Пакети react та react-dom
  • Методи createRoot та render
  • Елемент div#root у index.html
• Компоненти
  • Папка src/components
  • Кореневий компонент App
  • Дефолтний імпорт та експорт компонентів
• JSX - опис UI
  • Особливості
  • Правило спільного батька
  • Фрагменти
  • JSX вирази у розмітці та атрибутах
• Налаштування компонента
  • Параметр props
  • Деструктуризація пропсів
• Умовний рендеринг
  • Значення що не відображаються: null, undefined, false
  • Оператор &&
  • Тернарний оператор
• Колекції елементів
  • Метод map
  • Ключі елементів з key
  • Компоненти списку та елементу
• Властивість props.children
• Делой додатка на Vercel

JSX картки пейменту

<div>
  <p>Amount: </p>
  <p>Status: Paid or Pending</p>
  <p>Description: </p>
  <p>Card Number: </p>
  <p>Card Type: </p>
  <p>Card Holder Name: </p>
  <p>Payment Date: </p>
</div>