Курси Frontend Developer: HTML та CSS

Добірка кращих курсів Frontend Developer, що познайомлять вас з сучасними практиками розробки сайтів. Ви зможете засвоїти з нуля основні технології для верстки сайтів: HTML, CS, JavaScript та Bootstrap. Досвідчені Frontend розробники також знайдуть для себе підходящі навчальні програми.
Читати далі

Порівняння усіх курсів

Фільтр
Відеокурс / Платформа
Рекомендуємо
Формат
Online
Початок навчання
Будь-який момент
Тривалість
10 занять
Рівень
Для початківців
Мова навчання
Ukrainian
Вартість
уточнюйте
Гнучкий графікРеальний проект у портфоліо
Robot Dreams
  • Frontend
Подробиці

Курс, який навчить писати чистий код на JavaScript, працювати з розміткою, блоковою, табличною та модульною версткою, адаптувати екрани під різні формати та самостійно створювати сайти та додатки на JS

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

Знайомство з HTML та структурою веб сторінок

  • Дізнаєтеся, з яких елементів складається сайт
  • Ознайомитеся зі змістом та розміткою вебсторінок
  • Налаштуєте редактор коду та корисні розширення
  • Опануєте базові теги та атрибути

Таблиці, списки та форми

  • Розберетеся в особливостях блокової та табличної верстки та сферах їхнє застосування
  • Навчитеся створювати текстові блоки, вставляти посилання та розміщувати зображення
  • Вибудуєте навігацію на сторінці за допомогою посилань-якорів
  • Навчитеся створювати форми та їхні елементи

Вступ до CSS

  • Ознайомитеся зі стилями та навчитеся додавати їх на HTML-сторінку
  • Дослідите відносні та статичні одиниці виміру
  • Навчитеся підключати шрифти
  • Опануєте модульну систему верстки Grid та технологію позиціювання елементів Flexbox
  • Підключите CSS-бібліотеки

Інструменти CSS та робота з хостингом

  • Протестуєте роботу з редактором VS Code
  • Навчитеся працювати із системами контролю версій GitHub, Gitlab, Bitbucket etc, а також із хостингом Github Pages
  • Розмістите свій вебсайт в інтернеті

Верстка та робота з макетами

  • Навчитеся виділяти логічні блоки в макеті
  • Створите змінні для кольорів та шрифтів
  • Ознайомитеся з різними видами верстки та навчитеся адаптувати сторінку під різні пристрої
  • Вивчите властивості різних браузерів та поняття кросбраузерності

Основи JavaScript: структура коду, типи даних та основні оператори

  • Навчитеся підключати JavaScript до вебсторінки різними способами
  • Вивчите змінні, типи даних та перетворення типів
  • Навчитеся працювати з умовними операторами

Основи JavaScript: об'єкти, масиви, цикли та функції

  • Вивчите властивості та методи об'єктів та масивів
  • Навчитеся працювати з колекціями Map та Set, WeakMap, WeakSet
  • Розберетеся в роботі циклів і навчитеся перебирати дані для написання бізнес-логіки програм
  • Вивчите види функцій та зрозумієте, як вони допомагають повторно використовувати код

ООП JavaScript: класи ES5 і ES6

  • Зрозумієте, що таке прототипне успадкування
  • Навчитеся користуватися функціями конструктора
  • Вивчите класи ES6
  • Напишете власні класи

ООП в JavaScript: відмінності від інших мов

  • Навчитеся застосовувати ключове слово this та контекст виклику
  • Вивчите основні відмінності ООП JavaScript від ООП в інших мовах
  • Спробуєте розбити код на незалежні модулі

Запити, обробка подій та введення користувача

  • Навчитеся налаштовувати та надсилати AJAX-запити
  • Навчитеся створювати DOM-елементи та додавати їх на сторінку
  • Напишете правильний запит та отримаєте дані із сервера
  • Навчитеся обробляти події користувача

Особливості курсу

  • JavaScript
  • Frontend
  • Навички
  • Кар'єра
  • Бонус: підписка на WebStorm від JetBrains

Викладачі курсу

Владислав Бурденюк - Senior Software Engineer в Allset

Більше інформації
Курс
Формат
Online
Початок навчання
16.01.2024
Тривалість
41 занять
Рівень
Для початківців
Мова навчання
Ukrainian
Вартість
уточнюйте
Вечірні заняттяСупровід ментораРеальний проект у портфоліо
Robot Dreams
  • Frontend
Подробиці

Курс Frontend Developer враховує сучасні потреби ринку та скіли, які підвищують шанс на отримання оферу - від верстання інтерфейсів завдяки HTML/CSS до написання коду на JavaScript та підвищення продуктивності за допомогою ReactJS та Next.js

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

Frontend/HTML/CSS/JS/GIT

  • Розумітимете роль та функції Frontend-розробника
  • Розглянете технології та мови - HTML / CSS / JavaScript
  • Ознайомитеся з інструментами розробки - IDE, DevTools
  • Дізнаєтеся, що таке система контролю версій Git

Вступ. Основи Web-розробки

  • Дізнаєтесь основні принципи роботи веббраузерів
  • Зрозумієте значення кросбраузерності та основні відмінності в інтерпретації ними
  • Розрізнятимете завдання веброзробника, пов'язані з роботою в клієнтській частині вебзастосунків
  • Зрозумієте принцип роботи з системою контролю версій Git
  • Матимете актуальний акаунт на GitHub та створений репозиторій для роботи з курсом

Мова розмітки HTML

  • Дізнаєтеся, як створювати структуру HTML-документа, включно із заголовком, тілом, розділами, абзацами, списками та формами
  • Використовуватимете семантичну розмітку
  • Застосовуватимете різні теги та атрибути для форматування тексту, створення посилань, вставки зображень та інших елементів

Основи розробки на JavaScript

  • Вивчите основи JS, навчитеся працювати із function, callbacks, prototype, а також із глобальними об'єктами document, window, navigator
  • Дізнаєтеся, що таке HTML5 API та доступні його різновиди
  • Застосовуватимете кожен із запропонованих API

Робота з CSS

  • Знатимете різні типи відтворення, методів позиціювання
  • Працюватимете з текстом, кольором, фоном та технологією Flexbox

Анатомія вебзастосунків. Основи принципів UI/UX

  • Створюватимете макети зі статичною або адаптивною сіткою (layout anatomy)
  • Орієнтуватиметеся в принципах UI/UX-дизайну
  • Проєктуватимете зручну для сприйняття розмітку вебзастосунку (сайту)

Робота з SASS (SCSS) препроцесором

  • Використовуватимете пакетний менеджер yarn для встановлення пакетних залежностей, додаткових бібліотек, модулів
  • Підключатимете SASS-препроцесор до проєкту, використовуватимете змінні, міксини, цикли та інші функціональності SCSS

Вступ до розробки на JavaScript

  • Використовуватимете структуру коду, змінні, типи даних
  • Здійснюватимете логічні порівняння та ухвалюватимете рішення на основі результатів цих порівнянь
  • Виконуватимете операції або обробку даних на основі визначених умов
  • Матимете знання щодо створення функції, а також функцій, які можна призупинити й відновити під час виконання
  • Знатимете, як використовувати обробники подій (event handlers)

Поглиблення в розробку на JavaScript: структури даних

  • Працюватимете з різними типами структур даних, як-от масиви (Array), об'єкти (Object)
  • Створюватимете багаторівневі структури даних, наприклад, масиви об'єктів або об'єкти, що містять інші об'єкти
  • Використовуватимете об'єкти Set, Map та Object для збереження та обробки даних
  • Зможете маніпулювати з масивами, використовуючи методи, як-от push, pop, shift, unshift, splice
  • Використовуватимете об'єкт Reflect для виконання різних операцій: створення нових об'єктів, виклик методів, отримання та встановлення властивостей тощо

Поглиблення в розробку на JavaScript: робота з мережею

  • Розроблятимете базове RESTful API, використовуючи різні HTTP-методи, як-от GET, POST, PUT, DELETE
  • Орієнтуватиметесь, які URL-шаблони використовують для маршрутизації запитів
  • Використовуватимете Fetch API для відправлення HTTP-запитів з клієнтської сторони вебзастосунку
  • Працюватимете з Promise для управління асинхронним кодом
  • Використовуватимете async-await для зручного написання асинхронного коду
  • Налагоджуватимете мережеві запити за допомогою DevTools

