top of page

frontend beginning

Web fundamentals for future engineers

старт:

5 трав. 2026 р.

36 занять, 3,5 місяця

150 $/місяць

вт / пт, 18:30 (UTC+2)

150 $/місяць

вт / пт, 18:30 (UTC+2)

про курс

Це курс для тих, хто хоче зробити системний старт у frontend-розробці та зрозуміти, як працює сучасний веб — від розмітки до SPA-додатків.

Програма охоплює HTML, CSS, JavaScript, TypeScript та React і дає цілісне бачення стеку без занурення у вузьку спеціалізацію — щоб ви розуміли систему, а не окремі фреймворки. Фокус на практиці, поступовому ускладненні завдань і розумінні того, як технології поєднуються між собою у реальних проєктах.

Курс не потребує комерційного досвіду у frontend — це структурована точка входу у веброзробку.
Після курсу ви зможете створювати адаптивні веб-інтерфейси та базові SPA, розуміючи логіку сучасної frontend-інженерії.

навчальний план
буде гаряче

  • Структура веб-сторінки
  • Знайомство з інструментами розробника у браузері
  • Налаштування робочого середовища (редактор коду, Git, GitHub)
  • Базові принципи UI/UX дизайну

Основи веб-розробки

Як працює Інтернет та веб-браузери

  • Семантична розмітка HTML5
  • Форми та валідація
  • Доступність (ARIA, семантика)
  • SEO основи

HTML — основа веб-сторінок

Проєкт: створення семантично правильної веб-сторінки

  • Селектори та специфічність
  • Box model та розміщення елементів
  • Flex та Grid системи
  • Адаптивний дизайн та медіа-запити
  • CSS-препроцесори (SASS/SCSS)
  • CSS-змінні та кастомні властивості
  • Анімації та переходи

CSS — оформлення веб-сторінок

Проєкт: адаптивний веб-сайт

  • Синтаксис та основи мови
  • Типи даних, змінні, області видимості
  • Функції, параметри, замикання
  • DOM-маніпуляції
  • Події та обробники подій
  • Об'єктно-орієнтоване програмування в JavaScript
  • Основи асинхронності та Callbacks

Фундамент JavaScript

Проєкт: інтерактивна веб-сторінка

  • Прототипне наслідування
  • Функціональне програмування в JavaScript
  • This, bind, call, apply
  • Promises та ланцюжки промісів
  • Async/Await та обробка помилок
  • ES6+ можливості (деструктуризація, спред/рест оператори, стрілкові функції)
  • Map, Set, WeakMap, WeakSet
  • Object, Reflection и Proxy
  • ArrayBuffer та контейнери
  • Символи, ітератори, генератори

Поглиблені концепції JavaScript

Проєкт: реалізація асинхронного додатку

  • BOM (Browser Object Model) та Window
  • Navigation, Location, History API
  • Geolocation, Notification, Media
  • Storage API (localStorage, sessionStorage)
  • IndexedDB
  • Fetch API та XHR
  • FormData та валідація
  • Cookie та робота з ними
  • Робота з медіа (аудіо, відео, WebRTC)

Робота з браузером в JavaScript

Проєкт: додаток зі збереженням стану та роботою з API

  • Патерни проєктування Module, Factory, Observer, Singleton
  • Оптимізація продуктивності
  • Event loop та асинхронна архітектура
  • WebWorkers, ServiceWorkers
  • Garbage Collection та керування пам'яттю
  • Canvas та SVG для візуалізації даних
  • Server-sent events, WebSockets для реального часу
  • Мікросервісна архітектура на фронтенді

JavaScript — продуктивність та архітектура

Проєкт: оптимізований вебдодаток зі складною логікою

  • React основи (компоненти, props, state)
  • React hooks та життєвий цикл
  • Керування станом (Context API, Redux)
  • React Router
  • Вступ до Vue.js та Angular

Фронтенд-фреймворки

Проєкт: SPA додаток на React

читає

Владислав Продан

Senior Frontend Engineer у @ELEKS.

Former: Frontend Engineer у Astound Digital.

Реєстрація. Перший крок за вами

реєстрація
перший крок за вами

Я приймаю умови Публічної оферти та надаю згоду на обробку своїх персональних даних відповідно до Політики конфіденційності.

відгуки
що говорять випускники

що на вас чекає
have fun and dive deep

комунікація, яка тримає в тонусі

Зустрічаємось у Zoom двічі на тиждень — щовівторка і щоп’ятниці о 18:30. Лекції тривають 1.5 години, кожна записується, тож ви завжди зможете передивитися матеріал у зручний час. Також регулярно проводимо додаткові Q&A-сесії з лектором. Мова викладання — українська. Додаткові матеріали — англійською.

Slack — наш спільний простір. Тут обговорюємо задачі, ділимось підказками, пишемо хитрі тести й обговорюємо реферали в топ-компанії.

оточення, яке заряджає

Проводимо відбір, щоб ви навчалися в середовищі сильних і вмотивованих. Тих, хто не виконує домашки, — відраховуємо.

Лектор завжди на зв’язку — пояснить, доки не стане зрозуміло. Іноді це третя ітерація code review, іноді — залишаємося після лекції, щоб розібратись разом. Це нормально — ми тут, щоб вчитись і ставати сильнішими.

формат, який працює

Постійний зворотний зв’язок у Slack, на лекціях і QA-сесіях — ми завжди поруч.

Жодних поверхневих слайдів: тільки глибокий розбір цікавих задач із реального продакшену.

Сертифікат видаємо лише за реальні результати — виконані домашки, участь у дискусіях, відчутний прогрес.

bottom of page