Основы
WEB-разработки

— Знакомство, что такое сайты. Знакомимся с html, тегами верхнего уровня

— Форматирование текста, текстовые теги

— Семантические теги (header, footer, main, ul ol li strong em i b)

— Создаём новостную страницу сайта

— Основы таблиц (теги создания таблиц, рядов, ячеек)

— Первое знакомство с CSS (цвет фона и текста, селектор тега, свойства семейства font)

— Закрепление: прайс-лист для сайта

— Селекторы, группировка, вложенность

— Основы блочной верстки (свойство display, строчные и блочные элементы, их свойства и особенности)

— Границы и отступы

— Закрепление: сайт-визитка с применением блочной верстки

— Основы создания форм (создание формы, поля ввода, флажки, кнопки)

— Расширенные возможности форм (теги textarea, select и option, button, label)

— Фоновые картинки (теги div и span, добавление картинки в фон)

— Закрепление: редизайн сайта-визитки с добавлением фоновых изображений и форм обратной связи

— Псевдоклассы и псевдоэлементы

— Трансформации элементов

— Сложные селекторы (селекторы атрибутов, data атрибуты, дополнительные комбинаторы, применение невалидного HTML)

— Переменные в CSS

— Знакомство с анимациями, создание простой 2-кадровой анимации

— Сложные анимации, многокадровая анимация

— Анимация светящегося текста

— Создание анимированной галереи

— Знакомство с flexbox

— Расширенные возможности flexbox

— Создание шапки сайта и анимированной галереи интернет-магазина

— Создание секции анимированных карточек товаров и подвала сайта

— Отзывчивая вёрстка

— Адаптивная вёрстка

— Позиционирование

— Публикация сайта на хостинге

— Первый скрипт (тег script, функции alert, prompt, confirm)

— Работа с консолью

— Переменные и типы данных

— Закрепление: простой калькулятор

— Конструкция if-else

— Else, if и сложные условия

— Конструкция switch-case

— Закрепление: текстовый квест про рыцаря на модальных окнах

— Цикл while

— Цикл for

— Инструкции break и continue

— Закрепление: текстовая логическая игра на модальных окнах, найти кролика среди других зверей в амбаре

— Знакомство с функциями

— Знакомство с массивами

— Методы массивов

— Закрепление: игра в крестики-нолики на модальных окнах

— Получение DOM элементов

— Изменение CSS свойств в JS

— Создание DOM элементов, работа с таймерами

— Закрепление: игра «‎Фрут ниндзя‎»

— Знакомство с Canvas

— Трансформации и прозрачность

— Canvas анимация

— Закрепление: новогодний лендинг с анимацией

— Знакомство с JQuery

— События и селекторы JQuery

— Анимации JQuery

— Закрепление: веб-приложение «Список дел‎»‎

— Объекты и конструкторы объектов

— Классы

— Наследование

— Закрепление: веб-приложение для расчета зарплат сотрудников