онлайн-курс

Курс Front-end
(Фронт-енд)

Навчися робити повноцінний сайт, починаючи від макета до завантаження на хостинг та стань високооплачуваним спеціалістом в IT
20.09.2023

старт потоку

Онлайн

формат

3,5 місяці

тривалість

26 занять

кількість занять

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

Frontend-розробка - це дуже популярний IT-напрямок, який передбачає низький поріг входження для початківців та високий темп розвитку. Цей напрямок роботи не потребує глибоких знань у математиці, алгоритмах та структурах даних.

Front-end передбачає поєднання програмування з творчістю, уважністю та розумінням сучасних трендів.

Результат роботи фронтенд-розробника - це правильно працюючий сайт або додаток, який виконує передбачені замовником функціі.
Фронтенд-розробник займається «зовнішньою» частиною сайту, тобто інтерфейсом. Він "збирає" сайт, настроює форми, кнопки, виринаючі вікна та інше.

Це другий за популярністю напрямок в ІТ серед початківців.

Що треба знати фронтенд-розробнику?

  • HTML – це мова розмітки веб, CSS – каскадні таблиці стилів, JavaScript – основна мова програмування для Front End.
  • Важливо знати як мінімум один з трьох фреймворків: Angular.js, React.js, Ember.js. Саме їх використовують більшість веб студій.

Скільки заробляє фронтенд-розробник?

В середньому зарплата новачків фронтенд-розробників стартує від 400-600 $. Найчастіше за декілька років фронтенд-розробник переростає у фулстек-розробника та займається більш масштабними проектими.
1000$ - 2500$
гілка зарплат у фронт-енд розробці від Junior до Senior спеціаліста (на місяць)

Цей курс для тих, хто:

Xоче працювати в IT
Ви подолаєте шлях від людини, далекої від IT, до впевненого веб-розробника з навичками командної роботи та зможете почати кар'єру в IT
Xоче стати розробником
Ви зможете змінити професію та стати затребуваним веб-розробником і зрозумієте, як розвиватись у професії
Хоче стати високооплачуваним фахівцем
Ви отримаєте всі навички, щоб вирости до фахівця із зарплатою 3000$-5000$ та вище
Якщо ти бачиш себе серед цих людей - подавай заявку на курс

Чому студенти обирають цей курс

МЕНТОРСЬКА ПІДТРИМКА ПРОТЯГОМ ВСЬОГО КУРСУ
Наші ментори допомагають студентам освоїти не тільки hard skills, а й soft skills
МИ МАЄМО СПРАВЖНІЙ ІТ-ШНИЙ ДОСВІД
Ми самі виросли з IT компанії та беремо участь у розвитку ринку разом із ІТ Асоціацією EASE
БОНУС: БЕЗКОШТОВНИЙ КУРС АНГЛІЙСЬКОЇ ДЛЯ ІТ
Для студентів усіх курсів є факультативні заняття «English for IT»
ОПЛАТА У РОЗСТРОЧКУ АБО ЧАСТИНАМИ
Для студентів діє програма розтермінування від 3 до 12 місяців. 

Програма навчання

26 занять
практичні заняття проходять раз на тиждень по 3 години
Модуль 1. Введення в HTML і CSS. Клієнт-серверна архітектура.

Налаштування інструмента.
Основи HTML і CSS. Синтаксис.
Блочні елементи та стрічкові елементи.
Додавання тексту та його стилізація. Гіперпосилання.
Додавання графіки. Списки.
Домашнє завдання.
Тести.

Модуль 2. Прикладне використання HTML і CSS.

Створення таблиць. Робота з формами.
HTML 5 теги. Семантика.
Робота з ресурсами (іконки, шрифти, fontawesome).
Position. Flexbox. Grid.
Домашнє завдання.
Тести.

Модуль 3. Анімація та адаптивність веб сайтів.

Grid.
Анімації CSS.
Адаптивність CSS (@media).
SASS (SCSS).
Bootstrap.
Домашнє завдання (коротке відео).
Тести.

Модуль 4. JavaScript. Початок роботи з динамічними сторінками.

Вступ до JS.
Змінні. Типи даних.
Тернарний та логічні оператори.
Інструкція switch.
Цикли: for, while, do…while.
Function Declaration і Function Expression.
Анонімні функції.
Функція callback.
Функції alert, prompt, confirm.

