Фронтенд-девелопмент

Метою дисципліни є засвоєння необхідних знань з написання скриптів за допомогою мови програмування JavaScript, фундаментальне вивчення версій стандартів ECMAScript.

Завдання навчальної дисципліни: ознайомити здобувачів вищої освіти з теоретичними знаннями з фронтенду, тобто клієнтського програмування, відпрацювати практичні навички з використання мови програмування JavaScript

Знати:

- синтаксис та базові алгоритмічні конструкції мови JavaScript;

- принципи та особливості реалізації об’єктно-орієнтованого програмування у мові програмування JavaScript;

- сучасні стандарти ECMAScript;

- основні потенційні загрози та можливі шляхи вторгнень у веб-орієнтовані системи;

Вміти:

- писати клієнтські скрипти за допомогою мови програмування JavaScript;

- реалізовувати обробку подій за допомогою JavaScript;

- застосовувати функціональне та об’єктно-орієнтоване програмування на клієнті за допомогою JavaScript;

- реалізовувати обмін даними між фронтендом та бекендом.

Тема 1. Вступ у JavaScript.

Основи синтаксису JavaScript. Оператори мови JavaScript. Операції у мові JavaScript. Приведення типів. Відмінності JavaScript від інших мов програмування. Редактори коду. Консоль розробника.

Тема 2. JavaScript: швидкий старт.

Основи роботи з тегами та стилями за допомогою JavaScript. Найпростіші обробники подій. Приклади написання програмного коду.

Тема 3. Рядки. Регулярні вирази.

Представлення рядків у JavaScript. Довжина рядка. Доступ до символів.

Зміна регістру. Пошук підрядків. Отримання підрядка. Порівняння рядків. Юнікод. Регулярні вирази. Робота з регулярними виразами у JavaScript.

Тема 4. Масиви.

Оголошення. Методи pop/push, shift/unshift. Внутрішнє представлення масиву. Ефективність. Перебір елементів. Властивість «length». Багатовимірні масиви. Додавання та видалення елементів. Демонстрація прикладів роботи з масивами.

Тема 5. Функції.

Оголошення функцій. Локальні змінні. Зовнішні змінні. Параметри. Параметри по замовчуванню. Повернення значення. Function Expression. Function Expression у порівнянні з Function Declaration. Функції-«колбеки». Стрілочні функції.

Тема 6. Document Object Model.

Браузерне оточення, специфікації. DOM-дерево. Навігація по DOM-елементам. Пошук: getElement*, querySelector*. Властивості вузлів: тип, тег та вміст. Атрибути та властивості. Зміна документа. Стилі та класи. Розміри та прокручування елементів. Розміри та прокручування вікна. Координати. Демонстрація прикладів програмного коду.

Тема 7. Обробка подій

Введення у браузерні події. Сплив і занурення. Делегування подій. Дії браузера за промовчанням. Генерація користувачів подій. Демонстрація прикладів програмного коду.

Тема 8. Таймери. Обробка виключень.

Планування виконання коду за допомогою setTimeout та setInterval. Рекурсивний setTimeout. setTimeout з нульовою затримкою. Синтаксис "try ... catch". Об'єкт помилки. Блок "catch" без змінної. Використання «try…catch». Генерація власних помилок. Прокидання виключення. try…catch…finally. Глобальний catch.

Тема 9. Об’єктно-орієнтоване програмування у JavaScript: частина 1.

Оголошення класів за допомогою функцій-конструкторів. Прототипне наслідування. F.prototype. Вбудовані прототипи. Методи прототипів, об'єкти без властивості __proto__.

Тема 10. Об’єктно-орієнтоване програмування у JavaScript: частина 2.

Клас: базовий синтаксис. Наслідування класів. Статичні властивості та методи. Приватні та захищені методи та властивості. Розширення вбудованих класів. Перевірка класу: "instanceof". Домішки.

Тема 11. Web API.

Web Workers API. Geolocation API. History API. LocalStorage та SessionStorage API. Files API. Application Cache API. Vibration API. Fullscreen API. Page Visibility API. Notification API. High Resolution Time API.

Тема 12. Проміси, async/await.

Введення: колбеки. Промисли. Ланцюжок промісів. Промисли: обробка помилок. Promise API. Промісифікація. Мікрозавдання. Async/await.

Лабораторні роботи - 90 балів, відвідування лекцій - 10 балів