ООП-програмування

  • Зрозумієте основні концепції ООП - класи, об'єкти, спадкування, поліморфізм, інкапсуляція
  • Навчитеся використовувати кожну концепцію на практиці

Патерни проєктування

  • Знатимете основні патерни проєктування, які допомагають розробляти ефективний і підтримуваний код
  • Зрозумієте значення патернів у проєктуванні вебзастосунків

Принципи програмування

  • Ознайомитеся з принципами програмування
  • Матимете достатньо знань, щоб писати чистий та зрозуміли код
  • Знатимете, як не допустити повторень у своєму коді, аби зекономити час та ресурси на розробку

Методи генерації вебсторінок

  • Вивчите типи вебрендерингу та навчитеся їх розрізняти
  • Навчитеся вибирати тип рендерингу залежно від ситуації

Розробка на ReactJS

  • Ознайомитеся зі структурою React-застосунку та його основними компонентами
  • Працюватимете з JSX (розширення синтаксису JavaScript) для опису інтерфейсу користувача

Поглиблення в розробку на ReactJS

  • Розумітимете роботу із хуками, чітко розрізнятимете їхні типи за призначенням
  • Набуде навичок у створенні Custom Hooks
  • Вмітимете працювати з React Router

Розробка на ReactJS. Знайомство з бібліотекою Redux

  • Розберетеся в глобальному та локальному контексті в ReactJS
  • Розглянете бібліотеку Redux для керування станом додатка

UI/UX frameworks

Отримаєте знання з Bootstrap та Tailwind CSS, щоб використовувати їх у розробці вебінтерфейсів.

Розробка на JavaScript: створення вебзастосунку

  • Матимете практичні навички та рекомендації щодо розробки SPA-застосунку на рівні реального вебзастосунку з використанням ReactJS
  • Застосовуватимете SCSS та фреймворк Tailwind (або Bootstrap)
  • Використовуватимете CSR (Client-Side Rendering)
  • Розробите повноцінний single-page application із керуванням стану та використанням CSS Framework

JavaScript Server-Side. Next.js

  • Розберете принципи серверного рендерингу та можливості Next.js для побудови універсальних вебзастосунків
  • Зрозумієте особливості Data fetching: getServerSideProps, getStaticProps, getStaticPaths, та дізнаєтеся, для чого і коли використовувати кожен з них
  • Дізнаєтеся, як працювати з NextJS
  • Навчитеся описувати внутрішнє API для повернення JSON-даних із сервера
  • Навчитеся використовувати картинки на рівні SSR із Next.js, працювати з LazyLoading і кешуванням

JavaScript Server-Side. Next.js Practice

  • Отримаєте практичні навички з розробки server-side application із використанням Next.JS
  • Навчитеся підключати фреймворки для стилізації за типом Tailwind і налаштовувати кастомні теми
  • Навчитеся працювати з маршрутизатором, кешуванням, SSR і CSR на практиці
  • Матимете практичні навички використання SSR, CSR

Vercel. Деплоймент проєкту

  • Дізнаєтеся, як створювати git репозиторію з підключенням до системи деплоймента
  • Навчитеся налаштовувати деплоймент репозиторію з вебзастосунком на рівні Vercel
  • Навчитеся використовувати змінні через PullRequest у GitHub

Підбивання підсумків. Поширені запитання на технічній співбесіді

  • Розумієте кожен етап створення вебзастосунку: від ідеї - до деплойменту
  • Можете самостійно створити повноцінний вебзастосунок з нуля

Особливості курсу

  • Топовий інструментарій розробки
  • Оформлення та розширення портфоліо
  • HR-консультація

Викладачі курсу

Андрій Римарук - Senior JavaScript Frontend Developer at Welltech

Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
12 місяців
Рівень
Для початківців
Мова навчання
Ukrainian
Вартість
42 500 UAH за курс
Вечірні заняттяВидається диплом/сертифікатСупровід ментораРеальний проект у портфоліо
IT STEP Academy
  • Frontend
Подробиці

Ви почнете з основ верстки HTML та CSS. Вивчите JavaScript та фреймворки, а до кінця курсу навчитеся робити веб-сторінки та корпоративні сервіси. Отримаєте досвід роботи в команді та почнете кар'єру веб-розробника.

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

Введення у Web. Структура HTML

  • Введення у предмет
  • Введення в мову розмітки. Мова розмітки гіпертексту HTML
  • Правила запису тегів та їх атрибутів у стандарті HTML5. Синтаксичні відмінності HTML4, XHTML, HTML5
  • Основні помилки у записах тегів
  • Структура документа HTML5
  • Кодування сторінки та meta-теги
  • Класифікація тегів: лінійні та блокові
  • Модель форматування тексту: заголовки та абзаци. Елементи p, h1..h6. Вирівнювання тексту блокових елементів: атрибут align
  • Класифікація тегів: логічне та фізичне форматування
  • Практика: створення найпростішої web-сторінки

Форматування за допомогою CSS

  • CSS - каскадні таблиці стилів
  • Теги без форматування div - блоковий, span - лінійний
  • Аналогія HTML та CSS на прикладі лінійних та блокових тегів
  • Додаткові властивості CSS для форматування тексту: letter-spacing, line-height, text-intend, text-transform, white-space, word-spacing
  • Використання атрибутів class та id для завдання стилів
  • Використання зовнішніх CSS-файлів стилів
  • Практика: форматування тексту за допомогою CSS
  • Створення списків
  • Створення вкладених списків
  • Форматування списків за допомогою CSS
  • Списки визначень: dl, dd, dt
  • Управління відступами та полями
  • Практика створення списків

JavaScript та бібліотека jQuery

  • Введення в JavaScript
  • Об'єкт. Масиви. Об'єкт Array. Терміни. Об'єкти String, Date, Math. Введення в об'єкт. Введення в об'єктно-орієнтоване програмування
  • Опрацювання подій
  • Browser Object Model. Document Object Model
  • Форми
  • Перевірка достовірності форм. Використання куків
  • Малювання за допомогою canvas, підтримка медіа-можливостей
  • JSON, AJAX
  • ECMAScript 6, ECMAScript 11
  • Модульне тестування
  • Структурні патерни
  • Патерни проєктування
  • Патерн MVS
  • Принципи проєктування класів Solid
  • Введення у jQuery. Події jQuery. Стилі та анімація. Взаємодія із DOM. AJAX та jQuery
  • Командна праця. Управління програмними проєктами

Використання фреймворку Angular, React

  • NodeJS
  • Складання проєктів за допомогою Webpack та інших інструментів
  • Angular
  • React

Особливості курсу

  • Заняття 2 рази на тиждень по 2 пари
  • Структурована подача знань
  • Підтримка викладачем
  • Готовий проєкт для портфоліо
  • Підготовка до працевлаштування
Більше інформації
Відеокурс / Платформа
Формат
Online
Початок навчання
Будь-який момент
Тривалість
7 днів
Рівень
Для дітей
Мова навчання
Ukrainian
Вартість
320 UAH за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментораРеальний проект у портфоліо
GoITeens
  • Frontend
  • WEB Developer / Webmaster
Подробиці

Вивчіть основи HTML/CSS, JavaScript та запустіть свій перший сайт.

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

За тиждень кожен охочий зробить власний сайт-календар. За допомогою HTML/CSS можна візуалізувати 3 цілі, а також список навичок, необхідних для їхньої реалізації. А за допомогою JavaScript - динамічні графіки.

Урок 1. Знайомство з HTML/CSS/JavaScript. Налаштування редактору коду

Виконуємо перші завдання з програмування у тринажері. Завантажуємо і налаштовуємо редактор коду VS Code.

Урок 2. Робота з зображеннями та посиланнями. Запуск проєкту в редакторі

Практикуємо HTML/CSS/JavaScript в тринажері для створення фотографій і посилань на власному сайті. Запускаємо свій готовий проєкт в редакторі VS Code.

Урок 3. Фінальне налаштування проєкту. Публікація сайту на хостингу

Оформлюємо дошку бажань, використовуючи власний контент: фотографії, текст, цифри. Завантажуємо фінальний проєкт на хостинг Netlify.

Особливості курсу

  • Всі завдання в одному місці
  • Доступ назавжди
  • Спільнота найкращих
  • 3 відеоуроки
  • 6 практичних занять
  • Сертифікат
  • Технічна підтримка впродовж всього курсу
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
12 місяців
Рівень
Для дітей
Мова навчання
Ukrainian
Вартість
уточнюйте
Гнучкий графікСупровід ментораРеальний проект у портфоліо
GoITeens
  • Frontend
