Старт курсу: 26 липня

Front-end розробка

Розпочніть свій шлях в IT всього за 3 місяці інтенсивного навчання з senior front-end developer компанії N-iX Світланою Сікорою, яка брала участь у розробці застосунків для компаній Honda, Toyota і Ryanair.

Навчіться front-end розробці на практиці: створіть свій перший повноцінний вебсайт — від макета до завантаження на хостинг разом із лекторкою з досвідом викладання понад 7 років!

Реєстрацію завершено. Якщо хочете приєднатись до наступного запуску курсу, залиште свої дані і ми зв’яжемось із вами, коли реєстрація відкриється.

До завершення продажів залишилося:

До старту курсу залишилося:

  • 00днів
  • 00годин
  • 00хвилин

Що ви вивчите?

Курс дозволить отримати практичні навички — достатні, щоб знайти першу роботу за спеціальністю, а саме:

  • сформувати глибоке розуміння трьох головних технологій для front-end розробника: HTML, CSS та JavaScript;
  • розібратися в особливостях роботи браузерів;
  • заглибитись у нюанси анімації, адаптивної верстки для будь-яких пристроїв та різного роду ефектів;
  • навчитися застосовувати JavaScript для динамічності та інтерактивності вебсторінок;
  • навчитися налагоджувати front-end <=> back-end комунікацію;
  • розібратись із системою контролю версій Git для зручної спільної розробки в команді;
  • пройти шлях створення повноцінного вебсайту — від макета до завантаження на хостинг.

Формат курсу

• Відеолекції
• Практичні завдання
• Вебінари
• Чат-підтримка в Slack
• Курсовий проєкт (опційно)
• Презентації
• Тестування
• Матеріали для самостійного опрацювання
• Необмежений доступ до курсу
• Сертифікат

Тривалість

• 11 тижнів
• 20+ годин відеолекцій
• 50+ практичних завдань
• Курсовий проєкт (опційно)

Хто такий front-end розробник?

Це програміст, який відповідає за зовнішній вигляд сайтів, вебсервісів та мобільних додатків: верстку шаблонів, оформлення тексту, клієнтську логіку програмного продукту та взаємодію користувача з інтерфейсом. Без нього неможливо створити зручний та ефективний цифровий продукт.

Приєднуйтеся до числа слухачів курсу, щоб опанувати затребувану професію та розпочати свій шлях в IT. 

Чому цей курс?

Це оптимальний старт для кар’єри в IT

За умови старанного проходження курсу і виконання всіх завдань ви зможете претендувати на першу роботу вже через 11 тижнів!

Перший досвід

Під час навчання вам буде запропоновано виконати курсовий проєкт, який можна використати для портфоліо: це значно підвищить шанс на працевлаштування.

Кар’єрні перспективи

Тільки за минулий рік кількість пропозицій роботи для front-end розробників згідно з даними Dou збільшилася майже вдвічі: з 6787 до 11673.

Стабільна робота

Ви не залишитеся без роботи навіть у надзвичайних обставинах. Працюйте в офісі або вдома з будь-якої точки світу.

Сфера, що розвивається

Важко знайти компанію, не представлену в онлайні, і ця тенденція щороку лише набирає обертів. Front-end розробник потрібен кожному бізнесу, що має свій сайт.

Найкраще співвідношення ціна/якість

Гарантуємо одну з найвигідніших цінових пропозицій на ринку при незмінно високій якості освітнього продукту: ми перевіряли!

Для кого цей курс?

Початківці

які тільки розпочинають шлях у сфері IT

ІТ-спеціалісти

які бажають додати до своїх компетенцій front-end розробку

Інші спеціалісти

які хочуть змінити рід діяльності на користь більш прибуткової та перспективної роботи

Після проходження курсу ви зможете:​

створювати верстку вебсайтів та додатків для будь-яких пристроїв

створювати сайти, які будуть коректно відображатися в усіх браузерах

анімувати елементи вебсторінок

застосовувати JavaScript для динамічності та інтерактивності

писати асинхронний код на JavaScript

здійснювати запити на сервер, отримувати та опрацьовувати відповідь від нього

працювати з пакетними менеджерами та використовувати їх для підключення сторонніх модулів

працювати з Git

Навчайся в найкращих

Світлана Сікора

  • Senior front-end розробник в компанії N-iX
  • Досвід роботи у сфері front-end розробки — понад 8 років
  • Працювала над створенням вебпродуктів та гібридних мобільних застосунків для компаній Honda, Toyota, J&J, Ryanair 
  • Понад 11 000 слухачів успішно завершили її курс «Основи Web UI розробки» тільки на платформі Prometheus