Практика:
  • створення функціоналу для відкривання/закривання модальних вікон;
  • практичні приклади використання циклів;
  • використання alert, prompt та confirm.

    Модуль 5. Цикли та об’єкти. Об’єкти.

    Цикли: for, while, do..while.
    Об’єкти. Методи об’єктів.
    Копіювання об’єктів та посилання.

    Практика:
  • створення mock даних для магазину;
  • практичні задачі з використанням методів об’єктів та масивів.

    Модуль 6. Масиви в Javascript.

    Вчимося створювати масиви.
    Методи масивів.
    Використання циклів.

    Практика:
  • практичні задачі з використанням методів об’єктів та масивів.

    Модуль 7. Дані. Контекст виконання функцій. Глобальний об’єкт window.

    Контекст виклика і this. Методи call, bind та apply.
    Функції конструктори. Дескриптори об’єктів.
    Local та Sesion storages. Дата та час.
    Глобальний об’єкт window. Об’єкт лексичного оточення.

    Практика:
  • зберігання користувача та куплених товарів в LocalStorage;
  • використання глобального об’єкта window.

    Модуль 8. Робота з сервером. OOP.

    Замикання.
    Оператор try/catch/finally.
    Синтаксис setTimeout/setInterval.
    Як влаштований Event Loop в JavaScript.
    OOP та його принципи.

    Практика:
  • написання функціоналу для логіну юзера;
  • написання функціоналу для роботи фільтрів магазину;
  • створення класу Person.

    Модуль 9. DOM та асинхронний JavaScript.

    Об’єкт Promise.
    Функції async/await в JS.
    DOM/BOM. Вибір елементів на сторінці.

    Практика:
  • приклади використання об’єкту Promise;
  • вибір елементів на сторінці, короткий огляд бібліотеки jQuery.

    Модуль 10. NPM/Yann. Jsx. Віртуальний DOM.

    NPM та Yarn. Огляд властивостей Webpack. Робота з import/export.
    Огляд структури React додатку.
    JSX та props: Рендеринг списків та Conditional рендеринг.
    Віртуальний DOM.
    Обробка подій. Контролюємі та не контролюємі компоненти.

    Практика:
  • огляд дефолтного React проекту;
  • приклади найпростіших компонентів;
  • перенесення верстки з сайту магазину в JSX код.

    Модуль 11. Життєвий цикл компонентів. React Context. Портали.

    Життєвий цикл компонента.
    Створення ErrorBoundary.
    React-router-dom.
    Портали.

    Практика:
  • життєвий цикл компонентів; написання ErrorBoundary;
  • використання порталів для модальних вікон;
  • створення роутів для сайту магазину.

    Модуль 12. Основні React хуки.

    Хук useState.
    Хук useRef.
    Хук useEffect.
    Хук useMemo.
    Хук useCallback.
    React.memo().

    Практика:
  • написання основної логіки сайту магазину з використанням хуків, які описано вище.

    Модуль 13. React бібліотеки.

    Способи стилізації React додатку:
    Css modules.
    Styled Components.
    Redux та redux-thunk.
    Material UI.
    Formik.

    Практика:
  • приклад Css modules;
  • приклад Styled Components;
  • приклад з Redux;
  • приклад з Material UI;
  • приклад з Formik.

    Захист дипломного проекту

    Проекти:
    1. Сайт блогу з використанням HTML та CSS.
    2. Сайт інтернет магазину на чистому HTML/CSS/Js і React.js
  • Сертифікація OpenEDG js institute

    Certified Entry-Level JavaScript Programmer

    По закінченню курсу ви маєте можливість отримати ваучер на проходження европейської сертифікації від JavaScript Institute
    Сертифікація JSE (сертифікація JS розробника-початківця) – це професійний сертифікат, який вимірює здатність виконувати завдання кодування, пов’язані з основами програмування на мові JavaScript.
    Кандидат повинен продемонструвати достатні знання основних концепцій мови JavaScript, включаючи основи синтаксису та семантики JavaScript, найкращі практики програмування, інструменти та ресурси JS, а також такі концепції кодування, як змінні, типи даних, приведення типів, оператори, взаємодія з користувачем, потік керування, функції, помилки, винятки, налагодження та усунення несправностей.
    На курсі діє "ЗАМОРОЗКА".

    За потреби ви зможете призупинити навчання на певний час і відновити його пізніше.

    💻 Демо-урок курсу Frontend

    Доступ до уроку можна отримати після реєстрації нижче. Посилання на урок прийде на вказаний e-mail.

    Як відбуватиметься навчання

    • Практичні заняття з викладачем раз на тиждень по 180 хв + сесія питання/відповідь. ​​Відеозаписи кожного заняття завжди доступні, ви можете повернутись до них у зручний час.
    • Короткий конспект теорії до заняття.
    • Домашні завдання (індивідуальні та у групі).
    • Тестування після кожного модуля.
    • Додатковий матеріал для самовивчення.
    • Дипломна робота + захист.
    • Закритий чат учнів з викладачем і куратором.
    • Особистий зворотний зв’язок від викладача.
    Прогресивна методика навчання: методологія асинхронного навчання спрямована на підвищення ваших навичок до самостійної роботи та комунікації з командою.

    Hard skills: Ви отримаєте увесь стек базових знань із напрямку “Frontend”.

    Soft skills: Ви прокачаєте навички обробки інформації, вміння з першого дня роботи у проекті
    У процесі навчання вас підтримуватиме команда методистів. Ви зможете поставити будь-яке запитання та отримати консультацію у внутрішньому чаті
    В кінці курсу вас чекає модуль з HR-ом PowerCode Academy по підготовці до співбесіди, де ви отримаєте відповіді на усі важливі питання щодо працевлаштування.

    Ваші результати після курсу

    Ви навчитесь:
    Опануєте інструменти:
    Курс можна сплатити частинами з розтермінуванням від 3 до 12 місяців.

    Приклади робіт, які виконують студенти на курсі

    Відгуки про курс Frontend:

    Наші викладачі

    У нас у команді не просто викладачі, а наставники, практики та найкращі друзі студентів!

    Олександра Рекало

  • Викладач курсу Front End розробник у Powercode Academy
  • Web developer, designer, IT mentor
  • Досвід практичної роботи близько 8 років, понад 100 реалізованих проектів
  • Досвід викладання основ веб розробки понад 5 років
  • Більше ніж 1000 студентів освоїли HTML та CSS під менторством Олександри

  • Віктор Бойко

  • Викладач курсу Front End розробник у Powercode Academy
  • Expert Full-stack developer в Infopulse 15 років стажу практичної роботи
  • Останні 5 років робота над проектами TietoEVRY, однієї з найбільших скандинавських ІТ компаній
  • Брав участь в розробці системи аудитів для норвезьких нафтогазових компаній, інтелектуальних систем моніторингу для мережі японських супермаркетів та працював на одного з найбільших виробників аудіо-відео гарнітур
  • Основні стеки: JavaScript, TypeScript, Node.js, Angular, React, React Native, Electron

  • Елеонора Кормиш

  • Викладач курсу Front End розробник у Powercode Academy
  • Діючий Full-stack developer у сфері game-development
  • Магістр комп'ютерних наук
  • Основний напрямок діяльності - розробка багатофункціональних сайтів для конвертації зображень, відео та музики, обробки графічних файлів та створення графіків
  • Являється співавтором Сhrome-розширення для тестувальників
  • Основні стеки: JavaScript, jQuery, React, Vue

  • Вартість курсу Frontend розробник

    Оплата частинами
    або у розстрочку
    від 1523 грн/міс
    терміном від 3 до 12 міс
    Ціна цього місяця за сезонною знижкою
    18275 грн
    21500 грн
    при повній оплаті
    курсу Frontend
    За програмою
    лояльності
    15050 грн
    при реєстраціі вдвох
    на курс Frontend

    Подати заявку на курс "Front-end"
    та отримати консультацію

    Натискаючи на кнопку, я погоджуюсь на обробку персональних даних

    Отримати доступ до демо-уроку курсу Frontend

    Записатися на курс

    Надішліть нам ваші контакти і наш менеджер передзвонить вам, щоб відповісти на всі питання про навчання у нашій Академії

    Натискаючи на кнопку я погоджуюсь з політикою конфіденційності

    Долучайся до вебінарів
    з Frontend-розробки!

    демо-урок з курсу

    Відправлено!

    Посилання на демо-урок надіслано на e-mail, який ви вказали у формі.

    Хочу купити курс у розстрочку

    Надішліть нам ваші контакти і наш менеджер передзвонить вам, щоб відповісти на всі питання про навчання у нашій Академії

    Натискаючи на кнопку я погоджуюсь з політикою конфіденційності