Подробиці

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

Опис курсу

IT-сфера може стати надійним трампліном для професійного зростання вашої дитини

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

Програмування Front-end в академії GoITeens - для дітей, які:

  • Цікавляться IT-технологіями та полюбляють сидіти за комп'ютером
  • Хочуть оволодіти практичними навичками
  • Хочуть досягти успіху у майбутньому

У результаті навчання ваша дитина:

  • Навчиться розбиратися в сучасних технологіях та розвине кругозір
  • Засвоїть навики розробки сайтів та зможе заробляти на цьому у майбутньому
  • Удосконалить комунікативні навички, вміння працювати в команді та доводити справи до кінця
  • Розкриє творчий потенціал та креативність, навчиться придумувати та реалізовувати свої ідеї
  • Навчиться виступати на публіку, оформлювати та презентувати свої думки
  • Знайде однодумців, які прагнуть розвиватися та вдосконалювати навички

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

Засвоєння Tech Skills

  • Вивчення роботи з HTML, CSS
  • Мова розмітки HTML5
  • Каскадні таблиці стилів CSS3 та технологія FlexBox
  • Система контролю версій та хостинг GitHub
  • Псевдокласи та псевдоелементи
  • Створення динамічних сайтів та Web-додатків
  • Мова програмування JavaScript
  • Оператор вибору та цикли
  • Масиви. Обчислення рядів даних
  • Написання зручного та ефективного коду програм
  • Document Object Model
  • Створення віджетів на сайтах та односторінкових додатків

Засвоєння Soft Skills

  • Робота в команді
  • Лідерство
  • Основи планування і цілепокладання
  • Тайм-менеджмент
  • Критичне мислення
  • Публічні виступи і самопрезентація
  • Ведення переговорів і комунікація
  • Брейншторм
  • Проєктний менеджмент
  • Методології Agile/Scrum

HSP-підхід до навчання

Це методологія за якою навчають Microsoft, Google, Apple та Amazon.

  • Hard Skills - Знання та навички програмування для створення власних проєктів
  • Soft Skills - Навички взаємодії між людьми для роботи та у звичайному житті
  • Projects - Всі навички відточуються під час створення власного проєкту

Власна формула навчання

  • 10% - теорія. Цього достатньо, щоб учні зрозуміли, як робити перші кроки в веб-розробці
  • 70% - практика. Загальні знання та навички учні отримуватимуть саме під час створення проєкту
  • 20% - зворотній зв'язок. Наші вчителі та ментори завжди підказують напрямок дій, щоб учень зміг зробити проєкт власноруч

Графік занять

Ви можете обрати зручний графік для своєї дитини:

  • 1 раз на тиждень у вихідні
  • 2 рази на тиждень у будні ввечері

Тривалість занять

  • 1,5 години уроки з програмування
  • 1 раз на тиждень заняття з Soft Skills

Як проходить безкоштовний пробний урок

На уроці ви і ваша дитина:

  • Познайомитеся з викладачем
  • Дізнаєтеся, як проходить навчання онлайн
  • Зрозумієте чи цікаво вивчати дитині Front-end
  • Приймете рішення щодо подальшого навчання

Як проходять заняття

  • Діти повторюють попередню тему, аналізують домашні роботи
  • Вивчають нову тему
  • Виконують практичні цікаві завдання як самостійно, так і в групах, під наглядом викладача
  • Підбивають підсумки, повторюють тему, отримують домашнє завдання

Чому GoITeens?

  • Контроль якості навчання та підтримка учнів
  • Максимум практики та простих завдань
  • Постійний зворотній зв'язок з батьками

Викладачі курсу

  • Софія Максимова - Викладач Soft Skills
  • Віктор Сташко - Викладач Front-end
  • Юлія Царьова - Викладач Soft Skills
  • Володимир Паньків - Викладач Front-end
Більше інформації
Курс
Формат
Online
Початок навчання
22.04.2024
Тривалість
6 місяців
Рівень
Для початківців
Мова навчання
Ukrainian, English
Вартість
32 000 UAH за курс
Вечірні заняттяВидається диплом/сертифікатМожливе працевлаштуванняСупровід ментораРеальний проект у портфоліо
GoIT
  • Frontend
Подробиці

Програма навчання Junior Frontend Developer. На онлайн-курсі ти навчишся створювати інтерфейси вебсайтів та застосунків

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

Програма навчання Junior Frontend Developer. На онлайн-курсі ти навчишся створювати інтерфейси вебсайтів та застосунків

HTML та CSS

  • Основи HTML. Теги й атрибути. Семантика
  • Основи CSS. Селектори. Колір
  • Оформлення тексту й шрифти
  • Блочна модель. Flexbox
  • Фон і декоративні елементи
  • Позиціонування елементів
  • Трансформації. Переходи та анімація
  • Форми
  • Респонсівна верстка та адаптивна графіка
  • Методології. Препроцесори
  • +2 особистих і 1 командний проєкт

JavaScript

  • Змінні та типи даних. Відгалуження. Цикли
  • Масиви. Функції
  • Об’єкти. Операції rest і spread
  • Масиви: методи перебирання
  • Ключове слово this. Прототипи й класи
  • DOM та події
  • Патерни й оптимізація подій
  • Інфраструктура проєктів. Вебсховище
  • Асинхронність і Date. Проміси
  • Взаємодія з бекендом
  • CRUD. Асинхронні функції
  • +1 командний проєкт

Soft skills

  • Філософія Agile
  • Методологія Scrum
  • Робота в команді
  • Тайм-менеджмент
  • Аналітика проєктівпроєктів
  • English speaking club (пакет Plus)
  • Робота з EnglishDom Wordsз EnglishDom Words
  • Заняття з працевлаштуванняз працевлаштування
  • Складання грамотного резюме
  • Створення сторінки на LinkedIn
  • Написання мотиваційного листа
  • Майданчики для пошуку роботи
  • Підготовка до HR-інтерв’ю
  • Підготовка до технічного інтерв’ю
  • Комунікативні навички
  • Тестові співбесіди

Особливості курсу

  • Вечірні заняття (17:30 - 21:30)
  • 2-3 вебінари на тиждень
  • Кабінет my.goit
  • Спілкування в чаті

Викладачі курсу

  • Діма Рябовол - Markup Developer в Studytube
  • Вова Мельник - Frontend Lead в GoIT
  • Андрій Данилко - Senior Frontend Developer в GoIT
  • Саша Вєнік - Senior Frontend Engineer в Compstack
  • Гері Горват - Senior Frontend Developer в TEAM International
  • Денис Мещеряков - Senior JavaScript Developer в SevenPro
  • Льоша Рєпін - Senior Frontend Developer в GoIT
  • Ярослав Косиця - Senior Frontend Developer в GoWeb
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
5 місяців
Рівень
Для початківців
Мова навчання
Ukrainian, English
Вартість
безкоштовно
Заняття цілий деньВидається диплом/сертифікатМожливе працевлаштуванняСупровід ментораРеальний проект у портфоліо
Mate academy
  • Frontend
Подробиці

На курсі Front-end ти опануєш всі сучасні технології веброзробки й знайдеш омріяну роботу. Після курсу ти вмітимеш проєктувати сайти під будь-який пристрій, працювати з React.js, Redux, Typescript та багато іншого.

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

Javascript Basics

  • Introduction
  • Main Concepts
  • Data Types
  • Numbers
  • Strings
  • Boolean
  • Functions
  • Conditional Operators
  • Loops
  • Working With Strings
  • Array Basics
  • Extra Tasks

HTML + CSS Basics

  • Environment Setup
  • HTML Basics
  • CSS Basics
  • Colors and Fonts
  • Box Model Basics
  • Semantic Basics
  • Responsiveness Basics
  • CSS Selectors
  • Pseudo-Elements and Pseudo-Classes
  • Specificity
  • Links and URLs
  • Images
  • Media Queries
  • Forms
  • Position
  • Extra topics

Git and Terminal

  • Environment Setup
  • Command Line Basics
  • Git Basics
  • Working With Branches
  • Working With Remote Repo (GitHub)

