Список лекций курса
Список примерный, содержание может незначительно меняться
Этап 1
Верстка
Общая информация
Вы узнаете, что такое HTML, зачем его создали, как он работает. Покажу примеры простой разметки, расскажу о синтаксисе HTML
Начало CSS
Вы узнаете, как работает CSS, как добавлять к элементам стилизацию
Блочная модель, размеры, отступы, приоритетность в CSS
Узнаете, как браузер обрабатывает размеры элементов, и как с этим работать. Расскажу, какие стили для элемента боле приоритетны, чем другие, и почему
Единицы измерения, абсолютные/относительные значения, методики именования
Расскажу, с какими значениями можно работать в CSS, и как лучше выбрать название класса для элемента
Позиционирование, обтекание, псевдоэлементы, псевдоклассы
Узнаете, какими способами можно расположить элемент на странице, как работать с обтеканием текста, как стилизовать состояния и добавлять элементы на страницу с помощью стилей
Flex, grid
Расскажу, как работать с современными инструментами компоновки элементов на странице
Адаптивность, анимации
Расскажу, как сделать так, чтобы страница адаптировалась под размер экрана, и как анимировать стили на ней
Сторонние библиотеки
Вы узнаете, какие сторонние библиотеки бывают, как и когда их использовать
Этап 2
JavaScript
Общая информация
Расскажу, как использовать JavaScript, объясню синтаксис и самые базовые конструкции: циклы, условия, функции
Объекты, массивы
Расскажу про эти типы данных. Зачем, как, где использовать
Область видимости, замыкания
Вы узнаете, где в JavaScript доступны объявленные вами переменные, и как это использовать
Подключение к странице, события, изменение, создание элементов
Узнаете, как сделать интерактивными ваши страницы: обрабатывать клики, создавать элементы, менять данные в них
Всплытие, область видимости, контекст выполнения
Расскажу, как одни функции могут работать в нескольких объектах, и чем отличаются разные способы объявления переменных и функций
Обработка ошибок, асинхронность, работаем с сетью
Вы узнаете, как поймать ошибку, как отложить выполнение кода разными способами и как выполнять сетевые запросы
Заключительные моменты
Больше о работе с деревом документа, о том, как ведут себя события, и как использовать сторонние плагины
Этап 3
Практика
Верстка по макету
Вы сверстаете полный сайт по макетам, аналогичным тем, которые встретите реальной работе. Получите ревью и комментарии на протяжении всей работы
JavaScript-плагин
Разработаете плагин, позволяющий, например, подключить к любой странице галерею или слайдер
CSS-библиотека
Напишете свою библиотеку стилей, содержащую, например, утилиты для разработки адаптивных сайтов
Этап 4
Углубленная верстка
Git
Вы освоите работу с системами управления версиями, узнаете, как реализована одновременная работа нескольких персон над одним проектом
Сборщики
Расскажу, какие инструменты помогут организовывать код удобнее и собирать его в один файл для браузера
SASS, LESS, шаблонизаторы
Расскажу про инструменты, расширяющие возможности CSS, и про шаблонизаторы, позволяющие упростить верстку
Оптимизация скорости и доступности
Расскажу, с помощью каких инструментов вы сможете проанализировать качество и доступность страниц, и что с этим делать
Кроссбраузерность
Вы узнаете, как сделать так, чтобы ваша верстка отображалась корректно даже в старых браузерах
Публикация сайта
Расскажу, что дальше делать с вашей версткой: как получить домен, хостинг, собрать это все и запустить
Этап 5
Углубленный JavaScript
Модули
Вы научитесь более удобно подключать к проектам сторонние библиотеки, разделять код на модули, собирать все для публикации
Бэкенд на JavaScript
Опциональная лекция. Расскажу, как организовать работу с запросами на сервере, написать API
Работа с сетью в реальном времени
Вы научитесь общаться с сервером в реальном времени, получать от него уведомления, обновления данных
Бэкенд 2 – авторизация
Расскажу о методах авторизации для ваших проектов
Многопоточность
Расскажу, как заставить однопоточный JavaScript работать в нескольких потоках, и зачем это нужно
ООП в JavaScript
Расскажу о том, что такое ООП, зачем это нужно, и как это организовано в JavaScript
Юнит-тесты
Вы узнаете, как писать тесты для вашего кода, и зачем они нужны
Инструменты для улучшения качества кода
Расскажу, какие инструменты помогут вам организовать код вашего проекта, сделать его чище и проще в поддержке
Сложность алгоритмов
Покажу, как определить, какой алгоритм будет работать быстрее, не проверяя его, и как сделать вашу программу оптимальнее
Этап 6
React
Вводная лекция
Расскажу, что такое React, и какие проблемы он решает. Покажу, как написать ваш первый компонент
Данные в компонентах, хуки
Узнаете, как компоненты обмениваются информацией, что делают useState, useCallback и useMemo, и как их использовать
useEffect
Расскажу, как правильно применять хук useEffect, какие есть подводные камни, и какие возможности он нам дает
Стилизация в React
Вы узнаете, какие существуют способы стилизовать ваше React-приложение, какие у них плюсы и минусы
Оптимизация
Расскажу, за чем стоит следить для того, чтобы ваше приложение работало быстро
Юнит-тесты
Расскажу, как тестировать React-компоненты
Управление состоянием приложения
Узнаете, какие инструменты помогут организовать приложение из множества компонентов и не накопить в нем проблемных мест
Роутинг
Как сделать так, чтобы React понимал, что /profile и /news – это страницы одного и того же приложения, и они открывались без обновления страницы
Компоненты в виде классов
Расскажу о способе описания компонентов, который использовался раньше, чтобы вы могли работать с ними, если столкнетесь
Этап 7
Практика React
Разработка React-приложения
Вы разработаете полноценное веб-приложение на React, содержащее несколько экранов, работающее с бэкендом по сети (например, онлайн-чат или мини-соцсеть). Вся работа будет проходить ревью.
Made on
Tilda