Введение — JS: DOM API

Что вообще такое фронтенд-разработка?

Современные сайты обладают высокой степенью интерактивности. Страницы перезагружаются всё реже, а манипуляции с содержимым происходят прямо на месте. Программные решения стали настолько сложными (комплексными), что уже сейчас в браузере реализуются полноценные среды разработки (например, редактор Хекслета), программы, подобные Photoshop или пакеты, аналогичные Microsoft Office. Существует большая индустрия игр, созданных для браузеров. Причём благодаря аппаратной поддержке эти игры не уступают тому, что делается и для обычного десктопа.

Язык, который изначально использовался как способ добавить снежинки на сайт, стал мощнейшим инструментом в руках профессионалов. На текущий день JavaScript — единственный язык, исполняемый браузерами.

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

Манипуляция содержимым страницы
Управление внешним видом
Реакция на действия пользователя
Работа с куками
Управление браузером (адресная строка, навигация, история)
Взаимодействие с сервером
Проигрывание видео
Ввод/Вывод. Взаимодействие с файловой системой и сетью
2D/3D рисование

С точки зрения языка, большинство этих возможностей выглядят как некие глобальные объекты, с которыми можно взаимодействовать в программе. Самым базовым и ключевым объектом этой системы является представление DOM-дерева.

В этом курсе мы научимся внедрять js на сайт, пройдём по основным способам манипулирования страницей, познакомимся с полифиллами, сделаем свой первый ajax-запрос и откроем для себя мир событий.

После этого курса вы сможете попробовать свои силы в создании простых фронтенд-игр (в практике после курса).

Подготовка

Этот курс посвящен тому как оживлять страницы в браузере используя JavaScript. Подразумевается, что сам JavaScript уже хорошо изучен ранее, на других курсах Хекслета или за его пределами.

Остались вопросы? Задайте их в разделе «Обсуждение»

Вам ответят команда поддержки Хекслета или другие студенты.

Ошибки, сложный материал, вопросы >

Нашли опечатку или неточность?

Выделите текст, нажмите ctrl + enter и отправьте его нам. В течение нескольких дней мы исправим ошибку или улучшим формулировку.

Что-то не получается или материал кажется сложным?

Загляните в раздел «Обсуждение»:

задайте вопрос. Вы быстрее справитесь с трудностями и прокачаете навык постановки правильных вопросов, что пригодится и в учёбе, и в работе программистом;
расскажите о своих впечатлениях. Если курс слишком сложный, подробный отзыв поможет нам сделать его лучше;
изучите вопросы других учеников и ответы на них. Это база знаний, которой можно и нужно пользоваться.

Об обучении на Хекслете

Статья «Как учиться и справляться с негативными мыслями»
Статья «Ловушки обучения»
Статья «Сложные простые задачи по программированию»
Урок «Как эффективно учиться на Хекслете»
Вебинар «Как самостоятельно учиться»

Для полного доступа к курсу нужен базовый план

Базовый план откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.

Получить доступ

130

курсов

900

упражнений

2000+

часов теории

3200

тестов