Профессия
Full Stack разработчик
Записывайтесь, и за 12 месяцев вы станете востребованным IT-специалистом
со знанием топовых технологий 2022 года и 11 крутыми проектами в портфолио.
25.07.2022 - 23.07.2023
Что ожидать от обучения?
- Знания и навыкиВсе необходимые знания для разработчика.
- Портфолио11 впечатляющих современных и технологичных проектов в вашем портфолио.
- СертификатС оценкой, отражающей уровень ваших знаний и степень отдачи.
- ТрудоустройствоМы гарантируем трудоустройство всем хорошистам и отличникам.
Чему Вы научитесь за 12 месяцев
1
HTML и CSS
Вы освоите лучшие практики и инструменты (Flexbox, БЭМ-нейминг, SASS), а с помощью них научитесь верстать макеты любой сложности.
2
Адаптивная вёрстка
Выпускники LoftSchool умеют заставить вёрстку работать так, как этого требует современный мир, в котором всё больше пользователей сидят в интернете через мобильные устройства.
3
JavaScript
У вас в руках будет вся «база»: переменные, функции, объекты и массивы, обработка ошибок и отладка.
4
React.js и Vue.js
Вы изучите самые востребованные инструменты для создания современных веб-интерфейсов и научитесь создавать функциональные и сложные SPA приложения.
5
Node.js
JavaScript используется и как серверный язык разработки. Вы научитесь разрабатывать серверную часть для приложений любой сложности и начнете выходить за пределы браузера.
8
PHP
В завершении курса разберемся, как работает серверная сторона проекта. Вы научитесь получать, обрабатывать и сохранять данные от клиента.
Тяни влево
Программа обучения
Период обучения: 25.07.2022 - 23.07.2023
Материалы
для подготовки
для подготовки
курсJavaScript
курсVue.js
Программа включает в себя:
Программа включает:
- 7 больших семинаров с преподавателями
- 42 групповые практики с наставником
- Обратную связь по проекту от практикующего специалиста
- 98 видеокурсов
- 11 больших выпускных проектов
- Самые краткие сроки. Через 12 месяцев студент, успешно окончивший обучение, начинает карьеру. Мы делаем всё, чтобы помочь в этом
Общение в Telegram-канале с одногруппниками и командой курса
Почему стоит выбрать LoftSchool
Привет! Расскажу о том, чем мы отличаемся от других.
Ковальчук Дмитрий, основатель Loftschool.
1
Безупречная репутация
Мы в деле с 2012 года. Сегодня Loftschool занимает первое место в рейтинге площадок дополнительного образования в ИТ по результатам исследования "Мой круг", Хабр.
2
Ламповая атмосфера
Никаких скучных и занудных “дядек“, как в других школах. В Loftschool вас будут учить в атмосфере rock-and-roll.
3
Самые краткие сроки
Через 2,5 месяца студент, успешно окончивший обучение, начинает карьеру. Мы делаем всё, чтобы помочь в этом.
4
Крутой наставник
У нас самые строгие требования к работе наставников среди всех конкурентов. Вам будет помогать ментор – практикующий специалист из топовой IT-компании.
Цена повысится
сегодня позже
сегодня позже
Период обучения: 25.07.2022 - 23.07.2023
Преподаватели
Наставники Loft – практикующие эксперты в IT отрасли
- Дают знания, а не ответы.
- Любят объяснять и умеют доносить сложную информацию понятным языком.
- Требовательны к качеству вашего кода: вы не сдадите ДЗ, пока ваш код не станет идеальным.
- Хорошо понимают других людей и умеют находить подход к любым ученикам.
- Всегда готовы прийти на помощь.
Даже если ничего не понятно, вы не останетесь один на один со своими проблемами. Наставник всегда будет рядом и не даст вам опустить руки.