HTML + CSS Advanced

  • Environment Setup
  • Flexbox
  • BEM
  • Sass
  • Transformations and Animations
  • Grid
  • Landing [Portfolio Project]
  • HTML and CSS Practice
  • Document and Events

Javascript Basics Extended

  • Code Style
  • Working With Numbers
  • Loops in Details
  • Working With Strings
  • Functions Revisited
  • Switch
  • Type Conversion
  • Logical Operators
  • Object Basics
  • Extended Extra

Javascript Advanced

  • How to Solve Tasks on Github
  • Object Advanced
  • Methods
  • Array Methods
  • Callbacks
  • Array Iteration Methods
  • Array Iteration Methods Practice
  • Closures
  • JS Practice
  • Prototype
  • Constructors
  • Classes
  • Extra

TypeScript

  • Introduction
  • Basic Types
  • Advanced Types
  • Object Types
  • Classes
  • Extras

React

  • Introduction
  • Props
  • Rendering Lists
  • Handling Events
  • List Manipulation
  • Lifting State Up
  • Updating State
  • React with Typescript
  • Class Components
  • Forms
  • Advanced Hooks
  • Custom Hooks
  • Loading Data From API
  • Updating Data on Server
  • React Router
  • Working With URLSearchParams
  • Deployment
  • Portfolio

Employment

  • Introduction
  • Preparing Your Resume
  • Preparing Your Cover Letter
  • Common HR Interview Questions
  • Creating Your LinkedIn Profile
  • Other Profiles
  • How to Find Vacancies
  • How to Find Recruiters' Contacts
  • How to Apply for a Job in the Right Way
  • Creating Your Djinni Profile
  • Interview Preparation

Redux

  • Redux Main Concepts
  • React Redux
  • Redux Toolkit
  • Redux Without Typescript
  • Secret sauce

How the Web Works

  • Introduction to the web
  • OSI model
  • HTTP
  • Encryption
  • API interface
  • Security in the Web

Algorithms and Data Structures

  • Main Concepts
  • Algorithm Complexity
  • Data Structures: Array
  • Search Algorithms
  • Data Structures: Linked List
  • Data Structures: Stack
  • Data Structures: Queue
  • Data Structures: Hash Map
  • Data Structures: Hash Set

Object Oriented Programming

  • Basic Principles
  • SOLID Principles

Vue.js

  • TodoApp with Vue.js

Angular

  • Angular Basics

Tech Interview

  • DOM Basics
  • DOM Styling and Sizing
  • Events
  • DOM Practice
  • Promises

Особливості курсу

  • Графік навчання в будні (9:00 - 18:00)
  • Проходження відбору на курс
  • Онлайн підтримка щодня
  • Ком'юніті студентів
  • Кар'єрна підтримка впродовж 3 років

Викладачі курсу

  • Artem Topolskyi - Communications / Calendar Team Lead
  • Misha Hrynko - Fullstack Coach
  • Anna Tkachenko - Fullstack developer / Coach
  • Ihor Karpyn - Fullstack developer / Coach
  • Oleksii Blezniuk - Fullstack developer / Mentor
  • Ihor Nahnybida - Fullstack developer / Mentor
  • Alina Matuschak - Fullstack developer / Mentor
  • Paul Timofejev - Fullstack developer / Coach
  • Mykola Koval - Fullstack developer / Mentor
  • Nazar Muliar - Fullstack developer / Mentor
  • Bohdan Maksymiuk - Fullstack developer / Mentor
  • Volodymyr Pavlenko - Fullstack developer / Coach
  • Halyna Stefura - Frontend Student Coordinator
  • Alexandra Protyanova - Fullstack developer / Coach
  • Artur Ermolenko - FE Mentor
  • Yurii Holiuk - LMS Team Lead
  • Denys Cheporniuk - Activation Team Lead
  • Nadiia Martynets - Students Coordinator
  • Volodymyr Kryvytskyi - Retention Team Lead
Більше інформації
Курс
Формат
Online
Початок навчання
Будь-який момент
Тривалість
6 місяців
Рівень
Для початківців
Мова навчання
Ukrainian, English
Вартість
44 740 UAH за курс
Гнучкий графікВидається диплом/сертифікатМожливе працевлаштуванняСупровід ментораРеальний проект у портфоліо
Mate academy
  • Frontend
Подробиці

На курсі Front-end ти опануєш всі сучасні технології веброзробки й знайдеш омріяну роботу. Після курсу ти вмітимеш проєктувати сайти під будь-який пристрій, працювати з React.js, Redux, Typescript та багато іншого.

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

Javascript Basics

  • Introduction
  • Main Concepts
  • Data Types
  • Numbers
  • Strings
  • Boolean
  • Functions
  • Conditional Operators
  • Loops
  • Working With Strings
  • Array Basics
  • Extra Tasks

HTML + CSS Basics

  • Environment Setup
  • HTML Basics
  • CSS Basics
  • Colors and Fonts
  • Box Model Basics
  • Semantic Basics
  • Responsiveness Basics
  • CSS Selectors
  • Pseudo-Elements and Pseudo-Classes
  • Specificity
  • Links and URLs
  • Images
  • Media Queries
  • Forms
  • Position
  • Extra topics

Git and Terminal

  • Environment Setup
  • Command Line Basics
  • Git Basics
  • Working With Branches
  • Working With Remote Repo (GitHub)

HTML + CSS Advanced

  • Environment Setup
  • Flexbox
  • BEM
  • Sass
  • Transformations and Animations
  • Grid
  • Landing [Portfolio Project]
  • HTML and CSS Practice
  • Document and Events

Javascript Basics Extended

  • Code Style
  • Working With Numbers
  • Loops in Details
  • Working With Strings
  • Functions Revisited
  • Switch
  • Type Conversion
  • Logical Operators
  • Object Basics
  • Extended Extra

Javascript Advanced

  • How to Solve Tasks on Github
  • Object Advanced
  • Methods
  • Array Methods
  • Callbacks
  • Array Iteration Methods
  • Array Iteration Methods Practice
  • Closures
  • JS Practice
  • Prototype
  • Constructors
  • Classes
  • Extra

TypeScript

  • Introduction
  • Basic Types
  • Advanced Types
  • Object Types
  • Classes
  • Extras

React

  • Introduction
  • Props
  • Rendering Lists
  • Class Components
  • Handling Events
  • Updating State
  • List Manipulation
  • Hooks
  • Forms
  • Lifting State Up
  • Advanced Hooks
  • Custom Hooks
  • Loading Data From API
  • Updating Data on Server
  • React Router
  • Working With URLSearchParams
  • Deployment
  • Portfolio

Employment

  • Introduction
  • Preparing Your Resume
  • Preparing Your Cover Letter
  • Common HR Interview Questions
  • Creating Your LinkedIn Profile
  • Other Profiles
  • How to Find Vacancies
  • How to Find Recruiters' Contacts
  • How to Apply for a Job in the Right Way
  • Creating Your Djinni Profile
  • Interview Preparation

Redux

  • Redux Main Concepts
  • React Redux
  • Redux Toolkit
  • Redux Without Typescript
  • Secret sauce

How the Web Works

  • Introduction to the web
  • OSI model
  • HTTP
  • Encryption
  • API interface
  • Security in the Web

Algorithms and Data Structures

  • Main Concepts
  • Algorithm Complexity
  • Data Structures: Array
  • Search Algorithms
  • Data Structures: Linked List
  • Data Structures: Stack
  • Data Structures: Queue
  • Data Structures: Hash Map
  • Data Structures: Hash Set

Object Oriented Programming

  • Basic Principles
  • SOLID Principles

Vue.js

  • TodoApp with Vue.js

Angular

  • Angular Basics

Tech Interview

  • DOM Basics
  • DOM Styling and Sizing
  • Events
  • DOM Practice
  • Promises

Особливості курсу

  • Працюєш? Вчись у власному темпі
  • Зідзвони з менторами тричі на тиждень
  • Чат з одногрупниками
  • Навчальні матеріали «без води» замість довгих лекцій
  • Матимеш 5 робочих проєктів в портфоліо
  • Гарантуємо працевлаштування після навчання
  • Повернемо кошти якщо не знайшов роботу в ІТ

Викладачі курсу

  • Bohdan Maksymiuk - Fullstack developer / Mentor
  • Misha Hrynko - Fullstack Coach
  • Anastasiia Smetana - Students Coordinator | Frontend
  • Artem Topolskyi - Communications / Calendar Team Lead
  • Nadiia Martynets - Students Coordinator
  • Volodymur Kryvytskyi - Retention Team Lead
