Опановуємо React

Зміст курсу

Опановуємо React

Опановуємо React

1. Вступ до Основ React

Що таке React?SPA vs. MPA у Веб Розробці Як React Працює з Віртуальним DOM Знайомство з JSX в React Створення Складних JSX Елементів Рендеринг Елементів у React Челендж: Рендеринг Елемента Компонент React Пропси в React Челендж: Функціональні Компоненти Умовний Рендеринг Челендж: Умовний Рендеринг Контенту Challenge: Implement Conditional Rendering – Bank Alert Рендеринг Набору Даних Челендж: Рендеринг Набору Даних Вступ до Основ React Підсумок Розділу

2. Стилізація в React Додатках

Вступ до Стилізації в React Вбудовані Стилі Вбудовані Стилі на Практиці Челендж: Вбудовані Стилі Стилізація за Допомогою CSS Файлу Стилізація за Допомогою CSS файлу на Практиці Челендж: Стилізація за Допомогою CSS Файлу Стилізація за Допомогою CSS Модулів Організація Структури Файлів та Папок Челендж: CSS Модулі Стилізація в React Підсумок Розділу

3. React Хуки та Контекст

Вступ: React Хуки та Контекст useState Хук Челендж: Перемикання Видимості useRef Хук Челендж: Створення Компонента Форми useEffect Хук Челендж: Отримання та Відображення Даних useMemo Хук Челендж: Фільтрація Списку Автомобілів Контекст Контекст на Практиці Челендж: World of Astronomy Додаток React Хуки та Контекст Підсумок Розділу

4. React в Реальному Світі

Налаштування Середовища Редактор Коду Налаштування Папки Проекту Термінал Початок і Запуск Проекту React з Vite React в Реальному Світі Підсумок Розділу

Челендж: CSS Модулі

Завдання: Створення картки користувача за допомогою модулів CSS

У цьому завданні ви розробите картку користувача, яка відображатиме його фотографію та відповідну інформацію. Застосуйте відповідні стилі до кожного компонента та забезпечте їх правильне використання. Наша мета - досягти такого інтерфейсу:

Завдання таке:

У файлі UserInfo.jsx імпортуйте файл стилів (UserInfo.module.css) і призначити його як s для асоціації стилів.
Щоб завершити збірку програми, імпортуйте файл UserInfo.jsx до файлу App.jsx.

To import a file, use the import statement and specify the source file.
To associate the CSS file with the s, import it using import s from "path_to_the_file";.
To utilize the UserInfo component within the App component, use the syntax </UserInfo />.

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 2. Розділ 10

some-alt