- Кількість кредитів 3,5
- Тип Обов'язковий
- Семестр 4
- Рівень вищої освіти Бакалавр
- Підсумковий контроль Екзамен
⚡Квест: Нативний JavaScript. Оживи вебресурси та керуй асинхронним рантаймом!
Час переходити від статичних макетів до імперативного програмування! Навчимо писати чистий код на Vanilla JS (ES6+) без сторонніх фреймворків. Підкориш архітектуру Event Loop, замикання, проміси, Async/Await та Fetch API для обміну даними з сервером.
🚀Хакай браузер на максимальній швидкості!
🛠Стек: Vanilla JavaScript, Vite, WebSockets, Browser DevTools, IndexedDB, Vercel.
🎒В рюкзак: Динамічний вебзастосунок з рендерингом у реальному часі та офлайн-базою даних.
⚡Квест: Підкори Event Loop, приручи асинхронні запити та створюй реактивні вебзастосунки!
🌐Опис місії
Просто зверстати сайт — це рівень минулого десятиліття. Сучасному IT потрібні інтерактивні додатки, які миттєво реагують на дії користувача та спілкуються з сервером без перезавантаження сторінок. Цей квест — твій безальтернативний квиток у професійний Front-end. Ми зануримося в роботу браузерного рушія V8 «під капотом». Ти дізнаєшся все про область видимості, замикання, механізми Garbage Collection, черги мікро- та макрозадач в Event Loop. Опануєш чистий Vanilla JavaScript (ES6+) на такому рівні, щоб будь-який високорівневий фреймворк (React, Vue чи Angular) буде для тебе легкою прогулянкою!
🛠Твій інструментарій
Language & Execution: Vanilla JavaScript (нативні стандарти ES6+), браузерні Web APIs (DOM, BOM).
Build & Tooling: Vite (надшвидка інфраструктура збирання на ES-Modules), ESLint, Prettier.
Network & Real-time: Fetch API (асинхронні запити), WebSockets / Server-Sent Events (SSE).
Client Storages: IndexedDB (асинхронна нереляційна офлайн-БД), Web Storage (LocalStorage/SessionStorage), Cookies.
Debugging: Browser DevTools (вкладки Performance для аналізу Reflow/Repaint, Memory для пошуку витоків у купі).
🚀Що прокачаєш (Суперсили)
Event Loop & Asynchrony: Розберешся в пріоритетах виконання коду браузером, змонтуєш стійкі конвеєри Async/Await та навчишся скасовувати мережеві запити через AbortController.
Advanced Event Delegation: Опануєш життєвий цикл подій (Capturing, Target, Bubbling) та впровадиш патерн делегування для ультрашвидкої обробки великих динамічних списків.
High-Frequency Optimization: Навчишся оптимізувати навантаження на Main Thread браузера під час скролу чи введення тексту за допомогою інженерних шаблонів Debounce та Throttle.
Secure State Management: Налаштуєш безпечне збереження JWT-токенів у HttpOnly Cookies та розробиш HTTP-інтерцептори для автоматичної авторизації запитів розробника.
🎒Що покладеш у рюкзак (Портфоліо)
Твоїм фінальним шедевром стане Динамічний інтерактивний вебзастосунок на чистому JavaScript (без сторонніх фреймворків), що виконує асинхронні CRUD-операції та розгорнутий на Vercel чи Netlify:
Object-Oriented DOM Manager: Модуль імперативного керування DOM-деревом, побудований на базі чистих ES6-класів.
Asynchronous Network Pipeline: Стійкий конвеєр Fetch-запитів із обробкою помилок авторизації (401/403) та автоматичним Login Redirect.
Real-Time WebSocket Channel: Інтерактивний модуль двостороннього зв'язку для синхронізації станів у реальному часі з інтеграцією Notification API.
Client-Side Persistence Layer: Модуль офлайн-режиму на базі IndexedDB, який зберігає дії користувача при відсутності мережі (navigator.onLine).
💼Твій майбутній тайтл
Ці знання — головна вимога на технічних інтерв'ю в продуктових та аутсорсингових ІТ-компаніях:
Junior JavaScript Software Engineer.
Client-Side Applications Optimizer (інженер з оптимізації швидкодії веб-інтерфейсів).