Більше інформації
Відеокурс / Платформа
Формат
Online
Початок навчання
Будь-який момент
Тривалість
-
Рівень
Для початківців
Мова навчання
Ukrainian, English
Вартість
299 USD за курс
Гнучкий графікРеальний проект у портфоліо
Web Academy
  • Frontend
Подробиці

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

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

Live

Знайомство. Вступ до Front-end

Основи HTML

  • Інструменти
  • Структура HTML-документа
  • HTML-теги та їх атрибути
  • Семантичні елементи HTML5

Основи CSS

  • Види селекторів у CSS
  • Специфіка селекторів
  • Одиниці розмірів у CSS
  • Flexbox

Live

Верстка макету

Позиціонування елемента в CSS. Обтікання тексту в CSS. Float

Мета: Навчитися накладати елементи один на одного, зміщувати, переміщати, створювати обтікання тексту. За допомогою цих знань можна верстати складніші компоненти: картки, модальні вікна, слайдери і т.п

CSS3-медіазапити. Гнучкі зображення

Мета: Зрозуміти, як робити адаптивну верстку та адаптувати сайти до різних екранів.

Live

Продовжуємо верстати макет

Основи Grid

Мета: Вивчити ще один спосіб позиціонування елементів

Основи JavaScript. Примітивні типи даних. Функції. Оператор розгалуження if

Мета: Розібратися, як зберігати, змінювати та використовувати дані. Зрозуміти, як писати найпростіші дії на JS.

Live

Вирішуємо найпростіші завдання на JS

Об'єкти та масиви: основи

Мета: Продовжимо знайомство з типами даних JS. Навчимося їх створювати, змінювати та використовувати

Масиви та їх методи

Мета: Зрозуміти, як влаштовані масиви і чим відрізняються від об'єктів

Live

Вирішуємо задачі на JS з використанням об'єктів та масивів

Основи роботи з DOM

Мета: Познайомитись з об'єктами, які дозволяють змінювати сайт та пізнавати час. Навчитися змінювати та створювати HTML та CSS за допомогою JS

Замикання

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

Live

Пишемо просту гру

Методи об'єкта, "this". Прототипи, успадкування. Стрілочні функції

Мета: Докладніше вивчити об'єкти, які є основною структурою даних JavaScript

Планування та асинхронність

Мета: Ознайомитися з плануванням дзвінків та детальніше розібрати пристрій функцій

Live

Продовжуємо писати гру

Наслідування класів. Модулі. Домішки

Мета: Вивчаємо основи ООП та класи в JS

Проміси async/await. Промісифікація функцій. Синтаксис async/await

Мета: Вчимося працювати з об'єктами Promise для організації послідовних асинхронних дій

Live

Розробляємо найпростіші компоненти на прикладі модального вікна

Мережеві запити

Мета: Ознайомитися з основами HTTP та спілкування із сервером

Створення, валідація та відправлення форм на сервер

Мета: Навчитися вирішувати одне з найчастіших завдань - отримання інформації від користувача, групування та відправлення на сервер

Live

Розробляємо компоненти на прикладі слайдера

Основи сучасних інтерфейсів на прикладі написання багатокомпонентної програми ToDoList

  • Форма додавання задачі
  • Компонент – завдання
  • Компонент список
  • Спілкування компонетів між собою

Спілкування з сервером на прикладі додавання сервера до ToDo List. Створення, редагування, видалення задач

Live

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

Особливості курсу

  • Курс в записі, вчись прямо зараз
  • Підтримка клієнтського сервісу
  • Участь в Web Academy Club
  • Година персональної Online консультації з IT-рекрутером з працевлаштування: рев'ю резюме і профілів

Викладачі курсу

Борис Черепаха - Senior Software Developer

Більше інформації
Відеокурс / Платформа
Формат
Online
Початок навчання
Будь-який момент
Тривалість
22 тижнів
Рівень
Для початківців, Для досвідчених
Мова навчання
Ukrainian, Russian
Вартість
13 000 UAH за курс
Заняття цілий деньВидається диплом/сертифікатСупровід ментораРеальний проект у портфоліо
Prog Academy
  • Frontend
Подробиці

Під час курсу ви зможете сформувати глибоке розуміння трьох головних технологій для front-end розробника: HTML, CSS та JavaScript, зрозумієте принципи роботи та навчитесь використовувати React, створите повноцінний проєкт для портфоліо, а також матимете можливість пройти стажування на реальному проєкті. Курс складається з 3 модулів, кожен з яких ви можете вивчати окремо.

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

Верстка HTML/CSS

  • Основні завдання фронтенду. Інструменти розробки
  • Введення у HTML. Структура коду
  • Основні теги роботи із текстом, зображеннями
  • Створення веб-форм
  • Робота із таблицями даних
  • Списки
  • Введення в CSS, поділ змісту та уявлення
  • Контейнер CSS. Підключення CSS стилів. Застосування валідатора
  • CSS селектори
  • Способи розкладки CSS: float, grid, flexbox
  • Використання SASS, SCSS
  • Анімація, трансформація, переходи
  • Роботи з градієнтами
  • Сучасні типи верстки
  • Методологія БЕМ та рекомендації щодо назви класів
  • CSS-фреймворки: Bootstrap
  • CSS media queries
  • Нові специфікації HTML5 та CSS3
  • Семантичні теги. Теги фізичної та логічної розмітки у HTML5
  • Різні види верстки. Адаптивність та оптимізація верстки
  • IT-English Speaking Club з викладачем із IT компанії

JavaScript

  • JavaScript: історія, роль, синтаксис
  • Базові конструкції мови
  • Примітивні типи даних, змінні, оператори
  • Логічні структури
  • Робота з масивами: одновимірними, двовимірними
  • Методи та функції
  • Класи та об'єкти. Основи ООП
  • Конструктори та прототипи
  • JavaScript у браузерах: модель W3C DOM
  • Форми та регулярні вирази
  • Події, опрацювання подій
  • Інтерактивні інтерфейси. AJAX, Promise, Fetch
  • Сучасні можливості ES6-ES9
  • Архітектура REST
  • Бібліотека jQuery
  • Вивчення React та/або Vue.js
  • Збірка проектів: WebPack, Gulp
  • Робота з npm, npx, yarn
  • Основи Node.JS
  • Написання дипломного проекту для портфоліо. Code review від викладача
  • Гарантоване стажування у комерційному проекті за підсумками тестування та захисту дипломного проекту
  • IT-English Speaking Club з викладачем із IT компанії

React

  • Введення в React
  • Підключення, запуск
  • Поняття функціональної компоненти, робота з компонентами, JSX
  • Робота з props, використання компонент клас
  • Робота зі State
  • Події у React
  • Робота з сервером (promise, fetch) та обробка помилок
  • Життєвий цикл компонентів
  • Компоненти вищого порядку, context, propTypes
  • React Router
  • Hooks
  • Redux
  • Babel, WebPack

Пакет PLUS

Включає базовий курс, а також:

  • Безлімітний доступ до матеріалів
  • 60 хв індивідуальних консультацій з ментором у кожному модулі
  • Онлайн підтримка від ментора 9 місяців
  • Можливість заморозити навчання до 3-х місяців
  • Безлімітний IT English Speaking Club

Особливості курсу

  • Заняття у будь-який час
  • Можливість обрати будь-який окремий модуль для вивчення
  • Підтримка ментора протягом 6-9 місяців
  • Стажування у реальному проєкті
  • IT English Speaking Club
  • Додаткові можливості у пакеті PLUS

Викладачі курсу

  • Всеволод Євгієнко - Засновник IT школи Prog.Academy Професійний програміст з досвідом більше 15 років. Автор курсу Java Pro і ряду авторських тренінгів.
  • Дмитро Міщук - Діючий Front-End розробник з досвідом більше 7 років. Працював в компаніях DataArt, PrivatBank, EPAM.
  • Олександр Цимбалюк - Автор офлайн і онлайн курсів по Java і Python.
  • Філіп Севене - Front-End розробник з досвідом більше 5 років. Працював в компаніях Samsung, CNW, GDBAY. Викладає розробку 3 роки. Автор онлайн курсу.
