JavaScript в браузере
4 часа практики 2 часа теории
К стандартным возможностям JavaScript добавляется функционал браузера, который обычно называют Web API. Подключив скрипт к HTML документу, мы получаем к нему доступ и можем делать документ «живым»: изменять его и реагировать на действия пользователя. Например, менять картинки по клику на кнопку «далее», тем самым реализовав фотогалерею, или управлять воспроизведением аудио.
Формы и асинхронные запросы
8 часов практики 4 часа теории
Часто, когда мы говорим о веб-интерфейсах, мы имеем ввиду формы. HTML-формам JavaScript не нужен, они работают и так. Но если мы хотим показывать дополнительные поля в зависимости от заполнения основных, заполнять форму пошагово, показывать подсказки и ошибки — тут потребуется немного JavaScript-кода. Научимся проверять формы прямо во время их заполнения и отправлять данные на сервер без обновления всей страницы.
Веб-сокеты и локальное хранилище
6 часов практики 3 часа теории
Если изменить что-то на веб-странице и обновить её — изменения будут потеряны. Все, кто много работает с веб-сервисами, привыкли к этому. Но используя локальное хранилище, мы можем сделать веб-интерфейс, который больше похож на десктоп-приложение. Он будет запоминать состояние и воссоздавать его при обновлении страницы.
Canvas
10 часов практики 5 часов теории
Если возможностей DOM для визуализации информации недостаточно, то можно использовать компонент Canvas (холст), на котором можно рисовать с помощью скрипта. Изучим базовый функционал, доступный в JavaScript для рисования графиков и визуализации информации.
Файлы и медиа-ресурсы
6 часов практики 3 часа теории
Веб не был бы популярным без гарантии полной безопасности, которую дают браузеры. Наш скрипт может получить доступ к файлам только с разрешения пользователя: например, если он выбрал файл с помощью поля загрузки файлов, а так же к файлам в специальной «песочнице». Аналогично можно получить доступ к веб-камере, микрофону и геопозиции.
История и отладка веб-приложения
2 часа практики 1 час теории
Говорят, что 90% времени программист тратит на поиск, локализацию и устранение ошибок. Остальные 10% — на их написание. Изучим средства браузера, которые позволят искать ошибки и отлаживать код максимально эффективно. Изучим не только сами инструмент, но и приемы, которые позволят быстро находить проблему и вообще лучше понимать, как все работает. В том числе, в такой непростой теме как асинхронные HTTP-запросы и веб-сокеты.
Ключевые навыки:
-
Объектная модель браузера и документа (BOM и DOM)
-
Глубокое понимание работы событий и их обработки
-
Асинхронные HTTP-запросы (AJAX)
-
Локальное хранилище (localStorage)
-
Веб-сокеты (WebSocket)
-
Работа с файлами и медиаресурсами
-
Создание одностраничных веб-приложений (SPA)