Frontender[1.0] - Модуль 1 | Курс по FRONTEND | HTML, CSS, SCSS, GIT, NPM, SEO, A11Y | УРОКИ [2-55]
Привет!📢
▶ Первый урок (видео):
▶ Плейлист 1 модуля Frontender[1.0]:
▶ Telegram:
▶ GitHub:
▶ Linkedin:
Frontender[1.0] - Модуль 1 | Курс по FRONTEND | HTML, CSS, SCSS, GIT, NPM, SEO, A11Y | УРОКИ [2-55]
Курс подойдет для новичков и для людей, которые что-то когда-то учили или учат, также тех кто хочет освежить знания. На курс трачу очень много времени, чтобы контент получался качественный, плюс качественная картинка и звук, а самое главное стараюсь рассказывать всё простым языком.
К каждому уроку также есть PDF файл по теме урока, который можете скачать у меня в телеграм-канале под анонсом данного урока.
Ваша обратная связь обязательна =)
Курс Frontender[1.0] разделен на 3 модуля:
1) HTML, CSS, SCSS, БЭМ, Flexbox, Grid, Bootstrap, GIT, FIGMA, верстка 3 макетов (100 уроков);
2) JavaScript, решение задач, написание нескольких приложений;
3) React, Typescript, Redux написание полноценного приложения;
▶ Таймлайн ▶
00:00 Frontend [2]
04:56 Что делать если застрял? [3]
08:50 CV (Резюме) План, советы, пример [4]
13:20 IDE понятие [5]
16:04 GIT понятие [6]
18:37 Как работает интернет [7]
24:27 Как работают веб-сайты [8]
30:58 Этапы создания веб приложения [9]
32:59 Виды сайтов [10]
36:59 Настройка и выбор IDE и браузера [11]
50:45 Знакомство с HTML, первый код [12]
01:02:10 DevTools - Панель разработчика [13]
01:08:22 Полезные ссылки PDF [14]
01:09:01 Погружение в HTML [15]
01:34:22 Атрибуты в HTML [16]
01:44:38 Семантика, семантические теги HTML [17]
02:04:16 Стилизация элементов, инлайновые [18]
02:11:04 Селекторы HTML CSS [19]
02:17:22 Приоритеты селекторов [20]
02:23:42 Что такое CSS, Каскадность, внешние стили [21]
02:27:43 Таблицы HTML, CSS [22]
02:37:56 Формы HTML, CSS [23]
03:02:18 CV page. Первая полноценная страница [24]
03:57:52 Валидация HTML документа (cv page) [25]
04:09:19 GIT аккаунт, обзор, коммиты [26]
04:21:12 Загрузка сайта в интернет Github pages, сброс кеша [27]
04:27:43 Figma Сервис для дизайна UI UX. Обзор, макеты, инструменты [28]
04:42:23 Readme названия файлов markdown [29]
04:50:06 Размеры элементов HTML CSS [30]
05:18:53 Отступы, Margin, padding, box-sizing, margin collapsing [31]
05:30:11 Блочная модель. Box model [32]
05:36:13 Цвет и тень, HEX format, RGBA, box-shadow [33]
05:52:11 СSS переменные. Обнуление стилей [34]
06:07:39 СSS DARK Mode. ИЗМЕНЕНИЕ ТЕМЫ [35]
06:18:46 МЕДИА ЗАПРОСЫ. Адаптивная страница [36]
06:32:40 IMG PICTURE В HTML. Адаптивные изображения [37-1]
06:58:14 BACKGROUND В CSS. Адаптивные изображения [37-2]
07:08:35 УСКОРЯЕМ ЗАГРУЗКУ САЙТА. Преобразование изображений [38]
07:16:39 Favicon - Иконка Страницы. Адаптивный фавикон [39]
07:28:48 Шрифты - внешние и локальные [40]
07:46:34 ПСЕВДОКЛАССЫ И ПСЕВДОЭЛЕМЕНТЫ. After, Before, Focus, Hover [41]
08:04:38 CSS overflow. Управление переполнением [42]
08:10:26 МОДЕЛИ ПОЗИЦИОНИРОВАНИЯ. Table, Float, Flex, Grid [43]
08:22:03 CSS POSITION. Relative, Absolute, Fixed, Sticky [44]
08:36:53 FLOAT LEFT & RIGHT (Опционально) [45]
08:45:16 CONTAINER & WRAPPER Классы [46]
08:53:04 FLEXBOX - Теория [47]
09:17:05 FLEXBOX - Практика [48]
09:42:41 Трансформация и анимация [49]
10:09:24 3D АНИМАЦИЯ В CSS - Фотокарточки [50]
10:23:50 CSS ФУНКЦИИ. Сalc() max() min() clamp() [51]
10:38:48 Accessibility (a11y) - Доступность [52]
11:09:19 SVG - ВЕКТОРНАЯ ГРАФИКА. Создание SVG [53]
11:36:30 SVG - ВЕКТОРНАЯ ГРАФИКА. Спрайты [54]
11:50:38 Pixel Perfect подход [55]
НЕ СОМНЕВАЙТЕСЬ И РАЗВИВАЙТЕСЬ! У ВАС ВСЁ ПОЛУЧИТСЯ! :)
🔥 Желаю приятного обучения! 🔥
▶ Графический дизайн и анимация:
📢 ПЛЕЙЛИСТ FRONTENDER[1.0] - 1 Модуль:
Также тебе могут быть полезны эти уроки:
📢 HTML для начинающих за 33 минуты:
📢 CSS для начинающих + практика за 24 минуты:
📢 FLEXBOX. Всё о flexbox в одном уроке:
📢 FLEXBOX. Всё о flexbox | Практика:
FRONTENDER[1.0] полный, структурированный и бесплатный курс по фронтенд разработке на Youtube.
📢 Автор курса: Дмитрий Колотильщиков
#html #frontend #frontender