Программа курса "Frontend developer (Фронтенд разработчик)".

Основы интернет-технологий, введение в язык разметки HTML (структура документа)

  • Обзор знаний, которыми должен владеть front end developer (фронтенд разработчик)
  • Что такое тег, атрибуты тега, правила оформления HTML документа
  • Разметка текста, заголовков и абзацев
  • Виды и применение гиперссылок
  • Создание таблиц и списков ( нумерованных и маркированных)
  • Графика в HTML. Форматы изображений, используемые в WEB-е, использование спецсимволов
  • Формы и их элементы (кнопки, поля ввода, переключатели и др.)

Оформление внешнего вида сайта. Каскадные таблицы стилей (CSS)

  • Синтаксис CSS
  • Основные селекторы и свойства
  • Приоритет правил, псевдоэлементы и псевдоклассы
  • Единиц измерения в CSS
  • Работа с текстом (+ шрифты)

Фотошоп и предподготовка

  • Базовые инструменты фотошопа необходимые для специальности front end developer (фронтенд разработчик)
  • Анализ макета = структура сайта
  • Раскрой макета (что и как сохранять?)
  • Цифровая информация с макета (где брать данные для пиксель перфект вёрстки?)

Современные методы и способы Front end HTML5 + CSS3

  • Шаблон/каркас/структура сайта
  • Теги HTML5 и их применение
  • Многоуровневые меню
  • Атрибуты для форм
  • Применение валидатора
  • Проблема «кроссбраузерности» грамотная, универсальная вёрстка
  • Табы и аккордеоны без JS
  • Медиа контент (аудио и видео)
  • Генерируемое содержимое (создание содержимого на стороне стилей)
  • Адаптация сайта под моб. устройства
  • Canvas

Инструменты front end разработчика

  • Emmet
  • Bootstrap 3 / 4
  • Атрибуты для форм
  • Pug (препроцессор HTML)
  • Less / Sass (препроцессоры CSS)

Web программирование на языке JavaScript (в рамках курса front end developer)

  • Библиотека jQuery
  • Изучаем селекторы для работы с DOM
  • Вводим понятие коллекции и фильтров
  • Манипулируем CSS свойствами
  • вывод на страницу
  • поиск и исправление ошибок в коде 
  • События, обработка событий
  • Получение объекта события
  • Всплытия и перехват
  • Действия браузера по умолчанию
  • Выделения. Делегирование событий
  • События мыши и клавиатуры
  • Drag’n’drop
  • События форм
  • Примитивные типы данных, переменные, операторы
  • Основные алгоритмы: сравнение, циклы
  • Методы и функции
  • Деление задач на подзадачи 
  • Особенности объявления функций
  • Области видимости переменных
  • Параметры функций
  • Классы и объекты (переходим от простых типов данных к массивам, строкам, изучаем объекты и особенности работы с ними)
  • Документ и объекты страниц
  • Создаем и модифицируем элементы на странице
  • Работаем со структурой HTML
  • Пишем калькулятор
  • Таймеры (работаем с таймерами, запускаем и останавливаем таймеры)
  • Делаем анимацию на странице. Управляем анимацией
  • Пишем слайдер 
  • Координаты (прокрутка вверх и паралакс)
  • Валидация форм (формы и регулярные выражения)

Размещение сайта в Интернете

  • Что такое хостинг и доменное имя
  • Загружаем сайт на хостинг. Работаем с FTP-сервером
  • Сборка проекта (загрузка содержимого файла в DOM)
  • AJAX (Учимся получать и обрабатывать данные со стороны сервера. Обработка ответа сервера, работа с JSON)

Web-программирование на языке PHP (базовые знания необходимые для front end developer высокого уровня)

  • Обработка POST и GET запросов
  • Отправка писем
  • Работа с cookie на странице
  • Вывод в консоль
  • Работа с сессия на сайте
  • сборка проекта по модели MVC 

Основы работы с CMS (на примере Wordpress)

  • Основы работы с CMS системами
  • Установка Wordpress (на примере бесплатного хостинга)
  • Создание простого сайта на Wordpress
  • Подключение и настройка модулей

 

Стоимость:
Наличные: 8400 грн./курс
Безналичные: +5%

  • Группы, чел.: 4-6
  • Длительность: 32 занятия (64 часа), два занятия в неделю.
  • Дата начала: см. расписание или уточняйте у администратора.