онлайн-курс
Курс Front-end
(Фронт-енд)
Ми навчимо верстати сайти будь-якої складності, підготуємо до сертифікації JSE та допоможемо почати свою кар'єру в ІТ компанії

05.06.2023
старт потоку
Онлайн
формат
3,5 місяці
тривалість
26 занять
розклад
Хто такий front-end розробник?
Frontend-розробка - це дуже популярний IT-напрямок, який передбачає низький поріг входження для початківців та високий темп розвитку.
Фронтенд-розробник займається «зовнішньою» частиною сайту, тобто інтерфейсом. Він "збирає" сайт, настроює форми, кнопки, виринаючі вікна та інше.
Це другий за популярністю напрямок в ІТ серед початківців.
Це другий за популярністю напрямок в ІТ серед початківців.
Що треба знати фронтенд-розробнику?
- 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
Налаштування інструмента.
Основи 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.
Практика:
Модуль 5. Цикли та об’єкти. Об’єкти.
Цикли: for, while, do..while.
Об’єкти. Методи об’єктів.
Копіювання об’єктів та посилання.
Практика:
Модуль 6. Масиви в Javascript.
Вчимося створювати масиви.
Методи масивів.
Використання циклів.
Практика:
Модуль 7. Дані. Контекст виконання функцій. Глобальний об’єкт window.
Контекст виклика і this. Методи call, bind та apply.
Функції конструктори. Дескриптори об’єктів.
Local та Sesion storages. Дата та час.
Глобальний об’єкт window. Об’єкт лексичного оточення.
Практика:
Модуль 8. Робота з сервером. OOP.
Замикання.
Оператор try/catch/finally.
Синтаксис setTimeout/setInterval.
Як влаштований Event Loop в JavaScript.
OOP та його принципи.
Практика:
Модуль 9. DOM та асинхронний JavaScript.
Об’єкт Promise.
Функції async/await в JS.
DOM/BOM. Вибір елементів на сторінці.
Практика:
Модуль 10. NPM/Yann. Jsx. Віртуальний DOM.
NPM та Yarn. Огляд властивостей Webpack. Робота з import/export.
Огляд структури React додатку.
JSX та props: Рендеринг списків та Conditional рендеринг.
Віртуальний DOM.
Обробка подій. Контролюємі та не контролюємі компоненти.
Практика:
Модуль 11. Життєвий цикл компонентів. React Context. Портали.
Життєвий цикл компонента.
Створення ErrorBoundary.
React-router-dom.
Портали.
Практика:
Модуль 12. Основні React хуки.
Хук useState.
Хук useRef.
Хук useEffect.
Хук useMemo.
Хук useCallback.
React.memo().
Практика:
Модуль 13. React бібліотеки.
Способи стилізації React додатку:
Css modules.
Styled Components.
Redux та redux-thunk.
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, а також такі концепції кодування, як змінні, типи даних, приведення типів, оператори, взаємодія з користувачем, потік керування, функції, помилки, винятки, налагодження та усунення несправностей.

- Інформаційна сторінка: JSE Certification
- Канал доставки: OpenEDG Testing Service (TestNow™)
- Правила іспиту: JSE Testing Policies Page
На курсі діє "ЗАМОРОЗКА".
За потреби ви зможете призупинити навчання на певний час і відновити його пізніше.
За потреби ви зможете призупинити навчання на певний час і відновити його пізніше.
Як відбуватиметься навчання
- ЗАНЯТТЯ
- Практичні заняття з викладачем раз на тиждень по 180 хв + сесія питання/відповідь. Відеозаписи кожного заняття завжди доступні, ви можете повернутись до них у зручний час.
- Короткий конспект теорії до заняття.
- Домашні завдання (індивідуальні та у групі).
- Тестування після кожного модуля.
- Додатковий матеріал для самовивчення.
- Дипломна робота + захист.
- Закритий чат учнів з викладачем і куратором.
- Особистий зворотний зв’язок від викладача.
- МЕТОДОЛОГІЯ
Прогресивна методика навчання: методологія асинхронного навчання спрямована на підвищення ваших навичок до самостійної роботи та комунікації з командою.
Hard skills: Ви отримаєте увесь стек базових знань із напрямку “Frontend”.
Soft skills: Ви прокачаєте навички обробки інформації, вміння з першого дня роботи у проекті
Hard skills: Ви отримаєте увесь стек базових знань із напрямку “Frontend”.
Soft skills: Ви прокачаєте навички обробки інформації, вміння з першого дня роботи у проекті
- СУПРОВІД
У процесі навчання вас підтримуватиме команда методистів. Ви зможете поставити будь-яке запитання та отримати консультацію у внутрішньому чаті
- КАР'ЄРА
В кінці курсу вас чекає модуль з HR-ом PowerCode Academy по підготовці до співбесіди, де ви отримаєте відповіді на усі важливі питання щодо працевлаштування.
Ваші результати після курсу
Ви навчитесь:
- Розбиратися в HTML, CSS
- Робити розмітку та адаптивну кросбраузерну верстку
- Вивчите основи мови JavaScript
- Працювати з API та взаємодіяти з сервером
Опануєте інструменти:








