![[htmlacademy] Интенсивный онлайн‑курс: Профессиональный JavaScript. Уровень 1. (14-й поток)](/assets/images/logos/logo-white.webp "[htmlacademy] Интенсивный онлайн‑курс: Профессиональный JavaScript. Уровень 1. (14-й поток)"){kind=logo}
- 25, Aug 2018
- #1
htmlacademy
Интенсивный онлайн‑курс: Профессиональный JavaScript. Уровень 1. (14-й поток)
Описание: Курс рассчитан на людей без навыков программирования. Для прохождения понадобятся навыки вёрстки, которые можно получить пройдя интерактивные курсы или интенсив «Профессиональный HTML и CSS, уровень 1».
Программа обучения:
Знакомство. Рассмотрим схему работы на интенсиве, какие инструменты понадобятся. Начнём разбирать основы JavaScript:
Организационные вопросы:
Основы JavaScript:
Встроенные API. Разбираемся со сложными типами данных: массивы и объекты, циклические алгоритмы, а также посмотрим на встроенные в JavaScript объекты для работы с окном браузера,открытой страницей, DOM-элементами и графикой:
Отладка кода.
Сложные типы данных:
Встроенные объекты:
DOM. Пробуем создавать, удалять, перемещать и управлять DOM-элементами. Опишем данные, которые будем отображать на странице, а затем, с помощью шаблонов отрисуем их:
Управление DOM-деревом:
Подходы к созданию DOM-элементов:
Шаблонизация:
Обработка событий. Рассмотрим динамическое взаимодействие с пользователем: как сделать так, чтобы страница начала реагировать на ввод текста в формы, нажатие на определённые элементы, прокрутки и прочее. Заодно попробуем сделать страницу более доступной: как добавить правильную работу с клавиатурой и зачем это нужно:
Асинхронность, Event Loop.
События:
Модули. Обсудим принцип DRY (не повторяйся) и как им пользоваться для того, чтобы писать меньше кода, но при этом делать больше:
Перетаскивание:
Модульность:
Работа с сетью. Взглянем на протокол HTTP и инструменты, которые позволяют делать запросы из браузера. Рассмотрим, как меняется взаимодействие пользователя с сайтом при начале работы с сетью, что может пойти не так и что с этим делать:
Структуры данных. Разберём непопулярную среди фронтенд-разработчиков тему структур данных. Что такое данные, почему у них есть структура, и на доступных примерах посмотрим, как использование структур данных может облегчить разработчику жизнь:
Контекст функций:
Продвинутая работа с массивами:
Оптимизации производительности:
Компонентный подход. Разберём продвинутую работу с объектами, узнаем как можно удобным способом создавать большое количество одинаковых объектов и зачем это нужно:
Типизированные объекты:
Рефакторинг.
Узкие места в JavaScript. Посмотрим на особенности JavaScript, которые лучше не забывать учитывать при разработке. Заодно взглянем на дополнительные полезные техники, не разобранные на интенсиве:
Финал. Подводим итоги интенсива. Что делать дальше.
Скачать: Скрытая информация :: Авторизуйтесь для просмотра »
Описание: Курс рассчитан на людей без навыков программирования. Для прохождения понадобятся навыки вёрстки, которые можно получить пройдя интерактивные курсы или интенсив «Профессиональный HTML и CSS, уровень 1».
Программа обучения:
Знакомство. Рассмотрим схему работы на интенсиве, какие инструменты понадобятся. Начнём разбирать основы JavaScript:
Организационные вопросы:
- Обзор проектов.
- Схема работы на интенсиве.
- Введение в программирование:
- Программирование и алгоритмы.
- Данные.
- Линейные алгоритмы.
- Ветвящиеся алгоритмы.
Основы JavaScript:
- Типы данных.
- Операторы.
- Приведение типов.
- Переменные.
- Функции.
- Условные операторы.
Встроенные API. Разбираемся со сложными типами данных: массивы и объекты, циклические алгоритмы, а также посмотрим на встроенные в JavaScript объекты для работы с окном браузера,открытой страницей, DOM-элементами и графикой:
Отладка кода.
Сложные типы данных:
- Циклические алгоритмы.
- Массивы.
- Объекты.
Встроенные объекты:
- document, элемент для работы c DOM-деревом.
- canvas, элемент для работы c программируемой графикой.
DOM. Пробуем создавать, удалять, перемещать и управлять DOM-элементами. Опишем данные, которые будем отображать на странице, а затем, с помощью шаблонов отрисуем их:
Управление DOM-деревом:
- DOM-дерево: структура.
- Поиск элементов на странице.
- Управление атрибутами DOM-элементов.
- Перемещение элементов в DOM-дереве.
Подходы к созданию DOM-элементов:
- Управление разметкой: insertAdjacentHTML, innerHTML, textContent.
- Создание DOM-объектов.
Шаблонизация:
- Строковая шаблонизация.
- Специальный тег <template>.
Обработка событий. Рассмотрим динамическое взаимодействие с пользователем: как сделать так, чтобы страница начала реагировать на ввод текста в формы, нажатие на определённые элементы, прокрутки и прочее. Заодно попробуем сделать страницу более доступной: как добавить правильную работу с клавиатурой и зачем это нужно:
Асинхронность, Event Loop.
События:
- Обработчики событий.
- Объект Event, управление событиями.
- Фазы событий и делегирование.
- Клавиатурные события и доступность.
- Валидация форм.
Модули. Обсудим принцип DRY (не повторяйся) и как им пользоваться для того, чтобы писать меньше кода, но при этом делать больше:
Перетаскивание:
- Изменение координат элементов на странице.
- Drag and Drop.
- Области видимости функций:
- Области видимости.
- Глобальная область видимости.
- Замыкания.
- Потеря окружения.
Модульность:
- Повторное использование кода, принцип DRY.
- Функции как модули.
- Понятие модуля, виды модулей.
- Инкапсуляция.
- Немедленно выполняющиеся функции (IIFE).
Работа с сетью. Взглянем на протокол HTTP и инструменты, которые позволяют делать запросы из браузера. Рассмотрим, как меняется взаимодействие пользователя с сайтом при начале работы с сетью, что может пойти не так и что с этим делать:
- Исключения.
- Оператор множественного выбора switch.
- Протокол HTTP и форматы данных:
- XML.
- JSON.
- JSONP.
- Объект XMLHttpRequest.
- Обработка ошибок в запросах.
Структуры данных. Разберём непопулярную среди фронтенд-разработчиков тему структур данных. Что такое данные, почему у них есть структура, и на доступных примерах посмотрим, как использование структур данных может облегчить разработчику жизнь:
Контекст функций:
- Ключевое слово this.
- Изменение контекста.
Продвинутая работа с массивами:
- Управление массивами: вставка и удаление элементов.
- Выборки из массива: slice и filter.
- Сортировка.
- Итераторы по массивам.
- Свёртка массивов: some, every и reduce.
Оптимизации производительности:
- Оценка эффективности алгоритмов.
- Пропуск кадров — тротлинг (throttle).
- Устранение дребезга — дебаунс (debounce).
Компонентный подход. Разберём продвинутую работу с объектами, узнаем как можно удобным способом создавать большое количество одинаковых объектов и зачем это нужно:
Типизированные объекты:
- Функции-конструкторы.
- Прототипы.
- Цепочки прототипов, наследование.
- Полиморфизм, переопределение методов.
Рефакторинг.
Узкие места в JavaScript. Посмотрим на особенности JavaScript, которые лучше не забывать учитывать при разработке. Заодно взглянем на дополнительные полезные техники, не разобранные на интенсиве:
- Необязательные точки с запятой.
- Подвешивание (hoisting) переменных и функций.
- Продвинутые техники программирования.
- Регулярные выражения.
- Минификация кода.
Финал. Подводим итоги интенсива. Что делать дальше.
Скачать: Скрытая информация :: Авторизуйтесь для просмотра »
![[Костюченко Мария] Новогоднее измерение сказок и Хоровод сказок](/assets/images/icons/forum4.png){kind=icon}
![[Екатерина Буслова] Как повысить самооценку ребёнка и помочь ему поверить в свои силы](/assets/images/icons/forum0.png){kind=icon}
![[Lee] Вебинар ДНК. Часть 2 продолжение (2019)](/assets/images/icons/forum2.png){kind=icon}
![[Светлана Тишкова] Cчастье женщины [2016]](/assets/images/icons/forum3.png){kind=icon}