Більше інформації
Відеокурс / Платформа
Формат
Online
Початок навчання
Будь-який момент
Тривалість
50 занять
Рівень
Для початківців
Мова навчання
Ukrainian, Russian
Вартість
1 840 UAH за курс
Заняття цілий деньВидається диплом/сертифікат
Powercode Academy
  • Frontend
Подробиці

На курсі можна опанувати сучасні методи верстки адаптивних сайтів за допомогою HTML та CSS. Протягом курсу Ви навчитесь писати адаптивні веб-сторінки з використанням HTML, CSS, вивчите основи Javascript та опануєте систему контролю версій Git.

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

Frontend Base

  • Введення
  • Налаштування середовища розробника, вибір редактора коду
  • Що таке HTML? Структура елементів HTML
  • Метадані
  • Основи редагування тексту: Назви, параграфи. Списки
  • Створення гіперпосилань. Абсолютні та відносні URL
  • Структура елементів веб-сайту
  • Термінові, блокові елементи
  • Верстка Резюме. Базовий шаблон
  • Робота із зображеннями
  • Верстка Резюме. Додаємо фото та векторні зображення
  • Робота з таблицями, як створюються сучасні таблиці
  • Робота з формами
  • Навіщо CSS? Синтаксис у CSS
  • Веб-шрифти
  • Стилізація тексту, списків, посилань
  • Селектори, типи селекторів. Комбінатори
  • Додавання CSS у Резюме. Підключення шрифтів
  • Каскадність та успадкування
  • Псевдокласи та псевдоелементи
  • Блокова модель документа
  • Розміщення елементів на сторінці
  • Flexbox – як один із сучасних форматів блокової верстки
  • Верстка резюме Додавання стилів
  • Стилізація зображень. Фонові зображення
  • Верстаємо картку товару
  • Препроцесори та постпроцесори – для чого вони необхідні і як спрощують стилізацію
  • Верстаємо форму відправлення
  • Властивості CSS для анімації
  • Grid Layout
  • Верстаємо галерею товарів
  • Media queries – адаптація сайтів до всіх видів екранів
  • Верстка адаптивного меню
  • Figma, Zeplin, Avocado вилучення необхідних стилів
  • Практичне заняття, верстаємо просту сторінку
  • Оптимізація верстки. Розбір питань та ситуацій
  • Система контролю версій git
  • Поглиблений аналіз git підключаємо локальний git до github
  • Javascript – введення в мову
  • Робота зі змінними, відмінності let, const, var
  • Типи даних
  • Оператори
  • Числа Рядки
  • Умовні інструкції
  • Цикли
  • Функції Javascript, види оголошення функцій, їх аргументи
  • Робота з масивами, для чого вони потрібні, методи перебору та сортування масивів
  • Об’єкти, робота з об’єктами

Особливості курсу

  • 50 відеоуроків тривалістю 10-20 хв
  • Доступ до всіх матеріалів протягом 6 місяців
  • Додаткові посилання на статті та кейси для опрацювання
  • Сертифікат про закінчення курсу (при 80% засвоєного матеріалу)
Більше інформації
Відеокурс / Платформа
Формат
Online
Початок навчання
Будь-який момент
Тривалість
50 занять
Рівень
Для досвідчених
Мова навчання
Russian
Вартість
1 840 UAH за курс
Заняття цілий деньВидається диплом/сертифікат
Powercode Academy
  • Frontend
Подробиці

Пройшовши цей курс, ви поглибите своє розуміння JavaScript: ви освоїте взаємодію з сервером, дослідите оновлені версії ECMAScript, ознайомитесь з NPM репозиторіями, вивчите бібліотеку React і введенням в Redux.

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

  • Що таке JavaScript. Специфікація ECMAScript. Web Console
  • Оголошення змінних let, const, var
  • Структура і типи даних
  • Оператори
  • Приведення типів
  • Числа Рядки
  • Практика
  • Умовні інструкції if else, switch
  • Цикли
  • Практика
  • Функції
  • Практика
  • Робота з масивами, для чого вони потрібні, методи перебору і сортування
  • Об’єкти, спадкування. Відмінності від масивів, оператори
  • Розбір практичного прикладу, завдання
  • DOM звернення до елементів
  • DOM стилі
  • Події в Javascript
  • Замикання і рекурсії
  • Серіалізація даних, розгляд форматів xml і json
  • Основні поняття асинхронного програмування
  • Практика
  • Методи взаємодії з сервером, види запитів Ajax
  • Пояснення концепції SPA
  • Робота з модулями, оптимізація роботи Javascript
  • Розгляд нових версій ECMAScript
  • NPM репозиторії, навіщо вони потрібні і як взаємодіяти з js ком’юніті
  • Взаємодіємо з реальним сервером
  • Практика
  • Огляд сучасних напрямків і фреймворків Javascript, серверний JS і інтерфейси десктоп
  • Знайомство з React
  • Webpack, для чого він потрібен, базовий шаблон webpack
  • Поглиблення в веб пак, як ми можемо використовувати ще недоступні функції ECMAScript
  • Налаштування оточення, використання create react app, JSX
  • Virtual DOM як основа React, інтерактивність сторінки, як її домагаються
  • Заглиблюємося в компоненти що таке props, state, як оживити нашу сторінку
  • Компоненти в React, життєвий цикл компонентів, функціональні компоненти
  • Види стилізацій React додатків, робота зі styled components
  • Роутінг, взаємодія з адресним рядком
  • State менеджери, їх необхідність, види, і як масштабувати великі проєкти
  • Context
  • Введення в Redux, створення редюсеров, екшенів, цикл який проходять всі дані в redux
  • Debug React додатків, робота зі статичними даними
  • Створюємо проєкт на React. Сторінка з продажу байків
  • React. Сторінка з продажу байків:
    • Верстка простих елементів
    • Верстка слайдера
    • Вибір кольору товару та контактна форма
    • Підключаємо сервер
    • Deploy на heroku
  • Що робити далі розробнику-початківцю?

Особливості курсу

  • 50 відеоуроків тривалістю 10-30 хв
  • Для успішного проходження курсу необхідні базові знання HTML, CSS та Javascript
  • Доступ до всіх матеріалів протягом 6 місяців
  • Додаткові посилання на статті та кейси для опрацювання
  • Сертифікат про закінчення курсу (при 80% засвоєного матеріалу)
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
16 занять
Рівень
Для початківців
Мова навчання
Ukrainian
Вартість
уточнюйте
Гнучкий графікВидається диплом/сертифікат
DAN IT Education
  • Frontend
  • WEB Developer / Webmaster
Подробиці

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

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

Основи HTML/CSS

  • Робота із системою контролю версій Git
  • Основи HTML5, базові HTML елементи та атрибути
  • Основи CSS, основні правила, оформлення елементів
  • Селектори CSS
  • Робота з технологіями Flexbox та CSS Grid
  • Керівництво розміром та розміщенням блоків на сторінці
  • Псевдо-елементи та псевдо-класи
  • Робота з таблицями, формами
  • Анімації в CSS
  • Робота з адаптивною вебверсткою та особливості кросбраузерної верстки
  • Препроцесори CSS

Степ-проєкт в кінці навчання

Особливості курсу

  • Живі заняття онлайн або у школі
  • Система оцінки знань
  • Навчальний проєкт

 

Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
20 годин
Рівень
Для початківців, Для досвідчених
Мова навчання
Ukrainian
Вартість
132 USD за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментора
CyberBionic Systematics
  • Frontend
Подробиці

У курсі буде продемонстровані приклади додавання інтерактивних і динамічних компонентів сторінки, різних елементів управління, ефектів і плагінів.

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

Введення в jQuery

  • Основи jQuery
  • Обгортка jQuery
  • Ненав'язливий JavaScript
  • Елементи DOM

Базові селектори

  • Базові селектори CSS
  • Створення нових елементів HTML
  • Маніпуляція обгорненим набором елементів

Маніпуляція властивостями і атрибутами

  • Читання і установка значень атрибутів
  • Зміна стилю відображення елемента
  • Установка вмісту елементу
  • Обробка значень елементів форми

Модель подій jQuery

  • Модель подій DOM рівня 0
  • Модель подій DOM рівня 2
  • Модуль подій Internet Explorer
  • Модуль подій jQuery

Анімація

  • Приховування і відображення елементів
  • Анімаційні ефекти при зміні візуального стану

Ефекти

  • Створення своїх анімаційних ефектів
  • Ефект масштабу
  • Ефект падіння
  • Ефект розсіювання

