Все курсы

Курс "JavaScript/​DOM/​Интерфейсы" для программистов

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

Программа

Этот курс предназначен для программистов.

Предполагается, что у участника есть опыт разработки от 1 года на языке с поддержкой ООП на классах, например: PHP, Ruby, Python, Java, C#. Благодаря этому мы сможем изучить больше продвинутых вещей, ведь программировать вы уже умеете.

На этот курс можно также пойти после нашего курса JavaScript/DOM/интерфейсы для новичков.

Если ваш опыт включает в себя лишь HTML/CSS и, возможно, "чуть-чуть" JavaScript, то для вас будет более эффективен курс для новичков.

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

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

В процессе вы создадите современный JavaScript-проект: админку для интернет магазина.

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

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

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

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

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

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

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

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

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

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

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

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

    • Внутреннее устройство браузера, оптимальная организация страницы со скриптами.
    • Дерево DOM, особенности разработки в современных браузерах с отмирающей, но иногда нужной поддержкой старых.
    • Динамическая генерация интерфейса - методы DOM, их грамотное использование.
  2. События, взаимодействие с посетителем.

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

    • Сетевые запросы к серверу.
    • Использование Promise для асинхронных цепочек вызовов.
    • Синтаксис async/await для удобной работы с запросами.

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

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

  1. Создание проекта: админка для интернет-магазина

    • Модули, организация скриптов и других компонентов проекта на диске.
    • "Одностраничные приложения", роутер, навигация без перезагрузки страницы, подгрузка модулей по необходимости.
  2. Разработка компонент

    • Таблица товаров с динамической подгрузкой и сортировкой, фильтрами.
    • Диаграммы с подсказками и динамической загрузкой данных.
    • Редактирование товаров (форма, сохранение/загрузка).
    • Использование Drag'n'drop для управления изображениями.
    • Ряд других компонент.
    • Сборка проекта при помощи Webpack.

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

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

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

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

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

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

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

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

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

Гарантия

  • Если объяснения будут вам непонятны
  • Если курсы не дадут вам новых знаний и умений
  • Если вы не сможете подключиться к системе онлайн-обучения

…то вы сможете получить деньги назад.

Для этого достаточно не позже окончания первой недели курса написать, указав причину из этого списка и что именно вас не устраивает, и тогда ваше участие будет прекращено, а вы получите деньги обратно, удобным для вас способом.

Преподаватели

Photo
Илья Кантор

Создатель этого сайта (JS backend & frontend & прочее).

Более 20 лет общего опыта программирования, из них более 12 лет JavaScript-разработки и консультирования в области Frontend.

Начиная с 2007 года вёл мастер-классы для опытных разработчиков, в которых участвовали сотрудники ведущих IT-компаний России и Украины (страница проекта, отзывы).

С начала 2011 года веду курсы JavaScript.

Photo
Илья Бурлак

В разработке около 10 лет, последние 6 лет разрабатываю только web-приложения на Javascript.

Долгое время работал в компании Mail.Ru, на позиции Frontend Team Leader. После этого работал руководителем команды на проекте JivoSite, сейчас занимаю должность техлида в компании Qleanlabs.

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

Photo
Игорь Непипенко

Занимаюсь современной frontend-разработкой с использованием Angular с 2013 года. С 2016 года веду обучение Javascript, Typescript и Angular. Также имею большой опыт преподавания математических дисциплин в ВУЗе.

Также работаю как Team/Tech Lead в разработке enterprise-приложений для CША, а также приложения для работы с блокчейн, например система для рекламы, основанная на цифровой валюте cresttoken.com. Предпочитаю стек MEAN.

Что говорят о курсе участники

Эти отзывы относятся к предыдущей версии курса, до обновления программы "для программистов".

Дополнительная информация

  • Для участия в этом курсе необходимо знакомство с HTML/CSS, а также опыт программирования на языке с поддержкой ООП от 1 года.

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

  • Windows, Mac, Linux поддерживаются.

    Для вебинаров (видео-занятий) желателен интернет от 256kb/s.

Комментарии

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