Мониторов много не бывает?
Какую операционку лучше использовать для разработки?
Как сделать на одном компе Windows + LINUX + MAC OS
Профессиональное ПО или “мне хватит стандартного блокнота”
Сервер на хостинге или локальная разработка рулит
25
Профессия "Верстальщик"
3 полноценных курса в одном - стань профессионалом в web-разработке
3
Месяца
48
Аудиторных часов
32
Онлайн уроков
О курсе
Предлагаем Вашему вниманию комплект курсов "Профессия Верстальщик". В него входят:
Курс по основам языка HTML, курс по основам JavaScript и курс
по продвинутой вёрстке.
После прохождения трёх этих курсов Вы сможете уверенно верстать проекты средней сложности, заказы на которые чаще всего размещают на фриланс-биржах.
Также освоенный материал станет хорошей базой для дальнейшего развития в сфере в веб-разработки.
Кому полезен курс
Новичкам
Если Вы уже давно горите желанием научиться создавать сайты, хотите понять как устроен процесс веб-разработки.
Контент-менеджерам
Устали просто наполнять сайты контентом, хотите разобраться в вёрстке и оформлении веб-страниц на уровне кода? Этот цикл курсов для Вас.
Верстальщикам
Если Вам уже знакомы азы таких технологий как HTML, CSS, JS, но хотелось бы узнать о профессиональной веб-разработке.
Знающим JS
Хорошо знаете JavaScript, но плохо представляете где и как его можно использовать в веб-разработке.
Программы курса
- Продвинутая верстка
- Базовый курс HTML и CSS
- JavaScript для верстальщиков
Рабочее окружение верстальщика
Десктоп или Ноутбук? А может, всё-таки планшет?
PHPSTORM / WEBSTORM
Знакомство с гигантами IDE – PhpStorm / WebStorm
Настройка PhpStorm под себя – ускоряем, убираем лишнее
Изучение поистине огромные возможности IDE – PhpStorm
Интегрирование проекта в PhpStorm
Локальная разработка в PhpStorm
Удаленная разработка в PhpStorm
Готовим Photoshop и макет по-взрослому
Анализ макета и всего, что к нему прилагается
Плагины, сервисы и программы для ускорения разбора макета для вёрстки
Настройка и проверка цветовых пространств для web
Продвинутая выгрузка и подготовка медиа-материалов из макета
Интегрирование макета в браузер (ориентируемся на pixel perfect)
Node.js - NPM
Node.js как лучший друг верстальщика
Пакетные менеджеры – что это и с чем это есть?
NPM – установка, настройка, применение
BOWER - YARN
Bower – установка, настройка, применение
Yarn – установка, настройка, применение
Системы сборки и автоматизации. Часть 1
Gulp и NPM scripts – два подхода автоматизации работы
NPM scripts – автоматизация для любителей CLI
Gulp – автоматизация работы для простых смертных
Система сборки – как собрать свой шаблон для будущих проектов
Популярные NPM модули – ещё большее упрощение работы
Системы сборки и автоматизации. Часть 2
Gulp и NPM scripts – два подхода автоматизации работы
NPM scripts – автоматизация для любителей CLI
Gulp – автоматизация работы для простых смертных
Система сборки – как собрать свой шаблон для будущих проектов
Популярные NPM модули – ещё большее упрощение работы
BrowserSync – глобальная синхронизация
Знакомство с компонентом BrowserSync
Использование BrowserSync в режиме CLI
Использование BrowserSync в режиме интеграции с Gulp
Синхронизирование вёрстки на разных устройствах
Кроссбраузерность – умеренность и здравая логика
HTML-элементы
Теги оформления текста
Заголовки и их грамотное использование
Работа с формами
Новые теги HTML5
Семантические теги
Прокачка CSS
Контекстные, дочерние, соседние селекторы
Приоритеты применения стилей
Псевдоэлементы и псевдоклассы
Популярные свойства стилей с примерами
Создание базовой разметки
Виды макетов: фиксированный, резиновый, адаптивный
Сброс стилей
Использование обтеканий на практике
Создание первого реального макета
Позиционирование элементов: обычное, абсолютное, относительное и фиксированное
Хитрости блочной модели
Базовые принципы блочной модели в вёрстке
Схема расчёта размера элементов
Свойство box-sizing для управление схемой расчёта
Разница работы свойств margin для строчных и блочных элементов
Тонкости багов внешних вертикальных отступов
Расчёт высоты элементов при обтеканиях
Способы выравнивания элементов по вертикали
Разбор ошибок
Какие основные ошибки допускаются при верстке
Разбор допущенных неточностей в верстке студентов
Ответы на наболевшие вопросы :)
Адаптивная вёрстка
Взаимодействие дизайнера и верстальщика
Базовые приёмы: viewport, width и max-width, px и %
Создание media-запросов
Единица измерения rem
LESS
Способы подключения LESS
Вложенные селекторы
Переменные, встроенные функции и примеси
Хитрости применения для создания адаптивной вёрстки
Кроссбраузерность и будущее
Уровень поддержки старых браузеров
Подключение доп. файлов для IE vs отказ от IE
Flexbox-революция
Структура работы JS
Подключение скрипта к HTML-документу
Основы работы с DOM элементами
Необходимость понимания основ программирования
Переменные
Ветвления
Функции в базовом варианте
Основы программирования 1
Функции
Область видимости переменных
Оператор возврата
Циклы. Виды и назначение
Основы программирования 2
Массивы
Многомерные массивы
Объекты
Связанная работа базовых конструкций
Обобщение: переменные, ветвления, функции, циклы, массивы
Понимание Javascript
Структура DOM документа
Объекты: свойства, методы, события
Отложенная загрузка страницы
Основные свойства объектов DOM
Способы выборки элементов
Обработка событий
Javascript на практике
Обработка событий: мышь, клавиатура
Отмена действий по умолчанию
Пример создания ЧАВО
Пример создания слайдера фотографий
jQuery. Часть 1
Смысл использования библиотек
Селекторы и фильтры
Основные функции для работы с элементами
Простейшая обработка событий
Пример ЧАВО с анимациями
jQuery. Часть 2
Обработка событий
Функция анимации. Параллельное выполнение анимации
Цепочки из анимаций. Коллбеки
Создание и обработка собственных событий
Подключение расширений JQuery
Обобщение
Необходимый уровень знаний JavaScript для верстальщика
Место JavaScript в адаптивной вёрстке
Направления дальнейшего развития
Как проходит обучение
Закрытая группа
Вы подключаетесь к закрытой группе, где появляется вся информация по курсу: расписание,
ссылки на трансляцию, записи и материалы. Вы обсуждаете урок и ДЗ с преподавателем и
одногруппниками.
Уроки-вебинары
Урок проходит в формате вебинара.
Вы смотрите трансляцию, задаете вопросы,
болтаете на задней парте :)
Все записи урока обязательно выкладываются,
Вы можете пересмотреть записи, если пропустили урок
или нужно повторить тему.
Практика
Курс построен так, чтобы вы научились
самостоятельно работать с MODX и развиваться как веб-мастер.
Преподаватель показывает то, что реально
необходимо в проектах, учит работе с инструметами.
Сертификат
После успешного прохождения курса вы получаете сертификат с индивидуальным номером. С
помощью этого номера можно в любой момент проверить подлинность сертификата через
специальную форму.
Преподаватели курса
Дмитрий Лаврик
Профессиональный веб-разработчик
Программист, каким-то чудом не потерявший умение объяснять материал на человеческом языке. С 2011 года под его руководством тысячи учеников прошли путь от новичков до успешных веб-программистов.
Глеб Чубаренко
Профессиональный веб-разработчик
Профессиональный веб-мастер. Эксперт в области HTML, CSS, PHP, Wordpress и Drupal.
Семен Кудрявцев
Профессиональный веб-разработчик
Профессиональный верстальщик, веб-мастер.
Что получите после прохождения курса
Часто задаваемые вопросы
Эти курсы могут быть Вам интересны
-
-
-
JavaScript для верстальщиковБазовое изучение JavaScript для создания интерактивных веб-страниц13 00015 000