Курс: Сучасний фронтенд
Актуальні підходи до побудови web-застосунків: 16 практичних занять.
Ментори:
Антон Худяков, Software Development Engineer в MAANG компанії.
Микита Попов, Senior Software Engineer в ALLSTARSIT.
Ви засвоїте на практиці Next.js, Micro Frontends, Progressive Web Apps (PWA), реактивне програмування та IaC. Ці технології та підходи зараз є одними з ключових. Ви навчитеся їх застосовувати та розв'язувати найпоширеніші проблеми, які виникають під час розробки.
- SSR і Next.js. Ви розглянете, як створювати оптимізовані для серверів React-застосунки за допомогою Next.js. Також ми розглянемо розгортання застосунків на Vercel, AWS та Azure. Як бонус, ми розберемо, як створювати SPA (односторінкові застосунки) з Next, які є переваги та недоліки цього підходу та як їх розгортати на AWS S3 з AWS Cloudfront.
- Micro Frontends. Ви дізнаєтесь, як розбити монолітний фронтенд на менші, незалежні частини, які можна розробляти та розгортати окремо на AWS і Azure. Також у цьому розділі ми розглянемо сучасний інструмент для керування станом — Zustand, а також рішення для маршрутизації від Таннера Лінслі — TanStack Router.
- PWA. Ви розберете, як створювати web-застосунки, які можуть працювати офлайн і мають User Experience, близький до нативних застосунків. Розглянемо засоби розгортання та публікації застосунків до магазинів.
- Реактивне програмування та IaC. Задача цього модуля — познайомити учасників з концептом гідратації та реактивного програмування як засобів роботи з динамічними вебсайтами. Ви розглянете відмінності між server-side rendering, статичними генераторами сайтів та island architecture, а також попрацюємо з потоками даних у реальному часі для event-driven застосунків. Окрему увагу приділимо автоматизації налаштувань інфраструктури за допомогою підходів Infrastructure as Code (IaC).
Крім теорії, ви будете практикуватися, створюючи реальні web-застосунки. Для закріплення навичок, ви побудуєте декілька проєктів, які залишаться у вас в портфоліо.
Після проходження цього курсу, ви зможете:
- розібратись у сучасних інструментах для побудови веб застосунків
- обирати потрібні інструменти, знаючі їх сильні та слабкі сторони
- розгортати ваші застосунки з допомогою популярних cloud провайдерів
Цей курс підійде як новачкам, так і досвідченим розробникам, які хочуть вдосконалити свої знання та навички.
Ментори:
Антон Худяков, Software Development Engineer в одній із MAANG компаній. Має 6+ років досвіду створення web-застосунків для електронної комерції, інструментів бізнес-аналітики, статичних генераторів web-сайтів, моделей машинного навчання, рішень MLOps.Микита Попов, Senior Software Engineer в ALLSTARSIT. Має 10+ років досвіду, що охоплює стартапи та проєкти рівня enterprise. Брав участь у міграції великих SAAS рішень з використанням хмарних технологій та сучасних інструментів web-розробки.
Формат:
4 модулі: 16 занять по 2 рази на тиждень, четвер та неділя.
Тривалість одного заняття: ~2 години
Платформа: Zoom
Мова лекцій: українська. Презентації та шаблони надаються англійською мовою.
Усі матеріали, посилання на ZOOM-заняття та відео курсу будуть розміщені на навчальній платформі. Після покупки квитка ви отримаєте доступ до курсу на електронну адресу, вказану при реєстрації.Кому буде цікаво?
- Frontend-розробникам зі знанням JS
- Всім, хто хоче розібратися в сучасній архітектурі web-застосунків
Програма
Chapter 1: SSR та Next.js
На першому модулі курсу ви навчитеся створювати високопродуктивні React-застосунки з серверною оптимізацією за допомогою Next.js. Ми розглянемо стратегії розгортання на провідних платформах, таких як Vercel, AWS Amplify та Azure. Як бонус, ви дізнаєтесь, як створювати односторінкові застосунки (SPA) з Next.js та розгортати їх на AWS S3.
Разом ми створимо повнофункціональний блог-застосунок з нуля, використовуючи Server Components, Supabase та різні сервіси AWS.
Для закріплення знань ви створите власний повнофункціональний застосунок, застосовуючи ті ж передові технології, отримуючи практичні навички через виконання проєкту.- 12.12, 19:30. SSR and Next.js fundamentals, ShadcnU
- 15.12, 11:00 Advanced Next.js
- 19.12, 19:30 CI/CD, Deployment to Vercel, AWS
- 22.12, 11:00 Q&A сесія
Chapter 2: Опануйте MicroFrontends: Створюйте масштабовані, незалежні веб-рішення
Ви навчитеся розбивати монолітний фронтенд на менші, незалежні мікрофронтенди, які можна розробляти та розгортати окремо на платформах, таких як AWS і Azure. Ви також освоїте передові інструменти, як Zustand для управління станом та TanStack Router від Таннера Лінслі для просунутого маршрутизації.
Разом ми створимо з нуля вебсайт для кінотеатру, використовуючи мікрофронтенди. Після завершення курсу ви створите власне end-to-end рішення на основі мікрофронтендів, застосовуючи набуті знання для побудови масштабованих і гнучких веб-застосунків.
- 29.12, 11:00 Building SPAs with React, Vite, Zustand, TanStack Router
- 05.01, 11:00 "Merging" those applications with the Micro Frontends approach
- 09.01, 19:30 CI/CD, Deployments to AWS, Azure, Vercel
- 12.01, 11:00 Q&A сесія
Chapter 3: PWA
Підтримка офлайн моду, кешування, push-сповіщення та публікація в магазинах застосунків. Ви навчитеся створювати веб-застосунки, які працюють офлайн і забезпечують користувацький досвід, близький до нативних застосунків.
Розглянемо основні інструменти для розробки прогресивних веб-застосунків, стратегії кешування статичних та real time даних, сучасні можливості PWA (такі як push сповіщення та фонове оновлення). Створимо web-застосунок поза екосистемою React, який можна буде опублікувати до магазинів або розгорнути та мати можливість встановити з браузера.
- 16.01, 19:30 Introduction to PWA and Web App Manifest
- 19.01, 11:00 Service Workers
- 23.01, 18:30 PWA and hardware access
- 26.01, 11:00 Q&A сесія
Chapter 4: Master Hydration and Reactive Programming for Dynamic Web Experiences.
У цьому модулі ви заглибитеся у світ гідратації та реактивного програмування, відкриваючи потенціал динамічних вебсайтів. Ми детально розглянемо відмінності між рендерингом на стороні сервера (SSR), статичними генераторами сайтів (SSG) та новаторською архітектурою островів, що дасть вам міцну основу для вибору оптимальних підходів у різних проєктах.
Ви попрацюєте з потоками даних у реальному часі та створите подієво-орієнтовані застосунки за допомогою реактивного програмування. Також ви засвоїте важливі навички автоматизації налаштувань інфраструктури за допомогою підходів Infrastructure as Code (IaC), що значно спростить ваші процеси розробки.
Протягом курсу ми разом розробимо реальний чат-застосунок, демонструючи обробку даних у реальному часі та реактивне програмування. Після цього ви створите свій власний подієво-орієнтований застосунок, застосувавши ці техніки для побудови динамічного веб-рішення з нуля.
- 30.01, 19:30 Hydration in modern frontend applications
- 02.02, 11:00 Reactive programming, introduction to streams in event-driven applications
- 06.02, 19:30 Beautiful Infrastructure as Code with AWS CDK
- 09.02, 11:00 Q&A сесія
Ментор: Антон Худяков
— Software Development Engineer в одній із MAANG компаній
— Lecturer at Fwdays
— Mentor at Tech Ground Hackathons
— Proud Ukrainian 🇺🇦
— Має 6+ років досвіду створення web-застосунків для електронної комерції, інструментів бізнес-аналітики, статичних генераторів web-сайтів, моделей машинного навчання, рішень MLOps.
Ментор: Микита Попов
— Senior Software Engineer в ALLSTARSIT, з десятирічним досвідом у розробці програмного забезпечення, що охоплює стартапи та проекти рівня enterprise.
— Прихильник генеративного ШІ, з досвідом тренування моделей та використання у Front End застосунках.
— Брав участь у міграції великих Software as a service рішень з використанням хмарних технологій та сучасних інструментів веб розробки.
— Ментор Tech Ground Hackathons, та активний учасник хакатонів.
— Ступінь у галузі комп'ютерних наук та електронної інженерії, з публікаціям на тему стиснення та обробки даних.
Вартість квитків
Доступ до курсу в LMS-системі (1 рік)
Доступ до 16 зум-сесій з менторами
PDF презентації теоретичних частин
Доступ до TG-чату, де ментори будуть відповідати на питання
Сертифікат учасника за умови проходження всього курсу
10% знижки на участь в конференціях Fwdays
Доступна оплата частинами від Монобанку та покупка в розстрочку від Приватбанку
Якщо після першого модулю ви зрозумієте, що очікування не співпадають, ми повертаємо гроші в повному обсязі.
Доступ до курсу в LMS-системі (1 рік)
Доступ до 16 зум-сесій з менторами
PDF презентації теоретичних частин
Репозиторії коду з додатками
Окремі гілки з кожним етапом розробки, щоб ви могли чітко бачити прогрес і повторювати його у власному темпі.
Перевірка домашніх завдань
4 додатки в портфоліо
Доступ до TG-чату, де ментори будуть відповідати на питання
Додаткові сесії з менторами
Сертифікат учасника за умови проходження всього курсу
10% знижки на участь в конференціях Fwdays
Важливо! Кількість Full квитків обмежена - 17 місць.Доступна оплата частинами від Монобанку та покупка в розстрочку від Приватбанку
Якщо після першого модулю ви зрозумієте, що очікування не співпадають, ми повертаємо гроші в повному обсязі.
У зв’язку з тим, що Fwdays — українська компанія, оплата послуг відбувається у національній валюті Гривні. Орієнтовну ціну у Євро ви можете побачити на блоках цін.