Ольга. Наставник Loftschool
90 000
Full Stack разработчик
Средняя зарплата по России
- Вы окупите затраты на обучение за 2 - 2,5 месяца работы.
- Согласно нашему анализу, это реальная средняя зарплата по России. При этом вы должны понимать, что в Москве, Санкт-Петербурге и других городах-миллионниках она может быть выше (иногда в 2 – 3 раза).
Программа обучения
- Основы вёрстки сайтовПрограмма обучения
- Неделя 1 — Работа с хостингом, HTML— Знакомимся со своим личным наставником и группой. — Учимся работать с панелью хостинга и с файлами через FTP. — Делаем разметку для первой страницы проекта. — Размещаем результат работы в сети Интернет и сдаём на проверку наставнику.
- Открытие курсаОткрытие курса25.07.2022 20:00РазвернутьСвернуть— Введение в курс. — Знакомство с командой. — Организационные вопросы.
- VSCode. Обзор редактораМодуль13 уроков (39:55)РазвернутьСвернуть
- 1. Введение (00:49)Бесплатный урок
- 2. Страница проекта (00:49)Бесплатный урок
- 3. Краткий обзор редактора (01:23)Бесплатный урок
- 4. Начало работы. Цветовые схемы (02:22)
- 5. Горячие клавиши (01:53)
- 6. Командная панель (02:56)
- 7. Настройки (04:19)
- 8. Навигация по коду (06:52)
- 9. Настройка горячих клавиш (02:20)
- 10. Сниппеты (05:00)
- 11. Панель поиска (01:53)
- 12. Расширения (06:30)
- 13. Расширение CSS Peek (02:49)
- Устройство интернетаМодуль1 урок (31:46)РазвернутьСвернуть
- 1. Устройство интернета (31:46)
- Работа с GitHub PagesМодуль2 урока (21:52)РазвернутьСвернуть
- 1. GitHub Pages. Работа из браузера (05:24)
- 2. Работа с хостингом timeweb (16:28)
- HTMLМодуль23 урока (01:45:27)РазвернутьСвернуть
- 1. Введение (06:08)Бесплатный урок
- 2. Первая веб-страница (01:05)Бесплатный урок
- 3. Структура документа (01:28)Бесплатный урок
- 4. Голова документа (02:59)Бесплатный урок
- 5. Полезные расширения редактора (07:04)Бесплатный урок
- 6. Разметка текста (03:57)Бесплатный урок
- 7. Правила написания кода (03:13)
- 8. Списки (01:06)
- 9. Потомки и родители (02:41)
- 10. Форматирование кода (05:30)
- 11. Атрибуты (02:54)
- 12. Абсолютные и относительные пути (07:56)
- 13. Ссылки (06:29)
- 14. id и class (05:36)
- 15. Якорь (02:23)
- 16. Формы. Основные элементы (12:33)
- 17. Тег Label (01:18)
- 18. Формы. Специфические элементы (04:13)
- 19. Отправка формы на сервер (05:13)
- 20. Валидация (03:51)
- 21. Теги таблиц (05:47)
- 22. Emmet (07:23)
- 23. Панель разработчика (04:40)
- БЭМ. Разметка элементов страницыВоркшоп5 уроков (33:58)РазвернутьСвернуть
- 1. Принцип разметки (04:40)
- 2. Использование классов (04:36)
- 3. BEM (05:46)
- 4. Разметка страницы (07:36)
- 5. Разметка содержимого (11:20)
- Неделя 2 — CSS, работа с макетом, Perfect Pixel— Стилизуем элементы главной страницы. — Изучаем свойства позиционирования и поведение блочной модели.
- Figma для верстальщикаМодуль2 урока (06:09)РазвернутьСвернуть
- 1. Figma. Интерфейс (04:37)
- 2. Figma. Организация проектов (01:32)
- CSS. Работа со стилямиМодуль10 уроков (51:49)РазвернутьСвернуть
- 1. Теория (06:59)Бесплатный урок
- 2. Подключение стилей (03:25)Бесплатный урок
- 3. Работа с цветом (05:06)Бесплатный урок
- 4. Селекторы тегов и атрибутов (05:29)
- 5. Мультиселекторы (05:32)
- 6. Универсальные селекторы (03:21)
- 7. Приоритет селекторов (06:30)
- 8. Псевдоклассы (07:32)
- 9. Псевдоклассы порядка (05:36)
- 10. Псевдоэлементы (02:19)
- Работа со шрифтамиМодуль6 уроков (28:55)РазвернутьСвернуть
- 1. Безопасные шрифты (02:13)Бесплатный урок
- 2. Бесплатные шрифты (03:02)
- 3. Конвертирование шрифтов (06:19)
- 4. font-face (08:05)
- 5. Наследуемые свойства (03:51)
- 6. Общие стили текста (05:25)
- Блочная модельМодуль11 уроков (45:31)РазвернутьСвернуть
- 1. Теория (03:59)Бесплатный урок
- 2. Строчное и блочное поведение (03:49)Бесплатный урок
- 3. Свойство display (01:18)Бесплатный урок
- 4. Блочная модель (05:11)
- 5. Составные свойства (02:59)
- 6. Единицы измерения (03:38)
- 7. Выравнивание inline-block (01:15)
- 8. Свойства позиционирования (05:36)
- 9. Приоритет отображения (04:07)
- 10. Верстка. Как делать не нужно (05:07)
- 11. Perfect Pixel (08:32)
- Стилизация проектаВоркшоп14 уроков (01:27:19)РазвернутьСвернуть
- 1. Приветственная секция (06:08)
- 2. Настройка шрифтов (03:42)
- 3. Приветственная секция. Стилизация (13:14)
- 4. Приветственная секция. Perfect Pixel (07:22)
- 5. Активный пункт меню (03:38)
- 6. Секция предложений. Разметка (03:06)
- 7. Секция предложений. Стилизация (08:44)
- 8. Секция предложений. Модификаторы (06:16)
- 9. Секция предложений. Perfect Pixel (02:45)
- 10. Секция новостей. Разметка (06:04)
- 11. Переключатель страниц (05:45)
- 12. Секция о банке. Разметка (08:35)
- 13. Футер (07:58)
- 14. Завершение работы (04:02)
- Неделя 3 — Flexbox, БЭМ-нейминг— Изучаем свойства флексбокса и применяем их к главной странице. — Пишем разметку для оставшихся страниц проекта. — Приводим верстку в состояние Perfect Pixel.
- Вопрос-ответВебинар08.08.2022 20:00РазвернутьСвернуть— Практический вебинар с преподавателем.
- FlexboxМодуль13 уроков (26:26)РазвернутьСвернуть
- 1. Введение (00:45)Бесплатный урок
- 2. Флекс-контейнер (01:43)Бесплатный урок
- 3. Выравнивание по главной оси (01:37)Бесплатный урок
- 4. Выравнивание по поперечной оси (01:50)
- 5. Выравнивание отдельного элемента (01:09)
- 6. Флекс-элемент – контейнер (00:53)
- 7. Направление осей (03:18)
- 8. Многострочный контейнер (02:54)
- 9. Выравнивание многострочного контента (01:25)
- 10. Пропорции (02:46)
- 11. Пропорции при сжатии (01:24)
- 12. Базовый размер (04:02)
- 13. Порядок элементов (02:40)
- Построение лейаута и БЭМ-неймингМодуль11 уроков (01:25:31)РазвернутьСвернуть
- 1. Введение (03:28)Бесплатный урок
- 2. Viewport (04:54)Бесплатный урок
- 3. Normalize (02:38)Бесплатный урок
- 4. Блок обертка (04:20)
- 5. Контейнер (09:17)
- 6. Футер (04:25)
- 7. Структура файлов (17:20)
- 8. Поведение блочной модели (07:19)
- 9. Общие стили (09:04)
- 10. Текстовое содержимое (08:36)
- 11. Классы-модификаторы (14:10)
- Flexbox. Реализация проектаВоркшоп11 уроков (01:07:50)РазвернутьСвернуть
- 1. Приветственная секция (08:28)
- 2. Секция предложений (02:15)
- 3. Секция предложений. Примеси (05:21)
- 4. Секция предложений. Элементы (02:51)
- 5. Секция новости (03:19)
- 6. Завершение верстки страницы (07:46)
- 7. Страница услуг. Хедер (11:45)
- 8. Страница услуг. Секция (08:45)
- 9. Страница услуг. Ховер (04:08)
- 10. Страница услуг. Секция партнеры (09:17)
- 11. Страница услуг. Футер (03:55)
- Неделя 4 — CSS-анимации— Подключаем иконки к проекту с применением спрайтов. — Реализуем динамические элементы страниц. — Дорабатываем проект.
- Частые приемы версткиМодуль15 уроков (01:16:15)РазвернутьСвернуть
- 1. Центрирование (06:56)Бесплатный урок
- 2. Текст в одну строку (04:13)Бесплатный урок
- 3. Фигуры. Круг (01:14)Бесплатный урок
- 4. Фигуры. Эллипс (03:36)
- 5. Фигуры. Треугольник (03:19)
- 6. Фигуры. Треугольник без заливки (06:08)
- 7. Фигуры. Трапеция (01:00)
- 8. Фигуры. Параллелограмм (01:29)
- 9. Фигуры. Элементы (05:56)
- 10. Градиент (07:43)
- 11. Пунктирная линия (04:32)
- 12. Фон в полоску (01:19)
- 13. Выпадающее меню (09:43)
- 14. Спрайты (12:01)
- 15. Элементы форм (07:06)
- Анимации CSSМодуль16 уроков (50:27)РазвернутьСвернуть
- 1. Свойство transition (02:58)Бесплатный урок
- 2. Свойство transition-property (02:21)Бесплатный урок
- 3. Временная функция (04:50)Бесплатный урок
- 4. Эластичные анимации (00:46)
- 5. Свойство transition delay (01:22)
- 6. Составное свойство transition (02:05)
- 7. Неочевидные моменты transition (02:50)
- 8. Свойство transform (05:12)
- 9. Отмена трансформации (01:50)
- 10. Изменение координат трансформации (03:41)
- 11. Свойство animation (07:23)
- 12. Свойство animation-iteration-count (00:57)
- 13. Свойство animation-direction (01:58)
- 14. Свойство animation-fill-mode (02:44)
- 15. Свойство animation-play-state (03:13)
- 16. Анимация секвенцией (06:17)
- Анимации. Реализация проектаВоркшоп10 уроков (45:14)РазвернутьСвернуть
- 1. Отзывы. Разметка (04:31)
- 2. Отзывы. Стилизация (06:12)
- 3. Отзывы. Сетка (02:32)
- 4. Секция-разделитель (03:00)
- 5. Форма. Поля (03:35)
- 6. Форма. Контроллы (09:18)
- 7. Приветственная страница (03:35)
- 8. Анимации. Банк (06:29)
- 9. Анимации. Путешествия (03:24)
- 10. Анимации. Видеопродакшн (02:38)
- Неделя 5 — Защита выпускного проекта— Дорабатываем проект. — Сдаём проект на проверку наставникам. — Выставление оценок в дипломы.
- Вопрос-ответВебинар22.08.2022 20:00РазвернутьСвернуть— Практический вебинар с преподавателем.
- Веб-разработка для начинающихПрограмма обучения
- Неделя 1 — Git и GitHub, SASS, разметка страницы— Верстаем заданные секции из дизайн-макета. — Формируем структуру CSS, организуем входной файл стилей с применением SCSS. — Размещаем работу в репозитории и на GitHub Pages.
- Открытие курсаОткрытие курса1 урок (01:05:23)РазвернутьСвернуть
- 1. Как проходит обучение (01:05:23)
- Вводное занятиеМодуль1 урок (06:53)РазвернутьСвернуть
- 1. Вводное занятие (06:53)
- Figma для верстальщикаМодуль2 урока (06:09)РазвернутьСвернуть
- 1. Figma. Интерфейс (04:37)
- 2. Figma. Организация проектов (01:32)
- SASSМодуль9 уроков (44:30)РазвернутьСвернуть
- 1. Теория (07:05)
- 2. Компиляция (03:46)
- 3. Вложенность (nesting) (05:34)
- 4. Арифметические операции (operators) (00:54)
- 5. Переменные (variables) (08:16)
- 6. Примеси (mixins) (04:51)
- 7. Условия (conditions) (04:34)
- 8. Наследование (inheritance) (01:50)
- 9. Циклы (loops) (07:40)
- БЭМ. Разметка элементов страницыМодуль5 уроков (33:58)РазвернутьСвернуть
- 1. Принцип разметки (04:40)
- 2. Использование классов (04:36)
- 3. BEM (05:46)
- 4. Разметка страницы (07:36)
- 5. Разметка содержимого (11:20)
- FlexboxМодуль13 уроков (26:26)РазвернутьСвернуть
- 1. Введение (00:45)Бесплатный урок
- 2. Флекс-контейнер (01:43)Бесплатный урок
- 3. Выравнивание по главной оси (01:37)Бесплатный урок
- 4. Выравнивание по поперечной оси (01:50)
- 5. Выравнивание отдельного элемента (01:09)
- 6. Флекс-элемент – контейнер (00:53)
- 7. Направление осей (03:18)
- 8. Многострочный контейнер (02:54)
- 9. Выравнивание многострочного контента (01:25)
- 10. Пропорции (02:46)
- 11. Пропорции при сжатии (01:24)
- 12. Базовый размер (04:02)
- 13. Порядок элементов (02:40)
- TerminalМодуль13 уроков (48:59)РазвернутьСвернуть
- 1. Введение. Установка (05:45)Бесплатный урок
- 2. Hello World (01:21)Бесплатный урок
- 3. Навигация (07:26)Бесплатный урок
- 4. Текущая директория (00:27)
- 5. Создание папок (03:03)
- 6. Создание файлов (01:55)
- 7. Удаление файлов (01:53)
- 8. Копирование. Перемещение. Переименование (03:29)
- 9. Исправление опечаток (01:35)
- 10. Поиск. Документация (03:04)
- 11. Обзор редактора Vim (12:35)
- 12. Обзор редактора Nano (04:38)
- 13. Экранирование (01:48)
- GITМодуль12 уроков (01:28:36)РазвернутьСвернуть
- 1. Введение (07:03)Бесплатный урок
- 2. Начинаем работать с Git (03:01)Бесплатный урок
- 3. Создание нового репозитория (01:09)Бесплатный урок
- 4. Добавление файлов в индекс (область слежения) Git (06:49)Бесплатный урок
- 5. Создание коммита (07:17)
- 6. Навигация по коммитам. Отмена изменений (12:10)
- 7. Типичный цикл работы с Git (03:34)
- 8. Ветвления в Git (11:27)
- 9. Конфликты при слиянии веток (06:06)
- 10. Временное (без коммита) сохранение данных (05:25)
- 11. Работа с удалёнными репозиториями (20:04)
- 12. Использование GitHub Pages для хостинга проектов (04:31)
- CHOCCO. РазметкаВоркшоп11 уроков (01:18:19)РазвернутьСвернуть
- 1. Секция Hero. Разметка (06:41)
- 2. Секция Hero. Стилизация (13:34)
- 3. Секция Hero. PP (05:11)
- 4. Секция Почему. Разметка (04:47)
- 5. Секция Почему. Стилизация (06:40)
- 6. Секция Почему. Декор (07:48)
- 7. Секция Отзывов. Верстка (09:16)
- 8. Секция Отзывов. Декор (02:09)
- 9. Форма. Поля (11:34)
- 10. Форма. Кнопки (04:09)
- 11. Фиксированное меню (06:30)
- Неделя 2 — SVG, адаптивная и мобильная вёрстка— Подготавливаем элементы для последующего программирования на JavaScript. — Делаем адаптив. — Собираем SVG иконки в спрайт.
- Адаптивная вёрсткаМодуль14 уроков (01:29:18)РазвернутьСвернуть
- 1. Теория (15:35)Бесплатный урок
- 2. Типы лейаута (04:16)Бесплатный урок
- 3. Пиксели и проценты (05:41)Бесплатный урок
- 4. Em и rem (04:00)
- 5. Viewport units (06:08)
- 6. Медиазапросы (09:55)
- 7. Mobile First (04:54)
- 8. Печатные документы (02:43)
- 9. Применение на практике (13:36)
- 10. Viewport (02:34)
- 11. Ретина Теория (03:36)
- 12. Ретина. Медиазапрос (02:14)
- 13. Ретина. Суть оптимизации (06:10)
- 14. Srcset (07:56)
- SVGМодуль17 уроков (58:05)РазвернутьСвернуть
- 1. Теория (10:47)Бесплатный урок
- 2. Элемент SVG (01:15)Бесплатный урок
- 3. Прямоугольник (02:28)
- 4. Общие свойства (01:29)
- 5. Окружность (00:49)
- 6. Эллипс (01:01)
- 7. Линия (00:52)
- 8. Многоугольник и полилиния (01:48)
- 9. Знакомство с Path (04:50)
- 10. ViewBox (06:21)
- 11. Группировка (06:45)
- 12. Фильтры (04:55)
- 13. Градиенты (03:35)
- 14. Текст и градиент (01:48)
- 15. Свойства CSS (01:55)
- 16. Добавление на страницу (01:18)
- 17. SVG-спрайт (06:09)
- CHOCCO. Адаптивная версткаВоркшоп10 уроков (43:51)РазвернутьСвернуть
- 1. Настройка лейаута (09:07)
- 2. Hero (07:27)
- 3. Hero. Гамбургер меню (03:50)
- 4. Основное меню (02:57)
- 5. Perfect Pixel (02:12)
- 6. Секция Отзывов (01:36)
- 7. Форма (01:31)
- 8. Hero. Версия под телефоны (02:32)
- 9. Остальные секции (07:05)
- 10. Mobile vs Desktop first (05:34)
- Неделя 3 — JavaScript, работа с DOM— Выполняем задачи по JavaScript. — Верстаем слайдер. — Делаем верстку меню и обеспечиваем его функциональность.
- Основы JavaScriptМодуль14 уроков (02:16:17)РазвернутьСвернуть
- 1. Введение (08:20)Бесплатный урок
- 2. Типы данных (06:17)Бесплатный урок
- 3. Оператор If (06:53)Бесплатный урок
- 4. Оператор For (06:34)
- 5. Функции (09:37)
- 6. Область видимости и замыкания (12:34)
- 7. Всплытие (11:10)
- 8. Типы объявления функций (07:42)
- 9. Стрелочные функции (16:05)
- 10. Let (05:41)
- 11. Const (03:53)
- 12. Объекты (13:17)
- 13. Массивы (24:18)
- 14. Заключение (03:56)
- Работа с DOMМодуль5 уроков (01:28:46)РазвернутьСвернуть
- 1. Введение (21:22)
- 2. События (09:42)
- 3. Обработка ввода (27:44)
- 4. Работа с формами (19:54)
- 5. Рабочий пример (10:04)
- Обработка ошибок и отладкаМодуль4 урока (01:23:18)РазвернутьСвернуть
- 1. Инструменты браузера (19:29)
- 2. Обработка ошибок (36:12)
- 3. Стек вызовов (15:10)
- 4. Отладка (12:27)
- JavaScript. ЗадачиВоркшоп16 уроков (01:19:27)РазвернутьСвернуть
- 1. Запуск кода (02:40)
- 2. Фильтрация строки (07:19)
- 3. Выборка объекта (04:09)
- 4. Анализ строки (04:31)
- 5. Фильтрация массива (04:04)
- 6. Слайдер. Механика работы (03:01)
- 7. Слайдер. Реализация (08:10)
- 8. Слайдер. Динамические переменные (08:08)
- 9. Слайдер. Перенос элементов (04:31)
- 10. Модальное окно. Генерация разметки. ч1 (02:14)
- 11. Модальное окно. Генерация разметки. ч2 (04:41)
- 12. Модальное окно. Закрытие (05:08)
- 13. Модальное окно. Функция для создания (02:25)
- 14. Модальное окно. Шаблоны (04:51)
- 15. Создание блоков (04:52)
- 16. Закрашивание блоков (08:43)
- Неделя 4 — Обработка ошибок, работа с формами, Ajax— Создаём виджеты на странице: аккордеон, слайдер, модальное окно. — Реализуем работу формы заказа. — Обеспечить обработку ответа от сервера в форме заказа.
- Вопрос-ответВебинар15.08.2022 20:00РазвернутьСвернуть— Практический вебинар с преподавателем.
- jQuery. Работа с библиотекойМодуль28 уроков (01:25:05)РазвернутьСвернуть
- 1. Теория jQuery (07:28)Бесплатный урок
- 2. Подключение библиотеки (04:27)Бесплатный урок
- 3. Документация (01:32)Бесплатный урок
- 4. Проверка версии (01:01)
- 5. Селектор (01:24)
- 6. Document Ready (01:46)
- 7. Обработка событий (02:32)
- 8. Свойства элемента (04:22)
- 9. Размеры элемента (02:29)
- 10. Работа с классами (03:09)
- 11. Работа с формами (03:19)
- 12. Работа со стилями (01:50)
- 13. Свойства для коллекции (01:46)
- 14. This в событиях (03:21)
- 15. Управление коллекцией (04:39)
- 16. Навигация: родители и потомки (02:35)
- 17. Навигация: соседи (03:12)
- 18. Перебор коллекции (02:23)
- 19. Фильтрация набора (03:55)
- 20. Контекст (00:57)
- 21. Добавление элементов (02:53)
- 22. Удаление и клонирование элементов (01:18)
- 23. Делегирование событий (01:49)
- 24. Готовые анимации (05:43)
- 25. Собственные анимации (01:37)
- 26. Очередь анимаций (04:00)
- 27. События страницы (05:49)
- 28. Отложенный обработчик (03:49)
- Работа с формами. AjaxМодуль5 уроков (01:19:41)РазвернутьСвернуть
- 1. Асинхронные сетевые запросы (15:52)Бесплатный урок
- 2. JSON (13:05)
- 3. Работа с формами (19:15)
- 4. Валидация данных (22:42)
- 5. Отправка данных на сервер (08:47)
- CHOCCO. ВиджетыВоркшоп8 уроков (49:59)РазвернутьСвернуть
- 1. Слайдшоу (07:07)
- 2. Вертикальный аккордеон. Верстка (05:19)
- 3. Вертикальный аккордеон. Реализация (07:26)
- 4. Слайдер (10:32)
- 5. Форма. Вызов модального окна (04:09)
- 6. Форма. Отправка запроса (04:32)
- 7. Форма. Валидация (04:41)
- 8. Форма. Обработка ответа (06:13)
- Неделя 5 — Плагины, Workflow, работа с API— Подключаем интерактивную карту google / yandex. — Реализуем OnePageScroll. — Разделяем структуру проекта на Dev и Prod. — Реализуем видео-плеер при помощи HTML5 Video API.
- NPMМодуль11 уроков (35:05)РазвернутьСвернуть
- 1. Что такое npm? (05:50)Бесплатный урок
- 2. Установка и обновление npm (02:33)Бесплатный урок
- 3. Справка по работе с npm (01:28)Бесплатный урок
- 4. Поиск и установка пакетов (04:24)
- 5. Зависимости пакета (02:09)
- 6. Файл манифест package.json (03:02)
- 7. Удаление и обновление пакетов (03:02)
- 8. dependencies и devDependencies (01:51)
- 9. Webpack и npx (04:04)
- 10. npm-скрипты (04:02)
- 11. npm, git и github (02:40)
- GulpМодуль25 уроков (01:42:55)РазвернутьСвернуть
- 1. Теория (06:52)Бесплатный урок
- 2. Установка (02:54)Бесплатный урок
- 3. Первый таск (03:54)Бесплатный урок
- 4. Обработка нескольких файлов (03:53)
- 5. Добавляем плагин (04:42)
- 6. Серия тасков (03:46)
- 7. Task Default (01:45)
- 8. Компилируем Sass (03:56)
- 9. Склейка файлов (04:02)
- 10. Слежка за файлами (02:41)
- 11. Dev-server (08:11)
- 12. Внешний адрес browser-sync (01:58)
- 13. Продвинутый импорт стилей (02:07)
- 14. Автопрефиксы (05:27)
- 15. Пересчет единиц измерения (01:41)
- 16. Группировка медиа-запросов (02:29)
- 17. Минификация (02:14)
- 18. Sourcemaps (04:53)
- 19. Сборка JavaScript (05:28)
- 20. Трансляция ES6 (02:54)
- 21. Минификация JavaScript (06:02)
- 22. Генерация SVG-спрайта (05:41)
- 23. Разделение конфига (04:05)
- 24. Параллельные таски (01:48)
- 25. Dev vs Prod (09:32)
- YouTube Iframe APIМодуль6 уроков (27:53)РазвернутьСвернуть
- 1. Подготовка (01:37)Бесплатный урок
- 2. Инициализация (06:59)
- 3. Запуск и остановка (03:06)
- 4. Продолжительность видео (05:26)
- 5. Ползунок (06:10)
- 6. Завершение работы (04:35)
- Подключение Яндекс.КартыМодуль1 урок (08:49)РазвернутьСвернуть
- 1. Подключение Яндекс.Карты (08:49)
- CHOCCO. Интерактивные элементыВоркшоп15 уроков (01:03:23)РазвернутьСвернуть
- 1. Горизонтальное меню. Верстка (02:11)
- 2. Горизонтальное меню. Открытие элемента (03:13)
- 3. Горизонтальное меню. Закрытие элементов (05:10)
- 4. Горизонтальное меню. Мобильная версия (04:39)
- 5. Горизонтальное меню. Текст (04:24)
- 6. OPS. Подготовка (02:32)
- 7. OPS. Обработка скролла (01:41)
- 8. OPS. Функция сдвига (01:53)
- 9. OPS. Смена секций (05:07)
- 10. OPS. Исправление ошибок (03:38)
- 11. OPS. Управление с клавиатуры (03:00)
- 12. OPS. Навигация по ссылкам (03:25)
- 13. OPS. Боковое меню (03:01)
- 14. OPS. Рефакторинг (11:54)
- 15. OPS. Мобильная версия (07:35)
- Неделя 6 — Выпускной— Работа над проектом. — Бонусный вебинар по основам PHP. — Выдача дипломов за курс.
- Основы PHPМодуль5 уроков (55:59)РазвернутьСвернуть
- 1. Введение (02:12)
- 2. Клиент-серверное взаимодействие (09:24)
- 3. Протокол HTTP (07:40)
- 4. Основы PHP (21:23)
- 5. Обработка формы на PHP (15:20)
- Комплексное обучение JavaScriptПрограмма обучения
- Неделя 1 — Основы JavaScript, переменные и функции— Знакомимся со своим личным наставником и группой. — Узнаём как работает JavaScript и что такое переменные и функции.
- ВведениеОткрытие курса1 урок (08:36)РазвернутьСвернуть
- 1. Открытие курса (08:36)
- GITМодуль12 уроков (01:28:36)РазвернутьСвернуть
- 1. Введение (07:03)Бесплатный урок
- 2. Начинаем работать с Git (03:01)Бесплатный урок
- 3. Создание нового репозитория (01:09)Бесплатный урок
- 4. Добавление файлов в индекс (область слежения) Git (06:49)Бесплатный урок
- 5. Создание коммита (07:17)
- 6. Навигация по коммитам. Отмена изменений (12:10)
- 7. Типичный цикл работы с Git (03:34)
- 8. Ветвления в Git (11:27)
- 9. Конфликты при слиянии веток (06:06)
- 10. Временное (без коммита) сохранение данных (05:25)
- 11. Работа с удалёнными репозиториями (20:04)
- 12. Использование GitHub Pages для хостинга проектов (04:31)
- Как работает JavaScriptМодуль1 урок (24:08)РазвернутьСвернуть
- 1. Основы JS (24:08)
- Переменные и функцииМодуль8 уроков (01:11:23)РазвернутьСвернуть
- 1. Переменные (03:03)Бесплатный урок
- 2. Функции (09:38)Бесплатный урок
- 3. Область видимости и замыкание (12:35)
- 4. Всплытие/hoisting (11:10)
- 5. Типы объявления функций (07:42)
- 6. Стрелочные функции (16:05)
- 7. Let (05:42)
- 8. Const (05:28)
- Разбор заданий #1Воркшоп1 урок (15:39)РазвернутьСвернуть
- 1. Домашнее задание №1 (15:39)
- Неделя 2 — Объекты и массивы, обработка ошибок— Разбираем базовые операции с объектами и массивами, изучаем деструктуризацию и spread-оператор. — Изучаем динамические свойства массивов, учимся создавать proxy. — Разбираем инструменты разработчика, изучаем принципы обработки исключений.
- Объекты и массивыМодуль9 уроков (02:09:16)РазвернутьСвернуть
- 1. Строковая интерполяция (06:54)Бесплатный урок
- 2. Объекты (13:01)Бесплатный урок
- 3. Массивы (24:20)
- 4. Деструктурирующее присваивание: Массивы (24:01)
- 5. Деструктурирующее присваивание: Объекты (07:30)
- 6. Spread-оператор (05:57)
- 7. Rest-оператор (11:07)
- 8. Цикл for-of (06:55)
- 9. Symbol. Продвинутая тема (29:31)
- Обработка ошибок и отладкаМодуль4 урока (01:23:23)РазвернутьСвернуть
- 1. Инструменты браузера (19:33)
- 2. Обработка ошибок (36:14)
- 3. Стек вызовов (15:14)
- 4. Отладка (12:22)
- Разбор заданий #2Воркшоп2 урока (24:55)РазвернутьСвернуть
- 1. Домашнее задание №2 (12:30)
- 2. Домашнее задание №3 (12:25)
- Неделя 3 — DOM, асинхронность— Учимся создавать, выбирать и модифицировать элементы DOM, изучаем механизм DOM-событий. — Рассматриваем, что такое обработчик событий, делегирование. — Изучаем асинхронность в JS, разбираем Promise, Async/await.
- DOMМодуль6 уроков (01:53:53)РазвернутьСвернуть
- 1. Введение (21:25)
- 2. Cобытия (09:42)Бесплатный урок
- 3. Обработка ввода (27:44)
- 4. Работа с формами (19:54)
- 5. Рабочий пример (09:34)
- 6. Обход DOM-дерева (25:34)
- АсинхронностьМодуль3 урока (01:45:10)РазвернутьСвернуть
- 1. Таймеры (24:03)
- 2. Promise (01:03:47)
- 3. Async Await (17:20)
- Разбор заданий #3Воркшоп2 урока (34:33)РазвернутьСвернуть
- 1. Домашнее задание №4 (19:22)
- 2. Домашнее задание №5 (15:11)
- Вопрос-ответВебинар20.08.2022 12:00РазвернутьСвернуть— Практический вебинар с преподавателем.
- Неделя 4 — Работа с сетью, Browser API— Рассматриваем работу с сетью на примере WebSocket, ServiceWorks. — Изучаем Local/Session Storage, HTML 5 Drag and Drop. — Рассматриваем принцип взаимодействия между окнами и iframe.
- Работа с сетьюМодуль5 уроков (01:16:50)РазвернутьСвернуть
- 1. Асинхронные сетевые запросы (17:34)Бесплатный урок
- 2. JSON (13:09)
- 3. Fetch (19:26)
- 4. WebSocket (11:22)
- 5. Service Worker (15:19)
- Browser APIМодуль5 уроков (01:24:19)РазвернутьСвернуть
- 1. LocalStorage (25:29)
- 2. Cookies (18:39)
- 3. Навигация hash (12:05)
- 4. Навигация history (11:02)
- 5. File API (17:04)
- Разбор заданий #4Воркшоп2 урока (40:20)РазвернутьСвернуть
- 1. Домашнее задание №6 (21:24)
- 2. Домашнее задание №7 (18:56)
- Неделя 5 — Работа с VK API, ООП— Изучаем документацию по работе с VK API. Рассматриваем шаблонизацию. — Рассматриваем основы ООП в JavaScript. Изучаем полиморфизм, наследование, инкапсуляцию, конструкторы и классы.
- Работа с VK API и шаблонизацияМодуль2 урока (01:06:25)РазвернутьСвернуть
- 1. Шаблонизация (29:20)
- 2. VK SDK (37:05)
- ООПМодуль6 уроков (02:39:32)РазвернутьСвернуть
- 1. Intro (01:33)Бесплатный урок
- 2. Инкапсуляция (17:33)
- 3. Наследование (15:24)
- 4. Полиморфизм (07:17)
- 5. Классы (11:35)
- 6. Особенности работы с объектами в JavaScript (открытый вебинар "[J]u[S]t prototype this!") (01:46:10)
- Разбор заданий #5Воркшоп5 уроков (44:27)РазвернутьСвернуть
- 1. Геоотзыв — Intro (02:21)
- 2. Геоотзыв — Часть 1 (06:40)
- 3. Геоотзыв — Часть 2 (06:56)
- 4. Геоотзыв — Часть 3 (15:41)
- 5. Геоотзыв — Часть 4 (12:49)
- Неделя 6 — MV*, модули— Изучаем шаблоны проектирования MVС и MVVM. — Рассматривается перевод проекта на модули, изучаются ES6 модули.
- MV*Модуль3 урока (01:02:43)РазвернутьСвернуть
- 1. Паттерны MV (07:06)Бесплатный урок
- 2. MVC (30:14)
- 3. MVVM (25:23)
- МодулиМодуль3 урока (49:52)РазвернутьСвернуть
- 1. Модульность в JS (26:35)
- 2. Перевод проекта на модули (12:28)
- 3. ES6-модули (10:49)
- Разбор заданий #6Воркшоп4 урока (01:03:24)РазвернутьСвернуть
- 1. CHAT — INTRO (05:01)
- 2. CHAT (Часть — 1) (12:23)
- 3. CHAT (Часть — 2) (28:00)
- 4. CHAT (Часть — 3) (18:00)
- Вопрос-ответВебинар10.09.2022 12:00РазвернутьСвернуть— Практический вебинар с преподавателем.
- Неделя 7 — Node.js, тестирование— Знакомимся с Node.js. Рассматриваем работу с файлами и сетью. — Определяемся с необходимостью тестирования JS-кода. — Знакомимся с библиотеками для тестирования.
- Node.js (краткое знакомство)Модуль1 урок (37:10)РазвернутьСвернуть
- 1. Node.js (краткое знакомство) (37:10)
- Тестирование JS-кодаМодуль4 урока (50:55)РазвернутьСвернуть
- 1. Введение (16:05)
- 2. Jest (15:47)
- 3. Польза тестов (09:01)
- 4. Coverage (10:02)
- Разбор заданий #7Воркшоп5 уроков (48:45)РазвернутьСвернуть
- 1. Другофильтр. Intro (02:47)
- 2. Другофильтр. Часть I (19:49)
- 3. Другофильтр. Часть II (16:34)
- 4. Другофильтр. Часть III (03:56)
- 5. Другофильтр. Часть IV (05:39)
- Как получить работу в IT: фишки и советыМодуль9 уроков (05:39:05)РазвернутьСвернуть
- 1. Как получить работу в IT? Поиск, собеседование и испытательный срок (42:21)Бесплатный урок
- 2. Как найти удаленную работу и фриланс-заказы? (20:12)Бесплатный урок
- 3. Первая работа в IT — как себя вести? Стажировки, официальное трудоустройство и работа "за еду" (14:11)
- 4. Как пройти испытательный срок? (27:10)
- 5. Как подготовиться к собеседованию в компании уровня FAANG (08:52)
- 6. Процесс загрузки web страницы (25:19)
- 7. Собеседование программиста – всё, что нужно знать (01:24:07)
- 8. Решение задачи с собеседования программиста (19:36)
- 9. Собеседование Frontend-разработчика (01:37:17)
- Vue.js Продвинутая веб-разработкаПрограмма обучения
- Неделя 1 — Workflow— Знакомимся с наставником и группой. — При помощи webpack-сборки верстаем выбранный макет выпускного проекта. — Размещаем результат на Github и сдаём на проверку наставнику.
- Открытие курсаОткрытие курса1 урок (01:05:23)РазвернутьСвернуть
- 1. Как проходит обучение (01:05:23)
- Vue. Основные возможностиМодуль24 урока (01:42:43)РазвернутьСвернуть
- 1. Теория (04:49)Бесплатный урок
- 2. Hello World (06:20)Бесплатный урок
- 3. Обработка событий (02:38)Бесплатный урок
- 4. Обработка нескольких событий (01:19)
- 5. Динамические значения (01:30)
- 6. Знакомство с директивами (05:40)
- 7. Сокращенные записи директив (00:37)
- 8. Методы с параметрами (01:36)
- 9. Модификаторы событий (08:52)
- 10. Вычисляемые свойства (10:50)
- 11. Вотчеры (06:02)
- 12. Работа с классами (03:37)
- 13. Работа с CSS свойствами (02:49)
- 14. Обращение к DOM элементам (03:50)
- 15. Условный рендеринг (04:46)
- 16. Рендеринг списков (05:12)
- 17. Создание компонента (04:16)
- 18. Локальные компоненты (02:44)
- 19. Реактивность данных (04:35)
- 20. Свойства компонента (03:52)
- 21. Слоты (04:37)
- 22. Слоты с областью видимости (04:52)
- 23. Пользовательские события (04:27)
- 24. Телепорты (02:53)
- Vue. Однофайловые компонентыМодуль11 уроков (55:27)РазвернутьСвернуть
- 1. Установка проекта. VUE-CLI (09:22)Бесплатный урок
- 2. Однофайловый компонент (03:18)Бесплатный урок
- 3. Работа со стилями (07:02)
- 4. Передача атрибутов и обработчиков (02:53)
- 5. Отдельные файлы (01:26)
- 6. Валидация свойств компонента (07:35)
- 7. Валидация пользовательских событий (02:01)
- 8. Двусторонняя связь данных (04:11)
- 9. Пользовательский v-model (05:51)
- 10. Хуки жизненного цикла (07:08)
- 11. Примеси (04:40)
- NPMМодуль11 уроков (35:05)РазвернутьСвернуть
- 1. Что такое npm? (05:50)Бесплатный урок
- 2. Установка и обновление npm (02:33)Бесплатный урок
- 3. Справка по работе с npm (01:28)Бесплатный урок
- 4. Поиск и установка пакетов (04:24)
- 5. Зависимости пакета (02:09)
- 6. Файл манифест package.json (03:02)
- 7. Удаление и обновление пакетов (03:02)
- 8. dependencies и devDependencies (01:51)
- 9. Webpack и npx (04:04)
- 10. npm-скрипты (04:02)
- 11. npm, git и github (02:40)
- YarnМодуль1 урок (07:07)РазвернутьСвернуть
- 1. Yarn (07:07)
- Webpack. Основы работыМодуль11 уроков (35:56)РазвернутьСвернуть
- 1. Теория (01:09)
- 2. Минимальный конфиг и запуск (04:41)
- 3. Именование файлов (02:34)
- 4. Лоадеры (04:28)
- 5. Dev-server (02:43)
- 6. Плагины (02:34)
- 7. Поиск модулей (03:18)
- 8. Сорсмапы (03:17)
- 9. Дев и прод (02:42)
- 10. Типы модулей (03:00)
- 11. Минимальная сборка (05:30)
- ESLint. Обзор конфигурацииМодуль5 уроков (12:53)РазвернутьСвернуть
- 1. Введение (01:26)Бесплатный урок
- 2. Установка и запуск (03:10)
- 3. Исправление ошибок (02:04)
- 4. Конфигурация (05:21)
- 5. Формат вывода (00:52)
- Figma для верстальщикаМодуль2 урока (06:09)РазвернутьСвернуть
- 1. Figma. Интерфейс (04:37)
- 2. Figma. Организация проектов (01:32)
- FlexboxМодуль13 уроков (26:26)РазвернутьСвернуть
- 1. Введение (00:45)Бесплатный урок
- 2. Флекс-контейнер (01:43)Бесплатный урок
- 3. Выравнивание по главной оси (01:37)Бесплатный урок
- 4. Выравнивание по поперечной оси (01:50)
- 5. Выравнивание отдельного элемента (01:09)
- 6. Флекс-элемент – контейнер (00:53)
- 7. Направление осей (03:18)
- 8. Многострочный контейнер (02:54)
- 9. Выравнивание многострочного контента (01:25)
- 10. Пропорции (02:46)
- 11. Пропорции при сжатии (01:24)
- 12. Базовый размер (04:02)
- 13. Порядок элементов (02:40)
- GITМодуль12 уроков (01:28:36)РазвернутьСвернуть
- 1. Введение (07:03)Бесплатный урок
- 2. Начинаем работать с Git (03:01)Бесплатный урок
- 3. Создание нового репозитория (01:09)Бесплатный урок
- 4. Добавление файлов в индекс (область слежения) Git (06:49)Бесплатный урок
- 5. Создание коммита (07:17)
- 6. Навигация по коммитам. Отмена изменений (12:10)
- 7. Типичный цикл работы с Git (03:34)
- 8. Ветвления в Git (11:27)
- 9. Конфликты при слиянии веток (06:06)
- 10. Временное (без коммита) сохранение данных (05:25)
- 11. Работа с удалёнными репозиториями (20:04)
- 12. Использование GitHub Pages для хостинга проектов (04:31)
- Vue 3. Воркшоп #1Воркшоп5 уроков (20:58)РазвернутьСвернуть
- 1. Старт проекта (05:24)
- 2. Компонент хедера (04:13)
- 3. Компонент иконок (05:06)
- 4. Вывод списка компонентов (02:56)
- 5. Компонент toggler (03:19)
- Неделя 2 — Vue.js— Делаем верстку адаптивной. — Реализуем блок "Скиллы" на Vue.js. — Реализуем блок "Мои проекты" на Vue.js. — Реализуем блок "Слайдер для отзывов" с помощью Vue.js плагина.
- StorybookМодуль14 уроков (40:11)РазвернутьСвернуть
- 1. Установка (01:56)Бесплатный урок
- 2. Первая история (04:35)Бесплатный урок
- 3. Подключение компонента (01:24)
- 4. Расширение конфига (04:26)
- 5. Общие стили (02:08)
- 6. Стори для компонента (05:23)
- 7. CDD (04:16)
- 8. Создание компонента (02:28)
- 9. Применение компонента (02:29)
- 10. Логирование событий (03:29)
- 11. Аддон Backgrounds (01:41)
- 12. Аддон Knobs (02:28)
- 13. Аддон Source (02:17)
- 14. Заключение (01:11)
- JavaScript — ES6Модуль5 уроков (01:11:59)РазвернутьСвернуть
- 1. Строковая интерполяция (07:39)Бесплатный урок
- 2. Упрощение описания методов (13:35)
- 3. Значения по умолчанию (30:08)
- 4. Деструктурирующее присваивание: Объекты (07:30)
- 5. Новые возможности и старые браузеры (13:07)
- Асинхронность в JavaScriptМодуль4 урока (01:55:02)РазвернутьСвернуть
- 1. Таймеры (23:44)
- 2. Загрузка картинок (22:21)
- 3. Промисы (36:29)
- 4. AJAX (32:28)
- Axios. Библиотека для запросовМодуль8 уроков (18:28)РазвернутьСвернуть
- 1. Введение (02:23)
- 2. Отправляем запрос (02:12)
- 3. Обзор конфигурации (04:30)