react-course-track's Introduction

Заняття 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>

Recommend Projects