Програма курсу

1. Вступний блок
  • Завдання курсу
  • Ефективна розробка: • плагіни для редактора коду • як шукати інформацію • Mozilla Developers Network • debugging
2. Як працює інтернет та веб
  • Як працює інтернет
  • Як працює веб: загальна картина
  • Як працює rendering engine браузера
3. Процес відображення вебсторінки
  • Завантаження ресурсів
  • Рендеринг, механізми рендерингу
  • DOM tree vs Render tree
  • Що блокує рендеринг
  • Ключові слова async/defer
4. HTML5
  • Кістяк HTML-сторінки
  • в деталях (base, meta, charset, viewport, keywords)
  • Важливі зміни в стандарті HTML5
  • Семантика в HTML5

5. CSS

  • CSS величезний, але без паніки!
  • Прості селектори
  • Складні селектори
  • Як порахувати важливість селектора
  • Відносні величини

6. CSS: прості властивості

  • Властивості, які застосовуються найчастіше:
    • Color (rgb, hsl, keyword, HEX)
    • Opacity
    • Background
    • Text
    • Font-family
    • Як підключити сторонні шрифти
  • Наслідування
  • Box-model
  • Властивості display
  • Позиціонування
  • Спеціальні символи

7. CSS-ефекти

  • Text-shadow
  • Box-shadow
  • Filters
  • Transition
  • Transform
  • Animation

8. CSS — Flexbox та Grid

  • Flexbox
  • Grid
  • У чому принципова різниця та як змусити їх взаємодіяти

9. CSS — гнучка верстка

  • Адаптивна та респонсивна верстка
  • Media Queries

10. CSS — Bootstrap

  • Для чого потрібен Bootstrap
  • Підключення
  • Компоненти
  • Layout та Grid system

11. JS — вступний блок

  • Що таке JS
    • Як виконується JS
    • Динамічна та слаботипізована мова
    • Середовище виконання JS має значення!
  • Еволюція JS
  • “Use strict”

12. JS під капотом

  • Як аналізується JS
  • Що відбувається всередині JS engine
  • JS code vs Browser API
  • Збирач сміття та робота з пам’яттю

13. JS — типи даних та операції з даними

  • Примітиви
  • Truthy and falthy values
  • Typeof
  • Тип Number
  • Тип String: index and length
  • Методи String
  • Primitive vs Reference value
  • Арифметика та присвоєння
  • Об’єкт Math

14. JS — Array

  • Що таке Array
  • Callback
  • Методи-ітератори:
    • map()
    • forEach()
    • filter()
    • reduce()
  • Chaining

15. JS — Object

  • Що таке Object
  • Ланцюжок властивостей
  • Перевірка існування властивості об’єкта
  • Spread operator (…)
  • Object.assign()
  • Деструктуризація

16. JS — Функції

  • Що таке Function
  • Параметри функції
  • Функції вищого порядку та callback
  • Функція як метод об’єкта
  • Функція — це об’єкт

17. JS — контекст виклику функції/методу

  • this
  • bind()
  • call(), apply()
  • Що браузер робить з this
  • Функція-стрілка та this
  • Getters, setters

18. JS — обробка помилок (error handling)

  • Для чого існує обробка помилок
  • Custom errors
  • try/catch/finally

19. JS — ООП

  • Prototype
  • Функція-фабрика
  • Функція-конструктор
  • Клас
  • Field vs property
  • Object vs Class
  • Принципи ООП:
    • Інкапсуляція:
      • Ключові слова: private, public
    • Наслідування:
      • Ключові слова: extends, super
      • Ланцюжок прототипів
    • Поліморфізм
      • Статичні методи та властивості
      • Ключове слово instanceOf
      • Вбудовані класи

20. JS — розширені концепції функцій

  • Чисті функції
  • Замикання
  • Замикання та пам’ять
  • Рекурсія та стек
  • Знайомство з регулярними виразами

21. JS — DOM

  • Що таке DOM
  • Document vs Window
  • Nodes vs Elements
  • Attribute vs Property

22. JS — пошук DOM-елементів

  • Огляд селекторів для пошуку DOM-елементів на сторінці

23. JS — обхід DOM-елементів

  • Обхід дочірніх елементів
  • Обхід батьківських елементів
  • Обхід сусідніх елементів
  • DOM traversal vs Query methods

24. JS — маніпуляції з DOM

  • Створення DOM-елементів
  • Додавання DOM-елементів до розмітки
  • Клонування DOM-елементів
  • Видалення DOM-елементів

