Содержание пакета (3 курса)
1. React - Полное руководство 2023 4.667
1. JS необходимый для курса
11 уроков
👁
1 803
👤
1 803
Закрытый
1.1
Репозиторий кода для курса
↗
273
273
0м
8
Закрытый
1.2
Переменные
↗
238
238
14м
7
Закрытый
1.3
Шаблонный литерал. Динамика в строках
↗
172
172
4м
7
Закрытый
1.4
Условный оператор if
↗
159
159
12м
6
Закрытый
1.5
Тернарный оператор
↗
154
154
13м
6
Закрытый
1.6
Оператор нулевого слияния и &&
↗
146
146
20м
7
Закрытый
1.7
Метод foreach
↗
141
141
5м
5
Закрытый
1.8
Массивы - метод Find
↗
135
135
5м
5
Закрытый
1.9
Массивы - метод Filter
↗
131
131
8м
3
Закрытый
1.10
Массивы - метод Map
↗
124
124
7м
7
Закрытый
1.11
Массивы - метод Reduce
↗
130
130
14м
5
2. Знакомство с React
2 урока
👁
1 265
👤
1 265
Открытый
2.1
Что такое React
↗
1 100
1 100
9м
9
Закрытый
2.2
Знакомство с синтаксисом
↗
165
165
7м
5
3. Первые компоненты на React
5 уроков
👁
662
👤
662
Закрытый
3.1
Создаём первый компонент
↗
163
163
5м
4
Закрытый
3.2
JSX разметка. Синтаксис и размещение элементов
↗
141
141
12м
4
Закрытый
3.3
Композиция компонентов, родители и потомки
↗
123
123
10м
5
Закрытый
3.4
Динамические значения и выражения в JSX
↗
114
114
13м
7
Закрытый
3.5
ДЗ для самостоятельной работы
↗
121
121
0м
3
4. Разбор JSX
2 урока
👁
209
👤
209
Закрытый
4.1
Под капотом JSX
↗
111
111
15м
2
Закрытый
4.2
ДЗ для самостоятельной работы
↗
98
98
0м
1
5. Быстрый старт приложения. Создание бойлерплейта
5 уроков
👁
488
👤
488
Закрытый
5.1
Установка шаблона приложения CreateReactApp
↗
109
109
9м
2
Закрытый
5.2
Подготовка структуры проекта
↗
98
98
7м
4
Закрытый
5.3
Подготовка файлов для будущих компонентов
↗
93
93
16м
2
Закрытый
5.4
Styled Components. Стилизация
↗
94
94
17м
2
Закрытый
5.5
ДЗ для самостоятельной работы
↗
94
94
0м
2
6. Передача данных между компонентами. Props
4 урока
👁
343
👤
343
Закрытый
6.1
React Props - передача данных между компонентами
↗
95
95
12м
2
Закрытый
6.2
Как работают пропсы с точки зрения JS
↗
85
85
12м
4
Закрытый
6.3
Пропсы в Styled Components
↗
82
82
7м
1
Закрытый
6.4
ДЗ для самостоятельной работы
↗
81
81
0м
1
7. Состояние приложения
4 урока
👁
309
👤
309
Закрытый
7.1
Состояние, реактивность, useState
↗
82
82
15м
4
Закрытый
7.2
state vs props. Практика работы с состоянием
↗
79
79
28м
4
Закрытый
7.3
Поднятие состояние. Более совершенная передача данных
↗
75
75
6м
2
Закрытый
7.4
ДЗ для самостоятельной работы
↗
73
73
0м
2
8. Рендеринг списков в приложении
3 урока
👁
202
👤
202
Закрытый
8.1
Рендеринг списков в React
↗
74
74
16м
2
Закрытый
8.2
Практика работы со списками
↗
68
68
25м
3
Закрытый
8.3
ДЗ для самостоятельной работы
↗
60
60
0м
2
9. Условный рендеринг компонентов
5 уроков
👁
279
👤
279
Закрытый
9.1
Возможности условного рендеринга
↗
66
66
30м
2
Закрытый
9.2
Улучшаем компонент статистики
↗
61
61
30м
2
Закрытый
9.3
Добавляем новые компоненты из MUI
↗
56
56
15м
3
Закрытый
9.4
Используем Nivo
↗
53
53
50м
3
Закрытый
9.5
ДЗ для самостоятельной работы
↗
43
43
0м
2
10. React фрагменты
1 урок
👁
50
👤
50
Закрытый
10.1
Фрагменты - удобная группировка элементов
↗
50
50
13м
5
11. Хуки useState и useEffect
4 урока
👁
192
👤
192
Закрытый
11.1
useState и использование предыдущего значения состояния
↗
50
50
10м
3
Закрытый
11.2
useState и сложные типы данных
↗
45
45
5м
3
Закрытый
11.3
useEffect - использование зависимостей
↗
49
49
8м
3
Закрытый
11.4
ДЗ для самостоятельной работы
↗
48
48
0м
1
12. Библиотека react-router
7 уроков
👁
344
👤
344
Закрытый
12.1
Разбор типов роутинга
↗
56
56
14м
2
Закрытый
12.2
Построение базовых маршрутов приложения
↗
51
51
10м
3
Закрытый
12.3
useNavigate и useParams
↗
49
49
15м
2
Закрытый
12.4
useSearchParams
↗
48
48
8м
2
Закрытый
12.5
Советы по маршрутизации, маршрут индексной страницы, маршрут-заг
↗
47
47
6м
2
Закрытый
12.6
Применяем новые знания в приложении
↗
46
46
12м
4
Закрытый
12.7
ДЗ для самостоятельной работы
↗
47
47
0м
2
13. Процесс рендеринга в React
5 уроков
👁
210
👤
210
Закрытый
13.1
Концепции рендеринга, иммутабельность элементов, принцип объектн
↗
48
48
13м
4
Закрытый
13.2
Классовые компоненты, работа с состоянием и пропсами
↗
45
45
17м
2
Закрытый
13.3
Жизненный цикл компонента и его методы
↗
40
40
12м
2
Закрытый
13.4
setState, привязка контекста внутри классовых компонентов
↗
38
38
12м
2
Закрытый
13.5
ДЗ для самостоятельной работы
↗
39
39
0м
1
14. Управление состоянием. Redux Toolkit
7 уроков
👁
305
👤
305
Закрытый
14.1
Работа с состоянием - продвинутый уровень
↗
51
51
9м
2
Закрытый
14.2
Знакомство с Redux Toolkit
↗
47
47
18м
2
Закрытый
14.3
Редюсер и слайс
↗
47
47
8м
2
Закрытый
14.4
Глобальное состояние. useSelector и useeDispatch
↗
44
44
7м
1
Закрытый
14.5
Продолжаем применять Redux в приложении
↗
41
41
8м
1
Закрытый
14.6
Вынос всего ключевого состояния
↗
37
37
17м
1
Закрытый
14.7
ДЗ для самостоятельной работы
↗
38
38
0м
1
15. Компоненты высшего порядка - НОС
4 урока
👁
147
👤
147
Закрытый
15.1
Особенности компонентов высшего порядка
↗
41
41
8м
1
Закрытый
15.2
Расширение функционала с помощью HOC
↗
35
35
14м
1
Закрытый
15.3
Виды стилизации и ещё немного о HOC
↗
36
36
13м
1
Закрытый
15.4
ДЗ для самостоятельной работы
↗
35
35
0м
1
16. Дополнительные хуки
5 уроков
👁
175
👤
175
Закрытый
16.1
useRef и useContext
↗
41
41
24м
1
Закрытый
16.2
useMemo
↗
34
34
12м
2
Закрытый
16.3
useCallback
↗
34
34
5м
1
Закрытый
16.4
Создание пользовательских хуков
↗
32
32
10м
2
Закрытый
16.5
ДЗ для самостоятельной работы
↗
34
34
0м
1
17. Заключение
1 урок
👁
49
👤
49
Закрытый
17.1
Заключение
↗
49
49
11м
2
2. Основы вёрстки с HTML и CSS 4.167
1. GitHub, Figma, Макет
8 уроков
👁
2 100
👤
1 653
Закрытый
1.1
Знакомство с GitHub
↗
278
278
11м
7
Закрытый
1.2
Создание и клонирование репозитория
↗
208
208
4м
1
Закрытый
1.3
Изменения, commit, push
↗
185
185
9м
5
Открытый
1.4
Макет и знакомство с Figma
↗
768
321
9м
10
Закрытый
1.5
Картинки и их экспорт
↗
176
176
19м
5
Закрытый
1.6
Расширения VSCode
↗
170
170
5м
3
Закрытый
1.7
Форматы картинок, иконки. Знакомство с index.html
↗
155
155
9м
4
Закрытый
1.8
Исходники первого модуля. Домашнее задание
↗
160
160
1м
2
2. Теги и начало вёрстки макета
9 уроков
👁
1 183
👤
1 183
Закрытый
2.1
Базовые теги. Консоль devtools
↗
175
175
12м
8
Закрытый
2.2
Разновидности тегов. Табличные теги.
↗
140
140
7м
5
Закрытый
2.3
Заголовки и списки
↗
139
139
7м
2
Закрытый
2.4
Разметка блока Header
↗
131
131
20м
5
Закрытый
2.5
Разметка секций услуг. Тег section.
↗
130
130
7м
3
Закрытый
2.6
Разметка секции "Отзывы"
↗
120
120
16м
4
Закрытый
2.7
Разметка подвала (footer). Тег div.
↗
116
116
11м
6
Закрытый
2.8
Подведение итога
↗
113
113
2м
3
Закрытый
2.9
Исходники модуля и Домашнее задание
↗
119
119
0м
4
3. Знакомство с CSS
5 уроков
👁
524
👤
524
Закрытый
3.1
Введение в стили CSS
↗
118
118
22м
5
Закрытый
3.2
Практика: добавляем и применяем CSS
↗
108
108
7м
3
Закрытый
3.3
Перенос с макета ссылок и цветов
↗
104
104
30м
4
Закрытый
3.4
Перенос шрифтов
↗
94
94
23м
6
Закрытый
3.5
Исходники и Домашнее задание
↗
100
100
0м
3
4. Отступы, devtools, блочные элементы
7 уроков
👁
551
👤
551
Закрытый
4.1
Разбор ДЗ
↗
87
87
35м
5
Закрытый
4.2
Стили и devtools. Вкладки styles & computed
↗
83
83
3м
3
Закрытый
4.3
Блочные и строчные элементы
↗
80
80
4м
3
Закрытый
4.4
Padding
↗
77
77
7м
2
Закрытый
4.5
Margin
↗
76
76
23м
2
Закрытый
4.6
Практика: перенос отступов в различных блоках с макета
↗
75
75
27м
4
Закрытый
4.7
Исходники и Домашнее Задание
↗
73
73
0м
1
5. Флексбоксы
9 уроков
👁
615
👤
615
Закрытый
5.1
Разбор ДЗ - Вёрстка блока About
↗
79
79
9м
2
Закрытый
5.2
Разбор ДЗ - Блоки Clients, Advantages
↗
70
70
6м
2
Закрытый
5.3
Разбор ДЗ - Блок Footer
↗
64
64
13м
2
Закрытый
5.4
Флексбокс. Концепция и зачем применяется
↗
70
70
6м
1
Закрытый
5.5
Флексбокс. Управление по осям
↗
69
69
10м
2
Закрытый
5.6
Флексбокс. order, flex-direction, flex-wrap
↗
66
66
9м
3
Закрытый
5.7
Делаем кнопку и блок About на флексах. Часть 1
↗
66
66
12м
1
Закрытый
5.8
Делаем кнопку и блок About на флексах. Часть 2
↗
65
65
2м
1
Закрытый
5.9
Исходники и Домашнее Задание
↗
66
66
0м
3
6. Формы, группировки, селекторы
12 уроков
👁
716
👤
716
Закрытый
6.1
Разбор ДЗ Блоки services и clients
↗
65
65
7м
1
Закрытый
6.2
Разбор ДЗ - Блок Преимущества
↗
60
60
11м
3
Закрытый
6.3
Разбор ДЗ - Блок футера
↗
59
59
6м
1
Закрытый
6.4
Формы. Поля ввода и их типы
↗
61
61
8м
1
Закрытый
6.5
Формы. Checkbox, Label
↗
61
61
9м
1
Закрытый
6.6
Группировка. Fieldset, legend, radiobutton
↗
60
60
6м
3
Закрытый
6.7
Атрибуты value, checked, placeholder. Отправка формы
↗
60
60
9м
1
Закрытый
6.8
Селекторы и их вес
↗
61
61
13м
1
Закрытый
6.9
Форма с элементами ввода
↗
59
59
17м
2
Закрытый
6.10
placeholder и кнопки
↗
56
56
5м
1
Закрытый
6.11
Пояснение к ДЗ
↗
56
56
1м
1
Закрытый
6.12
Исходники и Домашнее Задание
↗
58
58
0м
1
7. Позиционирование и поведение
7 уроков
👁
371
👤
371
Закрытый
7.1
Разбор ДЗ: Оформляем popup
↗
56
56
17м
1
Закрытый
7.2
Позиционирование, position absolute
↗
55
55
9м
1
Закрытый
7.3
Псевдоэлементы. position fixed. Позиционирование popup
↗
54
54
15м
2
Закрытый
7.4
Поведение элементов. Кнопки и ссылки
↗
52
52
16м
1
Закрытый
7.5
Практика. Кнопки и ссылки.
↗
54
54
21м
3
Закрытый
7.6
Делаем поведение в блоке service
↗
50
50
10м
1
Закрытый
7.7
Исходники и Домашнее Задание
↗
50
50
0м
2
8. Завершение проекта
9 уроков
👁
490
👤
490
Закрытый
8.1
Блок About
↗
62
62
8м
2
Закрытый
8.2
Блок Clients
↗
47
47
9м
1
Закрытый
8.3
Футер
↗
49
49
10м
2
Закрытый
8.4
Ревью
↗
52
52
10м
1
Закрытый
8.5
Popup
↗
49
49
12м
3
Закрытый
8.6
Inputs
↗
53
53
9м
3
Закрытый
8.7
Radio Buttons
↗
51
51
19м
2
Закрытый
8.8
JS Popup
↗
59
59
13м
4
Закрытый
8.9
Исходники и ссылки
↗
68
68
0м
5
3. Продвинутая вёрстка с HTML, CSS, Figma 3.0
1. Git и настройка проекта
5 уроков
👁
79
👤
76
Закрытый
1.1
Консоль. Создание проекта
↗
23
23
21м
1
Закрытый
1.2
Основы работы с GitHub
↗
15
15
6м
0
Закрытый
1.3
Подключение NPM и работа с ним
↗
14
14
13м
1
Закрытый
1.4
Работа с gulp
↗
15
15
28м
0
Закрытый
1.5
Домашнее задание
↗
12
9
3м
0
2. Методологии вёрстки и семантика
3 урока
👁
51
👤
48
Открытый
2.1
Вёрстка макета с БЭМ
↗
29
29
32м
0
Закрытый
2.2
Вёрстка формы
↗
11
11
12м
0
Закрытый
2.3
Домашнее задание
↗
11
8
3м
0
3. Препроцессоры. Графика. Шрифты
7 уроков
👁
67
👤
65
Закрытый
3.1
Вёрстка элементов макета
↗
11
11
13м
0
Закрытый
3.2
Работа с препроцессорами
↗
11
11
18м
0
Закрытый
3.3
Настройка и подключение шрифтов
↗
10
10
19м
0
Закрытый
3.4
Оптимизация скрипта
↗
9
9
1м
0
Закрытый
3.5
Настройка элементов страницы
↗
9
9
22м
0
Закрытый
3.6
Оптимизация изображений
↗
8
8
14м
1
Закрытый
3.7
Тестирование
↗
9
7
0
4. Концепции вёрстки. Адаптивность
5 уроков
👁
44
👤
43
Закрытый
4.1
Настройка базовой стилизации
↗
10
10
30м
0
Закрытый
4.2
Настройка стилей footer
↗
8
8
14м
0
Закрытый
4.3
Настройка сетки блоков
↗
9
9
6м
0
Закрытый
4.4
Адаптивная вёрстка под разные типы экранов
↗
9
9
38м
0
Закрытый
4.5
Тестирование
↗
8
7
0
5. Медиа выражения
7 уроков
👁
55
👤
54
Закрытый
5.1
Вёрстка footer
↗
8
8
17м
0
Закрытый
5.2
Адаптивная вёрстка с медиа выражениями
↗
8
8
22м
0
Закрытый
5.3
Добавляем адаптивную вёрстку в проект
↗
8
8
17м
0
Закрытый
5.4
Вёрстка блока About
↗
7
7
13м
0
Закрытый
5.5
Адаптивная вёрстка блоков
↗
8
8
26м
0
Закрытый
5.6
Адаптивная вёрстка footer
↗
8
8
13м
0
Закрытый
5.7
Тестирование
↗
8
7
0
6. Относительные единицы. Резиновая вёрстка
9 уроков
👁
65
👤
64
Закрытый
6.1
Делаем Header
↗
9
9
24м
0
Закрытый
6.2
Настройка padding в Header
↗
7
7
1м
0
Закрытый
6.3
Отступы элементов в адаптивной вёрстке
↗
7
7
19м
0
Закрытый
6.4
Делаем git rebase
↗
7
7
2м
0
Закрытый
6.5
Резиновая вёрстка - введение
↗
7
7
2м
0
Закрытый
6.6
Резиновая вёрстка блоков с изображениями
↗
7
7
14м
0
Закрытый
6.7
Убираем полосы прокрутки
↗
7
7
6м
0
Закрытый
6.8
Оптимизация резиновой вёрстки
↗
7
7
3м
0
Закрытый
6.9
Тестирование
↗
7
6
0
7. Картинки адаптивные и резиновые. Спрайт. Грид
12 уроков
👁
84
👤
83
Закрытый
7.1
Оптимизируем резиновую вёрстку под маленькие экраны
↗
8
8
29м
0
Закрытый
7.2
Оптимизация резиновой вёрстки хедера под мобильную версию
↗
7
7
4м
0
Закрытый
7.3
Оптимизация резиновой вёрстки для оставшихся блоков
↗
6
6
29м
0
Закрытый
7.4
Ретинизация
↗
7
7
6м
0
Закрытый
7.5
Настройка резиновой картинки
↗
7
7
4м
0
Закрытый
7.6
Настройка отображения изображения в зависимости от размера экран
↗
7
7
3м
0
Закрытый
7.7
Знакомство с классом grid
↗
7
7
9м
0
Закрытый
7.8
Настройка ретинизации через стили css
↗
7
7
5м
0
Закрытый
7.9
Меняем картинки для ретины
↗
7
7
10м
0
Закрытый
7.10
Делаем всплывающую форму при помощи grid
↗
7
7
15м
0
Закрытый
7.11
Создаём и подключаем в проект svg-спрайты
↗
7
7
11м
0
Закрытый
7.12
Тестирование
↗
7
6
0
8. Бутстрап. Открытые формы. Слайдер
15 уроков
👁
98
👤
95
Закрытый
8.1
Разбор домашнего задания по вёрстке картинок
↗
8
8
12м
0
Закрытый
8.2
Разбор вёрстки форм
↗
7
7
19м
0
Закрытый
8.3
Разбор Bootstrap
↗
7
7
7м
0
Закрытый
8.4
Подключение Bootstrap кнопки
↗
6
6
1м
0
Закрытый
8.5
Делаем навигационную панель при помощи Bootstrap
↗
6
6
9м
0
Закрытый
8.6
Правка стилей Bootstrap
↗
6
6
1м
0
Закрытый
8.7
Делаем слайдер/карусель с использованием Bootstrap
↗
7
7
5м
0
Закрытый
8.8
Создание модального окна при помощи Bootstrap
↗
6
6
3м
0
Закрытый
8.9
Доделываем модальное окно
↗
6
6
1м
0
Закрытый
8.10
Разбор сетки Bootstrap
↗
6
6
6м
0
Закрытый
8.11
Подключение и настройка Swiper
↗
6
6
13м
0
Закрытый
8.12
Продолжаем настраивать Swiper
↗
6
6
7м
0
Закрытый
8.13
Настройка автоматизации сборки
↗
7
7
20м
0
Закрытый
8.14
Рекомендации по доработке кнопки
↗
7
7
0м
0
Закрытый
8.15
Тестирование
↗
7
4
0