Допоміжні функції jQuery

  • Прапори jQuery
  • Управління об'єктами і колекціями JavaScript
  • Динамічне завантаження сценаріїв

Розширення jQuery за допомогою власних модулів

  • Основні правила створення модулів розширення для jQuery
  • Створення власних допоміжних функцій
  • Додавання нових методів обгортки

jQuery UI

  • Вибір стилів і компонентів на сайті jQuery UI
  • Робота з елементами керування jQuery UI
  • Ефекти

Використання розширень

  • FancyBox
  • Form Plugin
  • Dimension Plugin
  • Live Query Plugin

Особливості курсу

  • Практичні заняття і перевірка ДЗ
  • Безкоштовний відеокурс
  • Онлайн тестування і сертифікація
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
10 годин
Рівень
Для досвідчених
Мова навчання
Ukrainian
Вартість
66 USD за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментора
CyberBionic Systematics
  • JavaScript
  • Frontend
Подробиці

Даний курс дозволить слухачеві, використовуючи різні шаблони кодування, зробити додаток максимально зручним для супроводу та розширення. Також в цьому курсі ви вивчите шаблони проектування, які допоможуть розробляти свої фреймворки і розуміти структуру інших бібліотек, написаних на JavaScript.

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

Літерали і конструктори

  • Перевага використання літералів
  • Використання літералів об'єктів
  • Використання літералів масивів
  • Шаблони для створення користувацьких конструкторів
  • Об'єкти - обгортки простих типів

Функції

  • Особливості функцій в JavaScript. Термінологія
  • Шаблони використання функцій зворотнього виклику
  • Шаблони роботи з функціями
  • Миттєві функції
  • Самовизначні функції
  • Замикання
  • Мемоізація
  • Каррірування

Шаблони створення об'єктів і повторне використання коду

  • Шаблон створення просторів імен
  • Шаблон "Модуль"
  • Шаблон "Ізольований простір імен"
  • Класичні шаблони повторного використання коду
  • Сучасні шаблони повторного використання коду

Шаблони проєктування в JavaScript

  • Singleton
  • Фабрика
  • Ітератор
  • Декоратор
  • Стратегія
  • Фасад
  • Проксі
  • Медіатор
  • Спостерігач

Шаблони роботи з DOM

  • Анти шаблони роботи з деревом DOM
  • Приклади правильної організації звернення до DOM
  • Розробка сценаріїв, які працюють тривалий час
  • Способи розгортання сценаріїв
  • Мінімізація JavaScript коду
  • Замір швидкості завантаження документа, оптимізація веб-документа

Особливості курсу

  • Практичні заняття і перевірка ДЗ
  • Безкоштовний відеокурс
  • Онлайн тестування і сертифікація

Викладачі курсу

  • Дмитро Охріменко - Експерт з побудови розподілених та веб-орієнтованих додатків
  • Олена Хижняк - Web Frontend Developer
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
8 годин
Рівень
Для початківців, Для досвідчених
Мова навчання
Ukrainian
Вартість
53 USD за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментора
CyberBionic Systematics
  • Frontend
Подробиці

Bootstrap 5 - це HTML, CSS, JavaScript фреймворк для розробки кросбраузерності веб-орієнтованих інтерфейсів. Bootstrap представляє набір інструментів від Twitter, створений для полегшення розробки web-додатків і сайтів, використовує CSS і HTML для друкарні, форм, кнопок, таблиць, сіток, навігації і т.д., а також додаткові розширення JavaScript, що спрощують роботу веб-розробника.

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

Знайомство з Bootstrap 5. Типографіка

  • Знайомство з фреймворком
  • Способи підключення фреймворка
  • Знайомство з Grid-System
  • Заголовки і скорочення
  • Блокові текстові елементи
  • Цитати і вирівнювання
  • Списки і таблиці
  • Зображення і фігури

Компоненти Bootstrap 5

  • Оповіщення
  • Значок
  • Хлібні крихти
  • Картка
  • Кнопки, групи кнопок
  • Випадаючі списки
  • Пагінація форми
  • Інпут групи
  • Навігація, навбари
  • Підказка
  • Прогрес бар
  • Скролінг
  • Адаптивне відео

JavaScript Bootstrap 5

  • Перевірка форм
  • Карусель
  • Акордеон
  • Списки груп
  • Модальні вікна

Утиліти Bootstrap 5. Службові класи

  • Межа
  • Очищення
  • Колір
  • Відображення елементів
  • Flexbox
  • Розміри, позиціонування
  • Відстань
  • Форматування тексту
  • Вертикальне вирівнювання

Особливості курсу

  • Практичні заняття і перевірка ДЗ
  • Безкоштовний відеокурс
  • Онлайн тестування і сертифікація

Викладачі курсу

  • Сергій Патьоха - Senior Software Engineer at BIScience
  • Олександр Гончаренко - Web Frontend Developer
  • Анна Павлюк - Web Frontend Developer
  • Олена Хижняк - Web Frontend Developer
  • Поліна Скаленко - Web Frontend Developer
  • Дмитро Охріменко - Експерт з побудови розподілених та веб-орієнтованих додатків
  • Анастасія Ткаченко - Web Frontend Developer
  • Філіп Севене - Web Frontend Developer
  • Віталій Мазяр - Web Frontend Developer
  • Оксана Дмитрієва - Web Frontend Developer
  • Ростислав Сілівейстр - Web Frontend Developer
  • Олександр Петрик - FullStack Developer, CEO at Dinamicka Development
  • Денис Ковтун - Web Frontend Developer
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
12 годин
Рівень
Для початківців, Для досвідчених
Мова навчання
Ukrainian
Вартість
79 USD за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментора
CyberBionic Systematics
  • VueJS
  • Frontend
Подробиці

Курс Vue.js складається з 6 уроків, на яких учні ознайомляться з новою бібліотекою JavaScript - Vue.

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

Введення в бібліотеку Vue.js

Ознайомлення з бібліотекою Vue.js, історією створення, методи підключення і визначення на сторінці, а також знайомство з екземпляром об'єкта Vue(). Будуть розглянуті основні елементи - прив'язки і шаблони, їх мета і використання. Розбір основних прив'язок на сторінку, а також життєвий цикл примірника Vue.

Робота з формами

Умовне відображення даних

Ознайомлення з директивами умовного відображення об'єктів і масивів. Будуть розглянуті основні методи роботи з висновком масивів в призначений для користувача інтерфейс. Також в уроці дається визначення обчислюваним властивостям об'єкта Vue, фільтрів і спостерігачам.

Компоненти Vue.js

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

Анімація і переходи

Вивчення роботи анімації і переходів у Vue, компонента transition, основних класів появи і зникнення елементів Virtual DOM. Застосування групового компонента для списків. Буде показаний приклад Velocity бібліотеки для поліпшення режиму анімації. Розглянуто тему власних компонентів і застосування їх на сторінці.

Маршрутизація у Vue.js

Ознайомлення з основними відмінностями SPA і серверним рендерингом. Розібратися з основними програмами для роботи програми на локальному сервері. Розібрати поняття маршрутизації і розглянути компонент vue-router. Ознайомитися з видами маршрутів, а також з основними параметрами.

Особливості курсу

  • Практичні заняття і перевірка ДЗ
  • Безкоштовний відеокурс
  • Онлайн тестування і сертифікація
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
10 годин
Рівень
Для досвідчених
Мова навчання
Ukrainian
Вартість
110 USD за курс
Гнучкий графікВидається диплом/сертифікатСупровід ментора
CyberBionic Systematics
  • Angular
  • Frontend
Подробиці

В курсі Angular 6 Advanced ви дізнаєтеся, як створюються директиви і фільтри, основи використання реактивних підходів в програмуванні і в роботі з Observable, а також познайомитеся з відстеженням змін в Angular-проєкті.

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

Користувальницькі директиви і компоненти

У цьому уроці ми вивчимо принципи створення структурних і атрибутивних директив. Це допоможе вам зрозуміти, як працюють директиви в Angular-додатку. Також в цей урок включені приклади створення призначених для користувача фільтрів (Pipe). Ви не тільки навчитеся створювати і використовувати фільтри, але і дізнаєтеся, які налаштування фільтрів можуть підвищити продуктивність програми.

Форма. Частина 1