25. JS — стилізація DOM-елементів

26. JS — DOM-події

  • Вступ до подій
  • Різні способи прослуховування подій
  • addEventListener
  • removeEventListener
  • Об’єкт “Event”
  • preventDefault() метод
  • Спливання та занурення (bubbling and capturing)
  • stopPropagation() метод
  • Делегування події
  • Події та ключове слово “this”
  • Підтримувані типи подій (інтерфейсні події — mouseover/out, mouseenter/leave, keydown та keyup, scroll; події форми focus, blur, submit; події завантаження документів та ресурсів DOMContentLoaded, load, beforeunload, unload, onload та onerror)

27. JS — Browser API

  • BOM vs DOM:
    • History
    • Location
    • Navigation
  • Browser API в деталях
  • Дані користувача, які не приховати
  • Web Storage:
    • Cookies
    • LocalStorage
    • SessionStorage
    • IndexedDB
  • Дата і час

28. JS — асинхронність

  • Синхронність та асинхронність
  • Таймери: setTimeout(), setInterval()
  • Цикл подій (event loop)
  • Порядок виконання (execution order)
  • setTimeout(0)

29. JS — Promises

  • Що таке об’єкт Promise
  • Ланцюжок промісів
  • Обробка помилок
  • Async/await
  • Обробка помилок для async/await
  • Async/await vs Promise
  • Promise.race(), Promise.all()

 

30. JS — робота з сервером

  • Знайомство з HTTP/HTTPS
  • Як працює веб з погляду роботи з сервером
  • HTTP-запити в циклі подій
  • HTTP-методи
  • Знайомство з об’єктом
  • XmlHTTPRequest
  • GET-запит
  • JSON
  • Промісифікація HTTP-запитів
  • POST запит
  • DELETE запит
  • Response status codes
  • Обробка помилок

31. JS — Fetch API

  • Знайомство з Fetch API
  • Headers
  • Обробка помилок
  • XmlHTTPRequest vs fetch

 

34. JS — ES6 Modules

  • Як розділити код на модулі
  • Перші кроки до JS Modules
  • npm server
  • Ключові слова export/import

35. Git

  • Системи контролю версій
  • Робота з Github

36. Інше

  • Deployment (Webhosting)
  • Chrome Developer Tools
  • Поради по стилю коду:
    • Variable Naming and Conventions
    • зарезервовані слова
    • Code Quality and Best Practices
  • Огляд бібліотек та фреймворків
  • Mobile огляд
  • Backend огляд

Вартість курсу

Рання реєстрація до 12 червня

10% прибутків від продажів буде перераховано на потреби ЗСУ.

Standard
4800 грн
  • 11 тижнів
  • 200+ відеороликів
  • 20+ годин відео
  • чат-підтримка з лектором
  • курсова робота для портфоліо (опційно)
  • додаткові матеріали
  • презентації, тестування
  • необмежений доступ до курсу
  • іменний сертифікат
Нагадати про старт
Premium
6200 грн
  • 11 тижнів
  • 200+ відеороликів
  • 20+ годин відео
  • чат-підтримка з лектором
  • курсова робота для портфоліо (опційно)
  • додаткові матеріали
  • презентації, тестування
  • необмежений доступ до курсу
  • іменний сертифікат
  • вебінар у форматі «Питання - Відповідь» із лектором курсу
  • вебінар на тему «Ефективний пошук роботи front-end розробника»
Нагадати про старт
Стипендія
0 грн
  • 200 стипендій для ВПО, військових та постраждалих від війни
  • 100% компенсації
  • Пакет "Premium"
  • 8 серпня старт потоку
Нагадати про старт

Вартість пакету для команд

Для придбання курсу за спеціальними умовами надішліть реквізити та інформацію про кількість осіб на пошту support-plus@prometheus.org.ua або у Facebook — ми підготуємо для вас персональну пропозицію.

3-10 осіб
-10%
11-20 осіб
-20%
20+ осіб
-30%

Відгуки

Немає. Головне, щоб у студента було бажання пройти курс до кінця і застосувати набуті знання на практиці.

Бажано мати базові знання з HTML/CSS/JS. В ідеалі — пройти безкоштовний курс «Основи WEB UI розробки 2022».

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

Як проходить навчання

Prometheus це

0
Слухачів
0 +
онлайн-курсів
0
виданих сертифікатів
0
років у сфері освіти

Нагадайте про старт




    Співробітники цих компаній навчаються в нас