Курс JavaScript/DOM/интерфейсы

В первую очередь этот курс для тех, кто либо не разрабатывал на JS, либо разрабатывал на нём эпизодически и теперь хочет освоить профессионально.

Программа

Курс состоит из трёх частей:

  1. Первая часть позволяет хорошо разобраться в языке JavaScript, получить знания и навыки написания JavaScript-кода, соответствующего современным стандартам.
  2. Вторая часть позволяет научиться работать со страницей и посетителем, создавать меню, слайдеры, Drag’n’Drop и прочие интерфейсные компоненты.
  3. Третья часть посвящена более сложным интерфейсам. На ней мы изучаем, как построить архитектуру, взаимодействие между компонентами, как организовать проект и код, систему сборки с использованием ES6.

Большое внимание на этом курсе уделяется стилю и качеству кода, глубокому пониманию языка. Именно это отличает хорошего разработчика от выучившего пару десятков функций новичка.

Набор в группы

Следующий набор на обновлённый курс (ES-2015) планируется в течение 2 недель.

Вы можете запросить уведомление о наборе:

На ваш email придёт письмо с информацией о дате и деталях программы.

Стоимость обучения 26000 руб. Время обучения: 2 месяца, включая одну неделю каникул с самостоятельно выполняемым заданием и организационное собрание.

Также участники получают вводный видеокурс за неделю до начала занятий.

Этот курс ведут: Михаил ГринькоАртём МезинИлья КанторИлья Бурлак.

Основные темы программы

  • Первая часть курса
  • Вторая часть курса
  • Третья часть курса

Первая часть курса

  1. Основной JavaScript.

    Здесь мы изучим сам язык, его конструкции и особенности, которые позволяют "разговаривать" на JavaScript коротко, понятно, а главное - без ошибок.

    • IDE, настройка, полезные приёмы использования, средства для автопроверки кода.
    • Основные структуры данных, работа с числами, строками, датами, массивами, объектами.
    • Инструменты разработки, отладка в браузерах.
    • Автоматизированное тестирование, инструменты и их применение.
    • Современный стандарт ES-2015 (ES6), его кросс-браузерное использование сейчас.
  2. Более глубокое понимание языка.

    Чтобы писать хороший код, а также грамотно пользоваться современными фреймворками, мы изучим JavaScript лучше, включая тонкости и продвинутое применение языковых конструкций.

    • Замыкания и их грамотное применение.
    • Внутреннее устройство движка JavaScript.
    • Контекст this в деталях.
    • Форвардинг, одалживание и делегирование функций.
    • Прототипы, классы, прототипное и функциональное ООП, детали использования.

По окончанию первой части курса вы свободно пользуетесь языком JavaScript, с учётом его особенностей и новых возможностей стандарта ES-2015. Мы улучшим эти навыки в последующих частях курса.

Вторая часть курса

  1. Документ, генерация интерфейса.

    Здесь мы учимся работать с документом, решать всевозможные задачи в браузере.

    • Внутреннее устройство браузера, оптимальная организация страницы со скриптами.
    • Дерево DOM, особенности разработки в современных браузерах с отмирающей, но иногда нужной поддержкой старых.
    • Динамическая генерация интерфейса - методы DOM, их грамотное использование.
  2. События, взаимодействие с посетителем.
    • Основы и тонкости работы с различными событиями для решения основных интерфейсных задач.
    • Drag'n'Drop, по окну и внутри элемента
    • Паттерн "делегирование", оптимизация производительности и архитектуры, чтобы интерфейсы не тормозили.
    • Объектно-ориентированная разработка, компонентная архитектура с использованием ООП, событий и DOM.
  3. AJAX
    • Общение с сервером при помощи XMLHttpRequest.
    • Использование Promise для асинхронных цепочек вызовов.

По окончании второй части вы можете создавать интерфейсные компоненты, но нужно больше практики.

Третья часть курса

  1. Сборка кода.
    • Node.JS как средство запуска полезных утилит.
    • Организация скриптов, стилей и других компонентов проекта на диске.
    • Шаблонизация, системы организации шаблонов и детали их работы.
    • Современные технологии Frontend-сборки, Webpack.
  2. Архитектура сложных интерфейсов.
    • Взаимодействие компонент через события и не только.
    • Проекты с большим количеством компонент.
  3. Куда дальше?
    • Обзор фреймворков (AngularJS, React.js), куда двигаться дальше.

На практике эти части не так чтобы резко отделены друг от друга, переход между ними плавный. Продвинутые темы используют элементы предыдущих.

Как проходит обучение?

Время обучения: 2 месяца, включая 10 дней каникул с самостоятельно выполняемым заданием, плюс видеокурс за неделю до начала занятий.

За это время мы планируем освоить очень многое.

Это подразумевает не ленивое ковыряние в носу во время лекции, а довольно-таки активный режим обучения.

  1. До начала курса вы получаете вводный видео-курс.
    К основному курсу необходимо с ним ознакомиться. Там раскрыты самые базовые темы, которые можно дать в таком формате. Это введение нужно, чтобы мы на занятиях не разбирали ну уж совсем простые темы (но вы сможете задавать вопросы по ним, если будут, в том числе и до начала курса).
  2. Далее, к каждому занятию выдаются материалы для освоения и задачи. Если это текст - читаете, если видео - смотрите в удобное для вас время. Делаете задачи.
  3. Мы встречаемся два раза в неделю онлайн, я рассказываю важные и тонкие моменты, на которые следует обратить внимание в материале (простые вы изучили по лекциям дома), вы задаете вопросы, показываете решения. Мы смотрим, как можно сделать лучше. Продолжительность 1.5 часа, в зависимости от темы и количества вопросов.

Резюмирую: будьте готовы к тому, что придётся учиться и делать реальные задачи, многие из которых не так уж просты.

Предварительные требования

Для участия в этом курсе необходимо знакомство с HTML/CSS.

Знание JavaScript не требуется. До начала обучения выдаётся вводный видеокурс по основам языка, особенно полезный для тех, кто начинает с нуля.

Результат обучения

  1. Вы хорошо знаете JavaScript, свободно разрабатываете и отлаживаете программы на этом языке.
  2. Вы умеете организовать JavaScript-проект, шаблоны и стили в файлах на диске в удобную структуру, собирать и оптимально подключать их к странице.
  3. Ваши интерфейсы работают стабильно, без глюков, их можно удобно дорабатывать и развивать.
  4. Мы идём от основ и до довольно-таки сложных штук. Успешное прохождение обучения гарантировано в том случае, если вы будете регулярно заниматься и делать домашнее задание.

Системные требования

Windows или Mac поддерживаются полностью.

Под Linux доступно участие онлайн и просмотр видеолекций, но для просмотра записей занятий нужен Dual Boot в Win/MacOS.

Для онлайн-общения желателен интернет от 256kb/s.

Комментарии

перед тем как писать…
  • Приветствуются комментарии, содержащие дополнения и вопросы по статье, и ответы на них.
  • Для одной строки кода используйте тег <code>, для нескольких строк кода — тег <pre>, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)
  • Если что-то непонятно в статье — пишите, что именно и с какого места.