JavaScript в браузере: создаем интерактивные веб-страницы: Курсы

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)