У цьому уроці ми навчимося створювати користувальницький інтерфейс з використанням Model Driven підходу або реактивних форм. Крок за кроком ми створимо модель, прив'яжемо її до інтерфейсу і додамо логіку, виконує перевірку коректності введених користувачем даних. Також ми розглянемо принципи створення користувацьких валідаторів, а також дізнаємося, як працюють асинхронні валідатори в Angular.

Форма. Частина 2

У цьому уроці ми продовжимо розглядати роботу з формами в Angular. У прикладах буде показаний спосіб створення динамічних форм, які створюють елементи управління в процесі виконання програми, спираючись на модель даних. Також в ці уроки включені приклади створення компонентів, які використовують 3rd party бібліотеки.

Реактивне програмування. RxJS

Реактивне програмування - це підхід в розробці програмного забезпечення, який заснований на маніпуляції асинхронних потоків. У цей урок входять приклади роботи з Observable об'єктами та їх методами, які надає бібліотека Ext.js. Ви дізнаєтеся, як можна створювати вами об'єкти і використовувати різні методи, такі як filter, map, flatMap, debounce та інші. Також ви дізнаєтеся, як можна використовувати вами об'єкти при створенні сервісів в Angular.

Відстеження змін

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

Особливості курсу

  • Практичні заняття і перевірка ДЗ
  • Безкоштовний відеокурс
  • Онлайн тестування і сертифікація

Викладачі курсу

  • Дмитро Охріменко - Експерт з побудови розподілених та веб-орієнтованих додатків
  • Сергій Патьоха - Senior Software Engineer at BIScience
  • Олександр Гончаренко - Web Frontend Developer
  • Анна Павлюк - Web Frontend Developer
  • Олена Хижняк - Web Frontend Developer
  • Поліна Соколенко - Web Frontend Developer
  • Віталій Мазяр - Web Frontend Developer
  • Оксана Дмитрієва - Web Frontend Developer
  • Денис Ковтун - Web Frontend Developer
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
4 місяців
Рівень
Для початківців
Мова навчання
Ukrainian
Вартість
7 500 UAH за курс
Гнучкий графікВидається диплом/сертифікат
Sigma Software University
  • Frontend
Подробиці

Курс для вивчення та поглиблення знань з Front-end. Основним напрямком курсу є створення інтерфейсів користувача та правильне налаштування робочого оточення для ефективної роботи.

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

  • Основи дизайну та UI / UX
  • HTML розмітка та семантика
  • Базові й поглиблені практики CSS
  • GIT
  • Основи мови JavaScript
  • Нововведення в EcmaScript
  • Модульні системи
  • Налаштування інфраструктури проекту
  • Налагодження коду
  • Критерії якості коду
  • Адаптивна верстка
  • Формати зображень
  • Асинхронне програмування
  • Комунікація з back-end

Вимоги для проходження курсу

  • Мінімальний досвід у Web розробці (HTML, CSS, JavaScript) і / або участь у навчальних курсах по front-end

Особливості курсу

  • Курс складається із теоретичних занять, низки домашніх завдань, онлайн майстер-класів та воркшопів
  • Бонусом є вебінар «Interview Easy or Hard» з Sr. Recruiter в Sigma Software
Більше інформації
Курс
Формат
Online
Початок навчання
Дата формується
Тривалість
13 тижнів
Рівень
Для початківців, Для досвідчених
Мова навчання
Ukrainian, English
Вартість
безкоштовно
Вечірні заняття
Genesis Academy
  • Frontend
Подробиці

Програма занять призначена для студентів з попередніми знаннями у JavaScript, для початківців-розробників, які мають бажання поглибити свої знання про особливості розробки front-end у продуктах, а також для Middle developers, які хочуть систематизувати свої знання про front-end розробку.

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

Основи побудови додатка

  • Правильний стиль проєктування та використання патернів як інструменти спрощення коду та розв'язування продуктових задач (Clean Code principles, принципи SOLID, GRASP, патерни проєктування)

Екосистема

  • Front-end екосистеми (eslint, prettier, husky)
  • Особливості мобільної та десктопної розробки

Архітектура

  • Особливості фреймворків великої трійки
  • Принципи побудови архітектури додатка

Надійність системи

  • Правильне використання TypeScript
  • Що таке контракти?
  • Як потрібно писати тести
  • Обробка помилок
  • Моніторинг системи

SSR & SEO

  • Робота серверного рендерингу, особливості та проблеми

SDLC

  • Етапи, які проходить задача перед тим, як потрапити на production
  • Підхід CI/CD, та як це допомагає проєктам рухатись швидше

Вимоги для проходження курсу

  • Володіння HTML та CSS
  • Базове знання JavaScript (знання синтаксису, структур даних та базових алгоритмів)
  • Знання одного з популярних фреймворків (React, Vue, Angular)
  • Навички адаптивної верстки
  • Розуміння роботи з системою контролю версій GIT

Особливості курсу

  • Попередня реєстрація на курс, з проходженням тестових завдань та співбесіди
  • Доступ до матеріалів курсу залишається протягом 2 місяців після закінчення
  • Домашні завдання та групові проєкти
  • Найкращі студенти можуть отримати запрошення на співбесіду чи офер від компанії

Викладачі курсу

  • Андрій Попович - CTO
  • Микола Коваль - Head of Front-End Guild
  • Лев Давидов - Front-End Developer
  • Олег Вязовий - Front-End Developer
  • Андрій Шавловський - Head of QA
  • Саша Ковріжних - Tech Lead Front-End Team
Більше інформації

Сторінки

Читайте нас в Telegram, щоб не пропустити анонси нових курсів.

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

Нікіта   04.04.2024
Є ймовірність, що даний відгук носить замовний характер. Оцінки з таких відгуків не зараховуються

Купив курс Frontend розробника на part-time рік тому і весь шлях до оферу мені допомагали ввічливі ментори. Іноді матеріал був неповний, але то є суть програмування - шукати інфу та розвиватися, тому загалом проблем не було. Все сподобалося, отримав багато корисних як хард, так і софт скілів. Однозначно рекомендую, особливо якщо ви настроєні на здобуття навичок у програмуванні, потрібна лише наполегливість та терпіння :)

Рекомендації: Рекомендую
5
Середня: 5 (1 голос)
Курси Frontend
Валерій   02.04.2024

Програма дуже кльово підготовлена для сильного початку кар'єри. В мейті все і всюди будується на фідбеках що допомагає платформі завжди покращуватись. Про розвиток платформи то тут взагалі все дуже суперово, за більше ніж півроку ДУУУЖЕ багато нових оновлень. Від темної теми до переходу всіх чатів на платформу та гейміфікація.

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

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

Можна бути випускником Мейту, але випустити Мейт з серденька… Ніколи

Дуже вдячний за Вашу підтримку. HUUUGE LOVE❤️❤️✨

 

Плюси:Навчання дуже детально підготовлено. Розумієш що за ним багато років праці
Мінуси:Можливо і є але воно точно мінорні. І наврядчи вартують уваги
Рекомендації: Рекомендую
5
Середня: 5 (1 голос)
Курси Frontend
Вадим   01.04.2024

Залишився безмежно вражений курсами від Mate Academy. Для мене вони були справжнім джерелом знань, які проклали шлях до успішної кар'єри в IT. Почавши навчання у липні і завершивши у грудні, я отримав надзвичайно цінний досвід, який неможливо переоцінити.

Я навчався на парт тайм, та ще паралельно навчався у двох університетах, тому якщо хотіти можна все встигати.
 

Плюси:Матеріал курсів був подано чітко та зрозуміло, а головне структурована та без води. Більше не було потрібно підбирати собі матеріал, та вчити лишнього. Варто відзначити, що під час навчання в Mate Academy я завжди відчував себе підтриманим та надихнутим завдяки наставникам та координаторам курсів. Вони були завжди на зв'язку, готові відповісти на будь-які питання та надати допомогу у вирішенні будь-яких проблем.
Рекомендації: Нейтрально
5
Середня: 5 (1 голос)
Курси Frontend
Олена   01.04.2024

Я вивчаю курс спеціалізації Frontend-розробник. Мені взагалі подобалося займатися програмуванням. До курсу я знала лише код HTML. Під час курсу дізналася ще коди програмування CSS, JS і ще будуть, не дійшла ще до кінця.

Рекомендації: Рекомендую
5
Середня: 5 (1 голос)
Курси Frontend
Гість   28.03.2024

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

Рекомендації: Рекомендую
5
Середня: 5 (1 голос)
Курси Frontend

Сторінки