5 октября, Одесса — Курс «Front-End. Основы»
Ёмкий доброжелательный курс по основам веб-верстки для полных новичков. Терпеливо, с самых азов.
В современной веб-разработке многое изменилось буквально за несколько лет. Изменились технологии, процессы и подходы.
Дизайнер сайтов больше не может делать вид, что html его не касается. Ведь итоговый результат веб-проекта — работающий сайт, а не набор файлов .jpeg.
Хотя бы базово и поверхностно, каждый веб-специалист должен знать технологию — если не хочет стать динозавром и окаменеть при первом похолодании.
Мы создали очень базовый короткий курс, который поможет сделать первые шаги в веб-программировании и уверенно освоить элементарные частицы.
А потом принять решение, куда развиваться дальше: нырять во front-end и разбираться в нем глубоко или ограничиться базовым набором для создания качественных веб-интерфейсов.
Кто ведет:
опытный фрилансер и аутсорсер, а также специалист в front-end разработке и UX.
www.facebook.com/dmitriu.gelfer
Кому будет полезно:
—Новичкам, которые хотят сделать в веб-разработке первые шаги и сверстать первые приличные странички.
—Дизайнерам сайтов, которые понимают, что больше нельзя не уметь верстать (или хотя бы не знать основ) и делать вид, что все в порядке.
Для прохождения курса вам обязательно понадобится собственный ноутбук.
Программа курса
Программа рассчитана на практическое освоение инструмента: все темы проходим «руками» и закрепляем домашними работами.
Основы языка HTML
Основные понятия, терминология и синтаксис. Пару слов о браузерах. Назначение DOCTYPE и его форматы. Кодировка документа. Мета теги. Базовые теги. Ссылки. Рисунки. Списки. Таблицы. Специальные символы. Атрибуты. Пути.
________________________________________
Основы CSS
Преимущество стилей. Синтаксис CSS. Понятие селектор. Виды селекторов. Понятие приоритетности селектора. Основные единицы измерения. Наследование. Работа с веб инспектором. Цвета, фон, спрайты.
________________________________________
Свободное перемещение и позиционирование
Блочная модель. Поток элементов. Позиционирование элементов разметки: нормальное, относительное, абсолютное, фиксированное. Собираем пазл.
________________________________________
Блочная верстка
Понятия блочная верстка. Слои. Колоночные макеты. Хаки и шаманство. Clearfix. Overflow. Разрабатываем простой лендинг.
________________________________________
Закрепление материала
Работаем с селекторами. Применяем на практике псевдо-классы та псевдо-элементы. Разработка выпадающего меню. Пишем код быстрее. Дополнительные плагины.
________________________________________
Практикум
Подготовка макета для верстки. Верстаем отдельные блоки страницы. Собираем полноценную веб-станицу. Разработка страниц новостного портала.
________________________________________
HTML5
Кроссбраузерность. Новые теги. Семантика. Вставка видео и аудио. Адаптивная верстка.
________________________________________
CSS3
Верстаем без вырезки элементов дизайна. Градиенты. Тени. Анимации. Трансформации
________________________________________
Автоматизация рутинной работы
Как верстать быстрее чем рисуется дизайн.
________________________________________
Работа с пре- и пост- процессорами
Работа с пре- и пост- процессорами. Разбор методологий верстки. Проблемы разработки больших проектов.
________________________________________
Системы контроля
Работа с системами контроля версия. Командная разработка большого проекта
________________________________________
Работа с фреймворками
Разбор фреймворков, практика работы с фреймворком bootstrap
________________________________________
Введение в JavaScript
Разработка сложных динамических елементов, введение в JavaScript
________________________________________
Рендеринг
Рендеринг WEB-страницы, тестирование рендера динамического элемента в консоли браузера, работа с производительностью.
________________________________________
Что дальше
Расширение горизонтов, зоны личностного развития студентов курса во фронд-энде. Высокая планка. Новые трюки. Специфика рынка. Будущее отрасли.
Больше информации и запись в группу: prjctr.com.ua/...
Группа в Facebook : www.facebook.com/ProjectorOdessa