Курс можна сплатити частинами з розтермінуванням від 3 до 12 місяців.
Приклади робіт, які виконують студенти на курсі
Відгуки про курс Frontend:
"У грудні закінчила курс Frontend у PowerCode.
Вибираючи курс, піддавалася інтуїції, бо йшла вчитися із 0.
Курс побудований дуже гідно - нічого зайвого з теорії та багато практики. Дуже великий обсяг інформації подавався на курсі та наявність відеозаписів занять виявилася величезним бонусом. Викладач - Ілля, дякую йому величезне за фідбеки та пояснення зрозумілою мовою!
Для тих, хто вибирає для себе курс – можу сміливо радити PowerCode (до речі, одного з бажаючих направила до вас) Після закінчення курсу мені запропонували взяти участь у проекті IT Nation 2.0, як ментор, чому я шалено рада! Дякую за курс і можливості!!!"
Курс побудований дуже гідно - нічого зайвого з теорії та багато практики. Дуже великий обсяг інформації подавався на курсі та наявність відеозаписів занять виявилася величезним бонусом. Викладач - Ілля, дякую йому величезне за фідбеки та пояснення зрозумілою мовою!
Для тих, хто вибирає для себе курс – можу сміливо радити PowerCode (до речі, одного з бажаючих направила до вас) Після закінчення курсу мені запропонували взяти участь у проекті IT Nation 2.0, як ментор, чому я шалено рада! Дякую за курс і можливості!!!"

"Дивився актуальні технології на ринку та хотів знайти такі курси, щоб програма відповідала критеріям ринку, але при цьому з приємним цінником. І ви підійшли повністю.
Подобалася манера офлайн навчання, а також викладач, з яким мені пощастило – на курсах дали мінімальну та зрозумілу базу, далі я самостійно заглибився у розробку та пройшов стажування у PowerCode.
Рекомендую ці курси всім початківцям, запевняю, що на ринку ви краще не знайдете)"
Подобалася манера офлайн навчання, а також викладач, з яким мені пощастило – на курсах дали мінімальну та зрозумілу базу, далі я самостійно заглибився у розробку та пройшов стажування у PowerCode.
Рекомендую ці курси всім початківцям, запевняю, що на ринку ви краще не знайдете)"

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

Порадили знайомі вашу школу + цікавився сам даним напрямком. Дуже сподобався викладач - видно, що знаючий, та вміє зрозуміло пояснювати. Вже через пару тижнів проходитиму співбесіду до IT компанії, а курс порадив би всім, хто запитав би

"Засидівся на своїй роботі, а до ІТ ще з універа була тяга. Вибирав, звичайно, за отриманими знаннями за підсумком курсу, а також за порадою друзів. Вчитель - молодий фахівець, гарний кодер. Усі приходять з одним завданням: знайти і влаштуватися на роботу в ІТ. Я не виняток. Порекомендував би курс тим людям, які шукають...
Після успішного закінчення курсів, я почав стажуватися в IT компанії PowerCode, думаю, що це стане хорошим фундаментом для початку моєї кар'єри"
Після успішного закінчення курсів, я почав стажуватися в IT компанії PowerCode, думаю, що це стане хорошим фундаментом для початку моєї кар'єри"
Олександр Філатов
Попередній
Далі
Наші викладачі
У нас у команді не просто викладачі, а наставники, практики та найкращі друзі студентів!
Олександра Рекало

Віктор Бойко

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

Вартість курсу Frontend розробник
Оплата частинами
або у розстрочку
або у розстрочку
від 1523 грн/міс
Ціна за умови
повної оплати
повної оплати
18275 грн
21500 грн
Подати заявку на тест-урок "Front-end"
Натискаючи на кнопку, я погоджуюсь на обробку персональних даних