Курсы Frontend Developer: HTML и CSS

Подборка лучших курсов Frontend Developer, которые познакомят вас с современными практиками разработки сайтов. Вы сможете усвоить с нуля основные технологии для верстки сайтов: HTML, CSS, JavaScript и Bootstrap. Продвинутые Frontend разработчики также найдут для себя подходящие обучающие программы.
Читать далее

Сравнение всех курсов

Фильтр
Мы нашли для вас 96 курсов
Курс

Front-end Developer – IT STEP Academy

IT STEP Academy
Формат
Online
Начало занятий
18.10.2024
Длительность
12 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
45 360 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 пари
  • Структурована подача знань
  • Підтримка викладачем
  • Готовий проєкт для портфоліо
  • Підготовка до працевлаштування
Больше информации
Курс

Front-end – Okten School

Okten School
Формат
Online
Начало занятий
20.09.2024
Длительность
6 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
уточняйте
Гибкий графикВыдаётся диплом/сертификатВозможно трудоустройствоСопровождение ментораРеальный проект в портфолио
Okten School
  • Frontend
Подробнее

Навчимо вас HTML/CSS, Git, JavaScript, TypeScript React, Angular, Node.JS, MySQL, MongoDB, Nest.JS, Next.JS, а потім ще і працевлаштуємо.

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

Git

  • Встановлення системи контролю версій
  • Інтеграція з IDEA
  • Базові команди інтерфейсу
  • Розгалуження в проєктуванні коду
  • Робота в команді за допомоги Git
  • Безпечне об'єднання
  • Вирішення конфліктів
  • Колаборація та Pull Requests

HTML/CSS

  • Основи HTML. Рядки, блоки, розміри, відступи
  • Робота з CSS, різновиди та методології в css
  • Flexbox, Grid CSS та інші підходи позиціонування
  • Робота з медіаконтентом та формами
  • Figma
  • Шфрити та іконки
  • Адаптивна верстка
  • Проєкт з HTML

JavaScript

  • Базові типи та конструкції
  • Цикли, масиви та об'єкти
  • Різновили функцій та робота з ними
  • Класи, конструктори, прототипи
  • Об'єктна модель документа та події
  • Асинхронність та Event Loop
  • Робота з API
  • Проєкт з використанням html та javascript

MySQL

  • Встановлення. Переваги та недоліки
  • Базові операції
  • Відношення між таблицями та нормальні форми баз даних
  • Об'єднання таблиць та каскадні операції
  • Індексація атрибутів
  • Переваги та недоліки реляційних СУБД
  • Приклади архітектур з використанням MYSQL
  • Контроль знань

MongoDB

  • MongoDB. NoSQL
  • Базові операції
  • Проблема відношень в MongoDB
  • Агрегації та внутрішні посилання
  • Індексація документів
  • Переваги та недоліки NoSQL
  • Приклади архітектур з використанням NoSQL
  • Контроль знань

TypeScript

  • Типи та типізація даних
  • Функції та методи
  • Створення класів
  • Інтерфейси та їх використання
  • Types, UnionTypes
  • Generics
  • Перечислення (Enums)

React + TS

  • Знайомство з React
  • Компоненти та їх різновиди
  • Модульні та класичні стилі
  • State та State lifting ,Props та Props Drilling
  • Обробка подій та форми
  • Маршрутизація
  • Життєвий цикл компонента
  • Робота зі сторонніми API
  • Хуки та кастомні хуки
  • Класові компоненти
  • Context API
  • Redux & Redux Toolkit
  • Бібліотеки візуальних компнентів

Next.JS

  • Знайомство з Next.JS
  • SSR
  • Різниця в компонентах client vs server
  • Керування станом в компонентах
  • Динамічний рендеринг заголовків
  • Pages Router, App Router
  • Statefull компоненти
  • Робота зі сторонніми API

Angular

  • Angular & AngularCLI
  • Комунікація між компонентами
  • Pipe та Custom Pipes
  • Directives and Advanced Components
  • Service Layer
  • Маршрутизація та стани маршрутів
  • Modules & Lazy Loading

Scrum

  • Знайомство з методологією
  • Різновиди підходів
  • Різниця у впровадженні підходів
  • Реалізація

Проєкт

  • Написання ТЗ
  • Розробка власного проєкту згідно з ТЗ

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

  • Об'єм до 960 годин
  • 6 занять на тиждень
  • Безкоштовне повторне проходження курсу
  • Англійська мова
  • Додатковий курс у подарунок
  • Додаткові консультації
  • Стажування на проєкті
  • Гарантія працевлаштування
  • Вимоги до відвідування

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

  • Сергій Журавльов - Засновник BigBird, співзасновник OktenWeb Digital Studio
  • Віктор Кмін - Senior Developer at Honda Motor Co., Ltd
  • Тарас Якимюк - Senior Developer at Rolique
  • Альона П'яних - Senior React Developer at GridDynamics
  • Роман Жеребецький - Senior Developer at EPAM System
  • Святослав Дюганчук - Senior QA at N-ix
  • Віталій Демчишин - Senior Fullstack Developer at BigBird
Больше информации
Курс

HTML/CSS – Okten School

Okten School
Формат
Online
Начало занятий
13.08.2024
Длительность
3 недель
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
199 UAH за курс
Гибкий графикСопровождение ментора
Okten School
  • Frontend
Подробнее

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

Вступ до Веб-технологій

Що таке web, та що до нього дотичне. Як працює браузер. Структура веб сторінки на прикладі webflow.

Webflow

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

HTML

Загальна структура сторінки та базові теги, гіперпосилання, зображення та інше.

Стилізація CSS

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

Типи елементів

Блочні та рядкові елементи, зовнішні та внутрішні відступи, маніпуляція з зображеннями.

Різновиди селекторів

Різновиди селекторів, вага селекторів, псевдокласи, псевдоелементи.

Flex & Grid CSS

Використання flexbox та Grid CSS для маніпуляції над розташуванням елементів.

Семантика в розробці

Поняття та розуміння семантики для ранжування сайту.

Figma

Знайомство з FIGMA, верстка за макетом.

Медіа теги

Робота з медіа тегами (video, audio), google maps, youtube.

Форми

Робота з формами, типи форм, події форм.

Сторонні бібліотеки

Робота з bootstrap, fontawesome та favicons.

Custom Animation

Кастомна анімація будь-яких елементів.

Адаптивна верстка

Адаптація макетів під різні пристрої, робота з breakpoints.

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

  • Реально необхідна інформація
  • 6 тижнів занять
  • 5 занять на тиждень
  • Живі заняття
  • Спілкування з реальними менторами
  • Повторне проходження курсу
  • Постійний доступ до інформації

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

  • Сергій Журавльов - Засновник BigBird, співзасновник OktenWeb Digital Studio
  • Віктор Кмін - Senior Developer at Honda Motor Co., Ltd.
  • Тарас Якимюк - Senior Developer at Rolique
  • Альона П'яних - Senior React Developer at GridDynamics
  • Роман Жеребецький - Senior Developer at EPAM Systems
  • Святослав Дюганчук - Senior QA at N-IX
  • Віталій Демчишин - Senior Fullstack Developer at BigBird
Больше информации
Видеокурс / Платформа
Рекомендуем

Основи frontend-розробки – Robot Dreams

Robot Dreams
Формат
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

Больше информации
Курс

Frontend Developer – Robot Dreams

Robot Dreams
Формат
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. Знатимете, для чого і коли використовувати кожен з них
  • Знатимете роутинг Next.js
  • Описуватимете внутрішнє API для повернення JSON-даних із сервера
  • Матимете навички в оптимізованому використанні картинок на рівні SSR із Next.js
  • Працюватимете із Lazy Loading, кешуванням

JavaScript Server-Side. Практика Next.js

  • Працюватимете з розробкою server-side application з використанням Next.js
  • Підключатимете фреймворки для стилізації типу Tailwind, а також проводитимете налаштування кастомних тем
  • Розберетесь із роботою маршрутизатора на практиці та роботою кешування на рівні фреймворку
  • Матимете практичні навички використання SSR, CSR

Vercel. Публікація готового проєкту

  • Створюватимете git-репозиторію з підключенням до системи деплойменту
  • Налаштовуватимете деплоймент репозиторію із вебзастосунком на рівні Vercel
  • Матимете навички застосування змін через Pull Request у GitHub

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

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

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

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

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

Больше информации
Курс

Frontend Developer – Mate academy

Mate academy
Формат
Online
Начало занятий
Будь-який момент
Длительность
6 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
49 740 UAH за курс
Знижка 10 000 грн до 16.09.2024
Гибкий графикВыдаётся диплом/сертификатВозможно трудоустройствоСопровождение ментораРеальный проект в портфолио
Mate academy
  • Frontend
Подробнее

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

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

Javascript Basics

  • Introduction
  • Your First JavaScript Program
  • Main Concepts
  • Numbers
  • Strings
  • Boolean
  • Functions
  • Conditional Operators
  • Arrays
  • Loops
  • String Iteration
  • String Methods
  • Working With Arrays
  • Get Ready for the Interview

Course Fundamentals

  • Environment Setup
  • How to Learn Effectively

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)

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

HTML + CSS Advanced

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

Javascript Advanced

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

DOM, Events, Promises

  • DOM Basics
  • DOM Styling and Sizing
  • Events
  • Promises
  • Portfolio Project

React

  • Introduction
  • Props
  • Rendering Lists
  • Handling Events
  • Updating State
  • List Manipulation
  • Lifting State Up

TypeScript

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

React with TypeScript

  • Introduction
  • Froms
  • Advanced Hooks
  • Component Lifecycle
  • State Management
  • Custom Hooks
  • Loading Data From API
  • Updating Data on Server
  • State Management
  • React Router
  • Working With URLSearchParams
  • Portfolio

Redux

  • Redux Main Concepts
  • React Redux
  • Async Redux

How the Web Works

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

Tech Interview

Final Portfolio Review.

Employment

  • Introduction
  • Preparing Your Resume
  • Interview Preparation
  • Preparing Your Cover Letter
  • DOU and Google Profiles
  • Creating Your LinkedIn Profile
  • How to Communicate in the Right Way
  • Creating Your Djinni Profile
  • How to Find Vacancies
  • How to Apply for a Job on Difference Platforms
  • How to Find Recruiters' Contacts
  • Employment daily activities
  • Work details FAQ

Vue.js

TodoApp with Vue.js.

Angular

Angular Basics.

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

Career Development

  • Mastering Your Probation Period
  • PDP and Career Plans
  • Salary Review Strategies
  • Recruiter Outreach
  • How to Find a New Job?

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

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

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

  • Misha Hrynko - Fullstack Coach
  • Iryna Pelekh - Student Coordinator
Больше информации
Курс

Frontend Developer – Mate academy

Mate academy
Формат
Online
Начало занятий
Дата формується
Длительность
5 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
безкоштовно
Знижка 10 000 грн до 16.09.2024
Занятия целый деньВыдаётся диплом/сертификатВозможно трудоустройствоСопровождение ментораРеальный проект в портфолио
Mate academy
  • Frontend
Подробнее

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

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

Javascript Basics

  • Introduction
  • Your First JavaScript Program
  • Main Concepts
  • Numbers
  • Strings
  • Boolean
  • Functions
  • Conditional Operators
  • Arrays
  • Loops
  • String Iteration
  • String Methods
  • Working With Arrays
  • Get Ready for the Interview

Course Fundamentals

  • Environment Setup
  • How to Learn Effectively

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)

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

HTML + CSS Advanced

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

Javascript Advanced

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

DOM, Events, Promises

  • DOM Basics
  • DOM Styling and Sizing
  • Events
  • Promises
  • Portfolio Project

React

  • Introduction
  • Props
  • Rendering Lists
  • Handling Events
  • Updating State
  • List Manipulation
  • Lifting State Up

TypeScript

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

React with TypeScript

  • Introduction
  • Froms
  • Advanced Hooks
  • Component Lifecycle
  • State Management
  • Custom Hooks
  • Loading Data From API
  • Updating Data on Server
  • State Management
  • React Router
  • Working With URLSearchParams
  • Portfolio

Redux

  • Redux Main Concepts
  • React Redux
  • Async Redux

How the Web Works

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

Tech Interview

Final Portfolio Review.

Employment

  • Introduction
  • Preparing Your Resume
  • Interview Preparation
  • Preparing Your Cover Letter
  • DOU and Google Profiles
  • Creating Your LinkedIn Profile
  • How to Communicate in the Right Way
  • Creating Your Djinni Profile
  • How to Find Vacancies
  • How to Apply for a Job on Difference Platforms
  • How to Find Recruiters' Contacts
  • Employment daily activities
  • Work details FAQ

Vue.js

TodoApp with Vue.js.

Angular

Angular Basics.

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

Career Development

  • Mastering Your Probation Period
  • PDP and Career Plans
  • Salary Review Strategies
  • Recruiter Outreach
  • How to Find a New Job?

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

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

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

  • Halyna Stefura - Frontend Student Coordinator
  • Ihor Karpyn - Fullstack developer / Coach
  • Artur Ermolenko - Front-end Mentor
  • Maksym Sobko - Front-end & Full-stack mentor
  • Misha Hrynko - Fullstack Coach
  • Dmytro Moroz - Front-end & Full-stack mentor
  • Mykola Koval - Fullstack developer / Mentor
  • Anna Tkachenko - Fullstack developer / Coach
  • Nazar Muliar - Fullstack developer / Mentor
  • Alina Matuschak - Fullstack developer / Mentor
  • Oleksii Blezniuk - Fullstack developer / Mentor
  • Volodymyr Pavlenko - Fullstack developer / Coach
  • Ihor Nahnybida - Fullstack developer / Mentor
  • Paul Timofejev - Fullstack developer / Coach
  • Alexandra Protyanova - Fullstack developer / Coach
  • Nadiia Martynets - Students Coordinator
Больше информации
Курс

Frontend-розробник з нуля – GoIT

GoIT
Формат
Online
Начало занятий
16.10.2024
Длительность
6 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
уточняйте
Вечерние занятияВыдаётся диплом/сертификатВозможно трудоустройствоСопровождение ментораРеальный проект в портфолио
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-інтерв’ю
  • Підготовка до технічного інтерв’ю
  • Комунікативні навички
  • Тестові співбесіди

Career skills

  • Створення резюме
  • Оформлення проілів LinkedIn та Djinni
  • Підготовка до 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
Больше информации
Курс

Front-end (HTML/CSS + JS) – Lemon School

Lemon School
Формат
Online
Начало занятий
18.11.2024
Длительность
4 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
14 200 UAH за курс
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
Lemon School
  • Frontend
Подробнее

Від PSD-макету до адаптивного документа, разом з HTML5 та каскадними таблицями стилів CSS3. Так, це твій шлях до кар’єри у розробці — з 0 до junior front-end з заробітком від $800

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

Модуль 1 - HTML5, CSS3. BEM. Bootstrap5. Адаптивна верстка. Верстка навчального проєкту

Заняття 1. Знайомство, вступна інформація. Перший кодинг

  • Знайомство
  • Що таке IT загалом і яке місце займає front-end у веб-розробці
  • Етапи розробки проекту
  • Огляд інструментів для розробки
  • Структура документа HTML
  • Основні теги
  • CSS властивості

Заняття 2. Принципи роботи HTML та CSS. Figma. Практика

  • Внутрішні стиль
  • Три методи підключення CSS
  • Рендеринг сторінок
  • Блокові-малі
  • Особливості HTML5. Поняття кросбраузерності та валідності
  • Figma для fornt-end розробника
  • CSS властивості

Заняття 3. Специфіка CSS. FTP. Практика

  • Селектори
  • Специфіка css
  • Значення селектора, вага від типу звернення
  • Посилання. Багатосторінкові сайти
  • FTP. Робота із сервером
  • Коментування коду
  • CSS властивості

Заняття 4. Шляхи, імпорт скидання стилів. Методологія BEM. Практика

  • Абсолютний та відносний шлях
  • Імпорт стилів
  • Скидання стилів за замовчуванням
  • CSS reset
  • Зображення як частина контенту
  • Методологія БЕМ. Неймінг класів. Призначення, актуальність, плюси та мінуси
  • CSS властивості

Заняття 5. Таблиці, flexbox layout. Практика. Робоче оточення

  • Верстка таблиць
  • Flexbox layout
  • Робоче оточення або що має бути встановлене. Приклади використання
  • CSS властивості

Заняття 6. Flexbox layout. Псевдоелементи. Позиціонування елементів

  • Flexbox layout
  • Позиціонування елементів, властивість position, static, relative, absolute, fixed, sticky: детальний розгляд кожної поведінки
  • Псевдоелементи after та before
  • Навичка гуглити
  • CSS властивості

Заняття 7. Стани :hover, :active, :focus. Спрайти. Квіткоутворення

  • CSS псевдоклас :hover, :active, :focus. Порядок зйомки
  • Концепція спрайт. Технічне застосування. Призначення, актуальність, плюси та мінуси
  • Семантична верстка
  • Верстка навігація соціальних мереж із застосуванням спрайтів
  • Квіткоутворення. rgb. hex. Альфаканал та непрозорість
  • Навичка гуглити
  • CSS властивості

Заняття 8. Шрифти, змінні css, функція calc()

  • Підключення шрифтів. Що таке безпечні шрифти?
  • google fonts огляд, застосування
  • Псевдоклас: root
  • Використання змінних у CSS. Призначення, актуальність, плюси та мінуси
  • Функція calc() математичні операції CSS
  • Навичка гуглити
  • CSS властивості

Заняття 9. Псевдокласи. Селектори атрибутів

  • Псевдокласи: first,: last,: nth-child. Приклади використання практично
  • Звернення до силектора, різноманітність методів
  • Синтаксис селекторів атрибутів
  • Вендорні префікси
  • Адаптивний шрифт (px, rem, em, vw). Робота з макетами
  • CSS властивості

Заняття 10. Форми. Javascript старт. JQuery. jQuery-Mask

  • Форми. Призначення, принцип роботи
  • Атребути тега input
  • Теги для верстки форм
  • Стилізація елементів форм
  • Що таке JQuery
  • Презентація плагіна jQuery-Mask.js
  • Реалізація маски введення телефону засобами jQuery-Mask.js
  • CSS властивості

Заняття 11. Стилізація тега select. jQuery Nice Select. Градієнти. Паралакс

  • Презентація плагіна jQuery Nice Select
  • Підключення до проєкту jQuery Nice Select
  • Стилізація checkbox/radio
  • Лінійні і радіальні градієнти. Приклади використання
  • Паралакс
  • CSS властивості

Заняття 12. Гумова верстка. Медіазапит

  • Верстка таблиці тегів
  • Гумова верстка, приклади та правила
  • Медіа-запити. Використання медіавиражень. Актуальні брекпоінти
  • mobile/desctop first. Призначення, актуальність, плюси та мінуси
  • Адаптуємо таблицю тегів

Заняття 13. Фреймворк bootstrap5 знайомство

  • Презентація фреймворку bootstrap5
  • Підключення. Вивчення розмітки та breakpoints
  • Використання компонентів
  • Розсмілення класів
  • Структура розмітки bootstrap5. Система сіток

Заняття 14. bootstrap5 адаптивна верстка

  • Поглиблене вивчення системи сіток та структури розмітки
  • Адаптація. Детальний аналіз застосування шести точок скидання фреймворку
  • Кастомізація компонентів під потреби проекту

Модуль 2 - Анімація. Робота з плагінами jQuery. SVG

Заняття 15. Властивість перетворення. Анімація

  • Детальний аналіз якості transform і його значень
  • Ключові кадри Keyframes
  • Keyframes + transform
  • Анімація "Розкадрування"
  • Застосування фреймворку bootstrap у розмітці лекції

Заняття 16. SVG. Анімація SVG. Слайдер slick.js

  • SVG у HTML. Вступ
  • Стилізація об’єктів SVG
  • Анімація SVG об’єктів
  • Анімація по заданій траекторії
  • Презентація сладера
  • Підключення. Застосування. Натсройка. Стилізація
  • Застосування фреймворку bootstrap у розмітці лекції

Заняття 17. Анімація wow.js та animate.css. aos.js. Слайдер slick.js

  • Презентація бібліотеки wow.js Підключення. Розбір атребутів
  • Застосування
  • Презентація бібліотеки animate.css Підключення. Розбір атребутів
  • Застосування
  • Презентація бібліотеки aos.js Підключення. Розбір атребутів
  • Застосування
  • Застосування фреймворку bootstrap у розмітці лекції

Заняття 18. fullPage.js

  • Презентація jqeary плгін fullPage.js
  • Підключення. Розбір атребутів. Застосування
  • Застосування фреймворку bootstrap у розмітці лекції

Заняття 19. jquery.multiscroll.js

  • Презентація jqeary плагін jquery.multiscroll.js
  • Підключення. Розбір атребутів. Застосування
  • Застосування фреймворку bootstrap у розмітці лекції

Заняття 20. Start VanillaJS. Фреймворк PaperCSS

  • Фреймворк PaperCSS
  • Презентація фреймворку PaperCSS
  • Підключення. Вивчення розмітки та breakpoints
  • Використання компонентів
  • Розсмілення класів
  • Структура розмітки bootstrap5. Система сіток
  • Практичне застосування PaperCSS

Заняття 21. Javascript. Фреймворк Neomo. Робота DOM деревом. Цикл forEach. Отримання атрибутів. Рух миші. Реалізація складного інтерактивного SVG об'єкта

  • Фреймворк Неомо
  • Презентація фреймворку Neomo
  • Підключення. Вивчення розмітки та breakpoints
  • Використання компонентів
  • Розсмілення класів
  • Структура розмітки Neomo. Система сіток
  • Практичне застосування Neomo

Заняття 22. Javascript. Фреймворк Bulma. Конструкція if, else if, else. Медіавирази. window, onload, onresize, innerWidth

  • Фреймворк Bulma
  • Презентація фреймворку Bulma
  • Підключення. Вивчення розмітки та breakpoints
  • Використання компонентів
  • Розсмілення класів
  • Структура розмітки Bulma. Система сіток
  • Практичне застосування Bulma

Заняття 23. Бібліотека lottie.js, анімація на json

  • Що таке json і навіщо він потрібний
  • Бібліотека lottie.js
  • Презентація фреймворку lottie.js
  • Підключення
  • Практичне застосування lottie.js
  • Реалізація анімації із застосуванням формату json

Модуль 3 - JS, Git, Gulp, Sass. Верстка проєкту

Заняття 24. Git, Node.js, Gulp, Sass, Include. Видача складання проєкту. Старт проєкту

  • Що таке node.js, npm, Gulp. Принципи взаємодії
  • Огляд популярних плагінів для Gulp
  • Ідеальність верстки. PerfectPixel
  • Огляд плагінів
  • Що таке Git. Принципи роботи. Git Bush
  • git clone, add, commit, push
  • Верстка проєкту

Заняття 25. Git, Gulp, Sass.URL-encoder for SVG. Генератор HTML-дерева. Верстка проєкту

  • Синтаксис scss. Переваги та актуальність
  • git branch, checkout, gitk, відкат комміту
  • Переміщення файлами в командному рядку
  • Генератор HTML-дерева
  • URL-code для SVG
  • Верстка проекту

Заняття 26. Git, Gulp, Include. Верстка проєкту

  • Include. Преимущества и актуальность
  • Git merge
  • Верстка проекта в разных ветках, мёрж веток

Заняття 27. Git, Gulp, API. Оптимізація зображень. Верстка проєкту. VSC-Configure Users Snipets

  • VSC – Configure Users Snipets. Створення власних сніпетів
  • Підключення API TinyPNG
  • Верстка проєкту
  • GitHub Pages
  • Командна робота з гітом

Заняття 28. Git, Gulp, мовна панель vannila.js таби. Верстка проєкту

  • Мовна панель vannila.js
  • Верстка проекту
  • Командна робота з гітом
  • Підготовка до співбесіди
  • code review учнів

Заняття 29. Git, Glup, vannila.js таби. Верстка проєкту

  • Таби vannila.js
  • Верстка проекту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 30. Git, Glup, vannila.js burder-menu. Верстка проєкту

  • Burger-menu vannila.js
  • Верстка проекту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 31. Git, Glup, vannila.js акордеон. Верстка проєкту

  • Акордеон vannila.js
  • Верстка проекту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 32. Git, Glup, vannila.js scroll-to-top. Верстка проєкту

  • Кнопка scroll-to-top vannila.js
  • Верстка проекту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 33. Git, Gulp, vannila.js fixed-header. Верстка проєкту

  • vannila.js fixed-header
  • Верстка проєкту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 34. Git, Glup, vannila.js відстеження блоку на сторінці. Верстка проєкту

  • vannila.js відстеження блоку на сторінці. Заклик до дії
  • Верстка проекту
  • Питання по git, gulp
  • Підготовка до співбесіди
  • code review учнів

Заняття 35. Заняття з Program Manager

  • Принцип управління проєктами/продуктами в ІТ Комунікація та ролі у класичному менеджменті
  • Особливості команди та комунікації в Agile
  • SCRUM як методологія трансформер Estimates або як оцінювати завдання
  • Kanban

Заняття 36. Оптимізація проєкту. Pagesspeed оптимізація. Markup Validation Service. Генератор HTML-дерева. Верстка проєкту

  • Pagespeed оптимізація
  • Оптимізація СSS
  • Оптимізація JS
  • Оптимізація зображень
  • Знайомство із сервісом validator.w3.org
  • Виправлення помилок HTML
  • Контроль класнеймінгу методології BEM

Заняття 37. Огляд популярних фреймворків та CMS

React, Angular, Vue, Wordpres, Opencart. Карта росту

Заняття 38. Розмова з кар'єрним менеджером

  • Як і де шукати роботу для початківця і які інструменти при цьому використовувати
  • Як правильно зробити резюме і яка інформація у ньому є надважлива, а що буде зайвим
  • Як створити профіль на Linkedin, щоб його могли побачити потенційні роботодавці
  • 7 порад, які допоможуть пройти онлайн співбесіду набагато успішніше
  • Q&A

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

  • Безкоштовна IT англійська
  • Додаткові матеріали
  • Кар'єрний менеджер
  • Лекція Project Manager
  • Діджитал диплом для Linkedin

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

  • Дмитро Максюта - Senior Front-end Developer
  • Ростислав Суслов - Middle Front-end Developer
  • Євген Велигора - Middle Front-end Developer
Больше информации
Курс

Front-end з нуля – Web Academy

Web Academy
Формат
Online
Начало занятий
29.10.2024
Длительность
9 недель
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
уточняйте
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
Web Academy
  • Frontend
Подробнее

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

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

Огляд курсу. Основи синтаксису HTML

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

Основи синтаксису CSS

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

Основи HTML форм, верстка простої форми реєстрації

  • Поля введення різних типів даних
  • Типи кнопок
  • Ідентифікатори та значення

CSS бокс модель / Flex box

  • Потік сторінки та управління ним
  • Відступи
  • Вирівнювання

Position

  • Види позиціонування
  • Верстка модального вікна

Grid layout

  • Види сіток
  • Верстка сітки товарів за допомогою grid
  • Властивість gap, відступ між грід елементами

Адаптивна верстка

  • Що таке адаптивна верстка?
  • Запити за допомогою Media queries
  • Приклад верстки адаптивного меню

Препроцессори / SCSS

  • Основи SCSS
  • Змінні та їх відмінність від CSS-змінних
  • Синтаксис

Практика верстки реального шаблону

  • Верстка шаблону
  • Підсумок CSS
  • Практика

Основи JavaScript

  • Синтаксис
  • Типи даних
  • Оператори

Функції | Основи DOM | Події в JS

  • Масиви
  • Функції
  • Додавання відкриття/закриття меню

Функції поглибленно | DOM в деталях

  • Методи масивів push | pop | shift | unshift | slice | splice
  • Селектори querySelector | querySelectorAll
  • Події миші, клавіатури, елементів управління, CSS

Динамічне створення елементів HTML за допомогою JS

  • document.createElement()
  • Перетворення массивів в елементи HTML
  • Створення списку завдань за допомогою localStorage

Асинхронна поведінка, контекст виклику

  • Залишкові параметри та оператор розширення
  • this|call|apply|bind
  • Рекурсія/стек

AJAX, взаємодія з сервером, promise

  • Поняття клієнт | сервер
  • Огляд інструментів для налагодження мережевих запитів
  • Асинхронна поведінка

Практика створення асинхронного компонента сторінки: генератор випадкового рецепту

  • Знайомство з API random food
  • Створення функцій-компонентів
  • Підключення до серверного API

Огляд бібліотеки React JS

  • Способи підключення
  • Ідея компонентів
  • createrReactApp

Приклад створення додатка за допомогою React JS

  • Огляд API themoviedb.org
  • setup оточення для розробки використовуючи createReactApp
  • Створення сторінки списку фільмів

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

  • Zoom-лекції та практикуми
  • Тренер та ментор в чаті групи
  • Перевірка і код рев'ю Д/З ментором з коментарями
  • Сертифікат по закінченню курсу (при успішному захисті фінального проекту і виконаних Д/З)
  • Підтримка клієнтського сервісу
  • Відеозаписи блоку "IT Career"
  • Участь в Web Academy Club

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

  • Ілля Литвинов - Senior Front-end Developer
  • Анастасія Бібік - React/React Native Developer
Больше информации
Курс

Школа веб-розробки – DAN IT Education

DAN IT Education
Формат
Online
Начало занятий
17.10.2024
Длительность
9 месяцев
Уровень
Для детей
Язык обучения
Ukrainian
Стоимость
уточняйте
Гибкий графикВыдаётся диплом/сертификатСопровождение ментора
DAN IT Education
  • Frontend
Подробнее

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

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

Модуль 1. HTML&CSS Basics

  • Основні HTML теги та атрибути
  • Основи CSS, блочна модель
  • Селектори CSS
  • Оформлення елементів
  • Поля і відступи
  • Порядок верстки блоку
  • Тестування результатів верстки
  • Управління розміром і положення блоків на сторінці 
  • Технологія Flexbox
  • Базова анімація 
  • Основні інструменти розробника 
  • Робота з GitLab, базові команди, створення свого репозиторію

Модуль 2: UI/UX design Basics

  • Базове знання Figma
  • Базове знання UI/UX
  • Основи сайтобудування

Модуль 3. Advanced HTML/CSS

  • Технологія Bootstrap 4 
  • Технологія Gulp
  • Просунута структура проєкту
  • Адаптивна верстка
  • Гумова верстка 
  • Препроцессори, а саме: Sass

Модуль 4. Basic JavaScript

  • Базові та об’єктні типи даних
  • Перетворення типів
  • Змінні й правила їх іменування
  • Умови, оператори, масиви, цикли, функції, робота з датами та часом
  • Введення в браузерні події
  • Робота з таймерами, localStorage
  • Області видимості
  • Контекст виклику
  • Обробка помилок
  • ООП в JavaScript – функції-конструктори, прототипи, класи

Модуль 5. Soft Skills

Модуль 6. Final Project

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

  • Для дітей віком від 12 до 15 років
  • До 15 дітей в групі
  • Система оцінки знань
  • Багато практичних завдань
  • Робота над власними проєктами
  • Сертифікат про закінчення навчання
Больше информации
Курс

Front-end Pro – Hillel IT school

Hillel IT school
Формат
Online
Начало занятий
28.10.2024
Длительность
38 занятий
Уровень
Для опытных
Язык обучения
Ukrainian
Стоимость
19 000 UAH за курс
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
Hillel IT school
  • JavaScript
  • Frontend
Подробнее

Після проходження курсу випускники здобудуть навички для застосування JavaScript на достатньому рівні, щоб писати скрипти та форми, навчаться працювати з AJAX, а також налаштовувати збірку проєкту. Успішне завершення курсу дозволяє претендувати на вакансії Junior Front-End Developer.

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

Знайомство з JS

  • Знайомство та план курсу
  • Введення в технологію веб-розробки
  • Підключення скриптів, перший запуск програми
  • Взаємодія з користувачем через примітивні функції
  • Git, Github

Змінні та оператори

  • Коментарі
  • Оголошення змінних
  • Сплив змінних
  • Порівняння var, let, const
  • Типи даних
  • Оператори

Умовні конструкції

  • Умовна конструкція if/else
  • Умовна конструкція switch
  • Тернарний оператор
  • Практика

Цикли

  • Введення в цикли
  • Види циклів
  • Цикл while
  • Цикл do…while
  • Цикл for
  • Інструкції break та continue
  • Вкладені цикли
  • Нескінчені цикли
  • Практика

Масиви

  • Основи роботи з масивами
  • Варіанти створення масивів
  • Методи для роботи з масивами
  • Перебір масивів за допомогою циклів for, for…in, for…of
  • Видалення елементів з масиву
  • Створення простих об’єктів
  • Практика

Основи функцій

  • Основи роботи з функціями
  • Варіанти створення функцій
  • Параметри функцій, значення за замовчуванням
  • Область видимості функції
  • Передача параметрів у функцію за значенням та за посиланням
  • Повернення значення з функції
  • Замикання
  • Лексична область видимості
  • Рекурсія

Контекст виконання функції

  • Глобальний об'єкт window
  • Функціональний контекст
  • Функції в об’єктах — методи
  • Методи підміни контексту
  • Стрілочні функції та їх відмінності від звичайних

Функції

  • Функція-коллбек
  • Функція вищого порядку
  • Перебір масивів за допомогою методів forEach, find, map, filter, reduce

DOM

  • Що таке DOM?
  • Отримання існуючих DOM-елементів
  • Динамічне створення та видалення нових DOM-елементів
  • Керування атрибутами та вмістом DOM-елементів
  • Можливі події
  • Додавання обробників подій DOM-елементів

Events

  • Фази обробки подій
  • Делегування подій
  • Об'єкт event та його методи
  • BOM-об'єкти

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

  • Основні елементи-керування
  • Базові навички динамічної роботи з елементами керування
  • Валідація отриманих даних від користувача

WebStorages

  • Cookies
  • LocalStorage
  • SessionStorage
  • Практика

Практика та Livecoding

Регулярні вирази

  • Створення регулярного вираза
  • Робота з регулярними виразами за допомогою методів
  • Модифікатори регулярних виразів
  • Структура шаблонів. Метасимволи. Дужки. Квантифікатори

Бібліотеки та фреймворки

  • Огляд популярних бібліотек та фреймворків
  • Встановлення бібліотек за допомогою NPM
  • Приклади роботи з розповсюдженими бібліотеками

Асинхронне виконання коду

  • EventLoop
  • Функції відкладеного виконання коду

ESNext

  • EcmaScript
  • Babel
  • Spread & Rest оператори
  • Деструктуризація масивів та об’єктів
  • Оператор Nullish coalescing
  • Оператор Optional chaining
  • Інші найновіші оператори

HTTP

  • Огляд клієнт-серверної архітектури
  • Що таке протокол HTTP та як він працює
  • Огляд технології Ajax
  • Методи роботи з сервером по технології Ajax
  • Приклади відкритих API
  • Технологія WebSockets

Promise

  • Вступ до Promise
  • Стан Promise
  • Обробка Promise за допомогою методів then, catch, finally
  • Одночасна обробка кількох Promise
  • Livecoding

ООП

  • Основні поняття ООП
  • Фунції-конструктори
  • Прототипне успадкування
  • Створення об’єкту з певним прототипом
  • Створення сутностей за допомогою class
  • Успадкування сутностей створених через class
  • Приватні властивості
  • Статичні властивості за методи class
  • Практика

Робота з асинхронними функціями

  • Створення власних асинхронних функцій
  • Обробка асинхронних функцій з інструкцією await
  • Обробка помилок

Системи збирання коду

  • Огляд сучасних систем збирання коду
  • Основи роботи з Gulp
  • Компіляція та зборка sass-файлів
  • Транспіляція та зборка js-файлів
  • Плагін ESLint

Webpack

  • Огляд можливостей Webpack
  • Встановлення та конфігурація Webpack
  • Налаштування базових лоадерів та плагінів до Webpack
  • Запуск локального серверу за допомогою Webpack

Node.js

  • Огляд технології Node.js
  • Створення сервера на Node.js
  • Приклад створення сервера за допомогою бібліотеки express на Node.js
  • Приклад роботи власного фронтенд та бекенд додатків
  • Огляд програми Postman

React

  • Огляд поняття SPA
  • Введення в React
  • Основні концепції React
  • Створення первого React-додатку
  • Основи роботи з JSX
  • Варіанти створення компонентів
  • Передача props до компонентів
  • Обробка подій у React-компонентах

Компоненти React

  • Етапи життєвого циклу компонентів
  • Порівняння класових та функціональних компонентів
  • Робота з класовим компонентом
  • Методи життєвого циклу класового компоненту
  • Робота зі state

Функціональні компоненти в React

  • Основи роботи з функціональним компонентом
  • Особливості роботи з хуками: useState, useEffect, useRef, useCallback, useMemo, useContext
  • Створення власних хуків

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

  • Робота з основними елементами керування форми

Маршрутизація в React

  • Основи роботи з бібліотекою react-router-dom

Бібліотеки для роботи з React-компонентами

  • Огляд бібліотек-компонентів AntD/Material UI
  • Робота з стилями у React за допомогою CSS-модулів та бібліотеки styled-components
  • Огляд бібліотеки для створення таблиць даних Ag Grid

Redux

  • Що таке state management?
  • Вступ до Redux та основні поняття
  • Основні етапи data flow у Redux
  • Інтеграція Redux з React-додатком
  • Робота з хуками useDispatch та useSelector
  • Middlewares на прикладі redux-thunk
  • Livecoding

Redux-Toolkit

  • Оптимізація роботи з Redux за допомогою Redux-Toolkit
  • Основні поняття Redux-Toolkit
  • Створення та використання RTK Query

TypeScript

  • Вступ до TypeScript – переваги та недоліки
  • Статична типізація у TypeScript
  • Типи та інтерфейси
  • Аліаси, можливі значення, необов’язкові параметри
  • Generics
  • Робота з TypeScript в React-додатку

Тестування React-додатків

  • Основні поняття тестування програмного забезпечення
  • Модульне тестування за допомогою бібліотеки Jest
  • Тестування React-додатків за допомогою бібліотеки React-Testing-Library

Екзамен

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

  • Для фахівців, які вже вміють верстати і бажають поглибити свої знання
  • Заняття проходять в режимі онлайн-трансляції
  • Особистий кабінет для кожного учня
  • Оперативна служба підтримки студентів
  • Відеозаписи занять зберігаються в особистому кабінеті
  • Усі записи уроків залишаються у студентів після закінчення навчання
  • Велика кількість практичних занять і Livecoding
  • Викладачі курсу - практикуючі фахівці, що працюють в топових компаніях
  • Можливість повернути всі внесені за навчання кошти до шостого заняття
  • Бонуси курсу:
    • тренінги по проходженню співбесіди та складанню резюме з HR-фахівцем компанії;
    • тестова співбесіда з технічним фахівцем.

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

  • Віталій Пархоменко - Front-end Developer at Capgemini Engineering
  • Володимир Кривошапов - Senior JavaScript Developer at Playtika
  • Любомир Рудько - Senior Software Engineer at N-IX
  • Денис Лебеденко - Front-end Developer at Reply
  • Денис Решетняк - Senior Front-end Developer at WorkBuzz
  • Валерій Тернавський - Software Developer at Sense Bank
  • Дмитро Прокудін - JavaScript Software Engineer at Capgemini Engineering
  • Олексій Павленко - Senior Full-stack Developer at Sitecraft
  • Дмитро Крулькевич - Software Engineer at Continuumua
  • Роман Яремій - Full-stack Developer at N-IX
  • Володимир Шкарупін - Senior Developer at Archer
  • Олексій Дом'янич - Senior Software Engineer at SoftServe
  • Антон Головін - Front-end Team Lead at ForForce
  • Андрій Посітко - Front-end Engineer at CHI Software
  • Василь Петров - Senior Front-end Engineer at Vodworks
  • Олексій Толстоног - Software Developer at SoftServe
  • Максим Бєлкін - DM & JS Team Lead at Capgemini Engineering
  • Валерій Хомченко - Front-end Developer at SOLAR Digital
  • Катерина Шиповська - Senior JavaScript Engineer, Software Architect at Boosta
  • Владислав Продан - Middle Front-end Developer at Eleks
  • Володимир Шайтан - Technical Lead at Zoot
  • Андрій Черненко - Front-end Developer at Wargaming
  • Владислав Проценко - Chief Technology Officer at Profair Games
  • Арсеній Деркач - Senior React.js Software Engineer
  • Роман Таран - Senior Front-end Engineer
  • Соломія Браташ - JavaScript Developer
  • Влад Балабаш - Solution Architect, Senior JavaScript Developer
  • Ігор Михайличенко - Software Engineer
  • Олександр Фурманов - Front-end Developer
  • Марія Манойло - Teacher at Hillel IT School
  • Сергій Котерняк - Software Engineer
Больше информации
Курс

Front-end Beginning. HTML/CSS – Projector

Projector
Формат
Online
Начало занятий
01.03.2025
Длительность
3 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
22 500 UAH за курс
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
Projector
  • Frontend
Подробнее

Базовий курс, який допоможе зробити перші кроки у вебпрограмуванні. А потім вирішити, куди розвиватися далі: пірнати у front-end чи обмежитися базовим набором для створення якісних вебінтерфейсів.

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

Інструменти розробки

  • Figma, VSCode
  • Термінал і робота з файловою системою
  • Системи контрол версій
  • Робота з Git

Вступ у HTML i CSS

  • Особливості та складники HTML
  • Будова HTML тегу, скелет HTML сторінки
  • CSS і його функції
  • Правила побудови таблиць стилів
  • CSS селектори, значення кольорів та розмірів
  • Підключення CSS на HTML сторінку

Посилання та зображення

  • Види посилання та його складники
  • Шлях до ресурсу
  • Атрибути посилань
  • Види, формати й атрибути зображень
  • Можливості SVG
  • Теги для гіперпосилань, зображень, групи зображення та підпису
  • Chrome DevTools для інспектування коду в браузері

Основи типографіки

  • Завдання й основні поняття типографіки
  • Групи правил для тексту та шрифтів
  • Підключення шрифтів на сторінку

CSS

  • Блокова модель
  • правила - display, float, z-index, overflow
  • Стилізація зображень
  • Селектори, їхня пріоритетність
  • Позиціювання елементів
  • Стилізація посилань

Списки й таблиці

  • Теги для різних видів списків
  • Лічильники
  • Списки визначень - dt, dd, dl
  • Основні теги для таблиць
  • Стилізація списків і таблиць

Теги для групування, семантика

  • Особливості тегів div і span
  • Семантика HTML, види блоків сайту

Flexbox

  • Стилі для батьківських та дочірніх елементів
  • Вирівнювання блоків
  • Побудова "колонок"

Grid

  • Групи правил для grid елементів
  • Відмінності між grid та flex
  • Побудова "колонок" і колонковий дизайн

Responsive Design

  • Складники та основні прийоми адаптивного дизайну
  • Media Query та Container Query
  • Дублювання HTML для різних медіа

Форми та їхня стилізація

  • Сутність форм, полів, груп полів та підписів до полів
  • Текстові поля та їхні типи
  • Селекти, чекбокси, кнопки та радіокнопки
  • Валідація форм
  • Додаткові типи полів для введення даних у формах
  • Стилізація елементів форм

Системи іменування класів

  • Функції систем іменування класів та архітектури CSS
  • Ознайомлення з методологіями - BEM, SMACSS, Atomic CSS, OOCSS
  • Поділ сторінки на структурні складники

Просунуті HTML/CSS фічі

  • transform
  • transition
  • animation
  • Сучасний HTML та CSS

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

  • Вебінари та відеолекції щопонеділка та щочетверга о 19:30
  • Real-life завдання
  • Курсовий проєкт
  • Регулярний фідбек
  • Сертифікат за здобутки
  • Можна повернути кошти протягом 7 днів від початку курсу

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

  • Тетяна Мельник - Frontend / Tech Lead в Projector
  • Ольга Шемена - Frontend Developer в BrainRocket
  • Юлія Євсєєнко - Frontend Developer
  • Леонід Костецький - Creative Director i Co-Founder в Emotion Agency / Куратор
  • Вікторія Комаровська - Frontend Tech Lead в 6-Systems Sixt Group
  • Василь Кошапов - Lead Frontend Developer в Limestone Digital
  • Вадим Васько - Frontend Developer в Software Service and Innovation
  • Андрій Кедись - Frontend Developer в Syndicode / Куратор
  • Владислав Єрмолаєв - Frontend Developer / Куратор
Больше информации
Курс

TypeScript – CyberBionic Systematics

CyberBionic Systematics
Формат
Online
Начало занятий
18.10.2024
Длительность
10 часов
Уровень
Для начинающих, Для опытных
Язык обучения
Ukrainian
Стоимость
2 739 UAH за курс
Вечерние занятияВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
CyberBionic Systematics
  • TypeScript
  • Frontend
Подробнее

В цьому курсі ви дізнаєтеся все, що необхідно для початку використання цієї мови програмування. Протягом 5 уроків, ви навчитеся користуватися інструментами для розробки і компіляції коду і освоїте синтаксичні конструкції, які є в TypeScript.

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

Введення. Змінні та функції

  • Навіщо використовувати TypeScript
  • Синтаксис TypeScript
  • Інструменти для роботи
  • Налаштування фреймворками
  • Створення HelloWorld додатки
  • Типи даних в TypeScript
  • Статична і динамічна типізація
  • Ambient Declarations
  • Об'єкти
  • Функції, Arrow function
  • Статичні типи

Класи і інтерфейси

  • Використання модифікаторів доступу
  • Accessors
  • Спадкування і використання ключового слова super
  • Робота з абстрактними класами
  • Використання інтерфейсів

Generics

  • Методи для роботи з масивами
  • Визначення узагальненого типу даних (Generic)
  • Generic і інтерфейси
  • Приклад створення словника
  • Обмеження при використанні generic
  • Шаблон Iterator
  • Використання Symbo
  • Використання генераторів

Модулі і простори імен

  • Використання просторів імен в TypeScript
  • Визначення модуля
  • Створення модулів
  • Використання завантажувачів модулів
  • Основи застосування Webpack

Практика

Даний урок присвячений практичному закріпленню матеріалу даного курсу

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

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

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

  • Олена Хижняк - Web Frontend Developer
  • Віталій Мазяр - Web Frontend Developer
  • Оксана Дмитрієва - Web Frontend Developer
  • Денис Ковтун - Web Frontend Developer
Больше информации
Курс

Практичний React – SoftServe Academy

SoftServe Academy
Формат
Online
Начало занятий
06.01.2025
Длительность
9 недель
Уровень
Для опытных
Язык обучения
Ukrainian
Стоимость
6 899 UAH за курс
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
SoftServe Academy
  • React
  • Frontend
Подробнее

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

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

Теми:

  • Create React App. JSX, Styles
  • JS for React (pure functions, destructurization, map, spread)
  • React - Key, State, Props, Events
  • OOP in JS
  • React - Lifecycle & Binding Event Handlers
  • Advanced JS (Asynchronous JS, Closures, Exceptions)
  • React Virtual DOM, Hooks (useState, useEffect)
  • Storage (local/session), Web workers, Service workers, Web socket
  • Composition, Context (useContext, useCallback Hook)
  • React State Management
  • Redux in React
  • Redux Toolkit
  • Tools (npm, linter, babel, webpack)
  • React Router
  • Node, Fetch,Axios
  • Refs, Higher-Order Component, DefaultProps
  • Tests (Intro to enzyme, react-testing-library as main)
  • MUI for React
  • Error Handling in React (Error Boundaries), creating custom Hooks

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

  • Практика насамперед: ти будеш кодувати, використовуючи завдання, схожі на ті, які зустрічаються на реальних проєктах в SoftServe
  • Мінімум теорії: курс для того, щоб кодувати. Якщо ж потрібно буде щось підівчити – ми зібрали усі необхідні відео та матеріали, щоб скоротити твій час на пошуки
  • 24/7 чат з учасниками в Discord: місце для твоїх опівнічних питань, веселих стікерів та спілкування з ментором
  • Усі завдання підготовлені менторами Softserve Академії, які знають про код все, адже працюють з ним щодня
  • Додаткові технічні е-курси
  • Розмовні клуби з англійської & селф-стаді
  • Короткі курси для розвитку софт навичок
  • Спільнота професіоналів-однодумців
Больше информации
Курс

FrontEnd – DAN IT Education

DAN IT Education
Формат
Online
Начало занятий
14.10.2024
Длительность
7 месяцев
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
5 400 UAH за месяц
Вечерние занятияВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
DAN IT Education
  • Frontend
Подробнее

Курс дозволить опанувати та зрозуміти принципи роботи HTML, CSS та JavaScript. На заняттях Ви навчитесь працювати з бібліотеками React.js, Redux, розумієте принципи побудови сучасних односторінкових додатків. Додатково отримаєте Soft навики, такі як робота в команді, розподіл задач, вміння презентувати себе та свої проєкти, критичне мислення та інше.

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

Підготовка до початку курсу

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

Модуль: Soft Skills

  • Основні комунікативні навички.
  • Орієнтування у ситуації спілкування.
  • Управління емоціями.
  • Емоційний інтелект.
  • Критичне мислення.
  • Робота у команді.
  • Самопрезентація.

Модуль 1. Частина 1: Основи HTML, CSS

  • HTML – засіб логічної розмітки веб-сторінки
    • Використовуючи структуру розмітки, можливо вносити дані на сторінку. У процесі першого модуля студенти навчаться описувати цю структуру, використовуючи HTML-теги
  • Основи CSS
    • Селектори CSS
    • Оформлення елементів
    • Управління розміром і положенням блоків на сторінці
    • Поля і відступи
    • Порядок верстки блоку
    • Тестування результатів верстки
    • Адаптивна веб-верстка
    • Нюанси кросбраузерності верстки
    • Базова анімація
    • Стандарт CSS3
    • Основні інструменти розробника
  • Основи JavaScript
    • Базові і об’єктні типи даних
    • Перетворення типів
    • Змінні і правила їх іменування
    • Умови, оператори, масиви, цикли, функції
    • Області видимості, замикання
    • Контекст виклику
    • Керуючі конструкції
    • Обробка помилок
    • Введення в браузерні події
    • Localstorage/Sessionstorage
    • Порядок обробки подій (event loop)
    • Взаємодія з браузером DOM
    • Функціями зворотного виклику (callback)
    • Знайомство з бібліотекою Jquery

Модуль 2. Advanced HTML/CSS

  • CSS методології на прикладі BEM
  • Верстка з піксельної точністю
  • Верстка з підтримкою Retina екранів
  • Крос-браузерна верстка
  • Web accessibility
  • Mobile first

Модуль 3. Advanced JavaScript

  • Основи об’єктно-орієнтованого програмування (ООП)
  • Базові шаблони проєктування
  • Основи функціонального програмування
  • Можливості стандарту ES6/ES7 (ECMAScript)
  • Також будуть розглянуті:
    • Конструктори
    • Прототипне наслідування (prototype)
    • Рекурсія
    • Модулі
    • Strict mode
    • Cookies
    • Async/ Await
  • Знайомство зі стандартами WebSocket, JSONP, AJAX, XMLHttpRequest, Promise, Single Page Application
  • Загальна інформація про RESTful API

Модуль 4. Основи роботи з бібліотекою React.js.

  • Верстка JSX
  • Віртуальний DOM
  • Components
  • Робота з Props/State компонента
  • React Router
  • Redux
  • Робота з ImmutableJS в React/Redux додатку
  • Робота з middleware, Redux-thunk
  • Redux-forms
  • Тестування додатку за допомогою Jest та Enzyme
  • Використання хуків у React

Воркшоп: Серверний JavaScript (BackEnd)

  • Знайомство з технологією Node.js
  • Інфраструктуру і використання пакетного менеджера NPM (package manager)
  • Фреймворк Express.js
  • Роботу з базами даних на прикладі MongoDB

Додаткові навички

  • Робота з Git Bash
  • Workflow від створення сховища до його відправки на віддалений сервер
  • Робота з гілками
  • Робота з файлами

Воркшопи та майстер класи

  • Курс Front End включає майстер-класи, воркшопи та участь у вебінарах від ізраїльських та українських фахівців

Soft skills, технічна англійська і підготовка до співбесіди

Фінальний проєкт

Команди студентів курсу фронтенд будуть працювати над фінальним проєктом за методикою scrum. Кожен проєкт розпочнеться з реалізації задачі клієнта. По закінченню фінального проєкту студенти-девелопери будуть презентувати його перед членами Наглядової ради.

Бонусний модуль: Англійська для ІТ

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

  • Живі заняття у вечірній час (19:00-22:00)
  • Система оцінки знань
  • Постійна підтримка ментора
  • Робота над реальними проєктами у команді
  • Увага до Soft skills
  • Допомога у працевлаштуванні

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

  • Ігор Тоболяков - Front End Developer в Newfold Digital
  • Віталій Мудрий - Software Engineer в Gravity
  • Роман Марченко - Senior Frontend Developer, Freelance
  • Арсеній Деркач - Front-end React developer в Revjet
  • Максим Матвеєв - FrontEnd developer, Freelance
  • Богдан Адмін - Senior Software Engineer, NDA
  • Іван Сердюков - Web development lead at Clario
  • Андрій Моргун - Middle front-end engineer, LULU Software
  • Станіслав Чірва - Senior Frontend (JS) Engineer, EPAM Systems
Больше информации
Курс

Programming Essentials – DAN IT Education

DAN IT Education
Формат
Online
Начало занятий
14.10.2024
Длительность
130 часов
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
5 000 UAH за месяц
Вечерние занятияВыдаётся диплом/сертификатСопровождение ментора
DAN IT Education
  • Frontend
Подробнее

Курс для вивчення основ HTML, CSS та Javascript. Після курсу кожен студент отримає повний набір навичок, які необхідні для працевлаштування, а також свій проєкт для портфоліо.

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

Модуль: Soft Skills

Блок 1. Основи HTML, CSS

  • HTML – засіб логічної розмітки веб-сторінки
    • Використовуючи структуру розмітки, можливо вносити дані на сторінку. У процесі першого модуля студенти навчаться описувати цю структуру, використовуючи HTML-теги
  • Основи CSS
    • Селектори CSS
    • Оформлення елементів
    • Управління розміром і положенням блоків на сторінці
    • Поля і відступи
    • Порядок верстки блоку
    • Тестування результатів верстки
    • Базова анімація
    • Стандарт CSS3
    • Основні інструменти розробника

Блок 2. Основи JavaScript

  • Базові та об’єктні типи даних
  • Перетворення типів
  • Змінні та правила їх іменування
  • Умови, оператори, масиви, цикли, функції
  • Області видимості, замикання
  • Контекст виклику
  • Керуючі конструкції
  • Обробка помилок
  • Введення в браузерні події
  • Порядок обробки подій (event loop)
  • Взаємодія з браузером DOM
  • Функціями зворотного виклику (callback)
  • Знайомство з бібліотекою Jquery

Фінальний проєкт

Реалізація landing page на HTML, CSS та Javascript з використанням SVG графіки, паралакс ефекту, перемикання вкладок, анімованої каруселі та анімованих блоків, використовуючи бібліотеку jQuery та плагіни до неї, а також з використанням бібліотеки для роботи із зображеннями.

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

  • Живі заняття у вечірній час (19:00-22:00)
  • Система оцінки знань
  • 15 практичних завдань
  • Дипломний проєкт для портфоліо
  • Допомога у працевлаштуванні

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

  • Андрій Моргун - Middle front-end engineer, LULU Software
  • Богдан Адмін - Senior Software Engineer, NDA
  • Роман Марченко - Senior Frontend Developer, Freelance
Больше информации
Курс
Рекомендуем

Frontend Developer – Itvdn

Itvdn
Формат
Online
Начало занятий
07.11.2024
Длительность
22 недель
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
28 922 UAH за курс
Гибкий графикВыдаётся диплом/сертификатВозможно трудоустройствоСопровождение ментораРеальный проект в портфолио
Itvdn
  • Frontend
Подробнее

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

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

HTML та CSS Стартовий

  • Введення в HTML. Типи елементів та атрибути
  • Введення в CSS та визначення розмірів блоків
  • Робота з відступами, властивість margin та робота з текстом і видимістю елементів
  • Верстання з використанням Flexbox
  • Комбінування селекторів та робота з фоном, властивість background
  • Семантичне верстання
  • Форми
  • Позиціювання елементів
  • Практика

JavaScript Стартовий

  • Введення в JavaScript. Змінні та типи даних
  • Рядки та оператори
  • Логічні структури
  • Масиви та цикли
  • Функції
  • Об'єкти
  • Практика

GIT - Основи роботи

  • Основи Git
  • Публікація репозиторію
  • Інтеграція з IDE

JavaScript Базовий

  • Пошук елементів і DOM дерево
  • Зміна DOM дерева. CSS стилі
  • Події. Частина 1
  • Події. Частина 2
  • Події. Частина 3
  • Функції конструктори
  • Класи
  • Класи. Наслідування
  • Контекст функції
  • Замикання
  • Форми та елементи управління
  • Перевірка даних форми
  • Cookies та Web Storage
  • Обробка винятків
  • Асинхронний код. Promise
  • Мережеві запити
  • Практика

HTML5 & CSS3 Поглиблений

  • Принципи побудови Grid розмітки, Шаблони сайтів
  • Мікродані та користувацькі дані
  • WebWorker. Audio, Video
  • Робота з графікою на стороні клієнта
  • Canvas
  • Анімації та градієнти
  • Sass основи
  • Практика

Практичний курс "7 кроків для успішної кар'єри в ІТ"

  • Знайомство з Кар'єрним сервісом у CyberBionic Systematics
  • Сайти пошуку роботи. Різниця, специфіка, рейтинг
  • Аналіз ринку праці для IT-фахівців
  • Реєстрація на сайтах для пошуку роботи та заповнення власних профілів
  • Створення резюме (CV)
  • Створення супровідного листа (Cover Letter)
  • Спілкування з рекрутерами
  • Підготовка до співбесіди з HR
  • Підготовка до технічної співбесіди
  • Як отримати офер і пройти випробувальний термін

Далі ви можете вибрати один з напрямків курсу:

TypeScript

  • Вступ. Змінні та функції
  • Класи та інтерфейси
  • Generics
  • Модулі та простори імен
  • Практика

Angular

  • Введення в Angular
  • Події та датабайдинг
  • Директиви, пайпи. Роль модулів Angular
  • Компоненти та їх робота
  • Основи роботи сервісів та їх роль у застосунку
  • Введення в HttpClient та RxJS
  • Форми в Ангуляр
  • Маршрутизація
  • Практичне заняття

React базовий

  • Введення в React
  • JSX у React
  • Основи React
  • Стан та життєвий цикл
  • Форми
  • Стилізація в React
  • Створення списку нотаток
  • Введення в роутинг
  • Створення сторінки помилки
  • Створення Модального вікна
  • Hooks
  • Оптимізація та продуктивність React застосунків
  • Практика

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

  • Ранкова (09:00 - 11:00) та вечірня (19:00 - 21:00) групи
  • 4 курсові проєкти
  • Пакет навчальних матеріалів з усіх уроків
  • Сертифікат про закінчення курсу (після захисту фінального проєкту та тестування)
  • Індивідуальні рекомендації тренера.

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

  • Денис Ковтун - Web Frontend Developer, Сертифікований тренер Microsoft
  • Тарас Заславський - FrontEnd Developer
  • Ростислав Силівейстр - WEB Frontend Developer
  • Віталій Мазяр - Web Frontend Developer, Сертифікований тренер Microsoft
  • Ілля Стародуб - Angular Developer - Creative Digital Agency Krokus, Microsoft Certified Specialist
  • Володимир Виноградов - Full Stack Developer, Microsoft Certified Specialist
  • Владислав Бєлік - React FrontEnd Developer, тренер-консультант за напрямком FrontEnd
Больше информации
Курс

Front-end розробник – Main Academy

Main Academy
Формат
Online
Начало занятий
Дата формується
Длительность
145 часов
Уровень
Для начинающих
Язык обучения
Ukrainian
Стоимость
31 200 UAH за курс
Вечерние занятияВыдаётся диплом/сертификатРеальный проект в портфолио
Main Academy
  • Frontend
Подробнее

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

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

Частина 1. Верстка

  • Git control version
    • Знайомство з git control version
    • Установка Git
    • Початкова настройка Git
    • Створення Git-репозиторію
    • Робота з віддаленими репозиторіями
    • Основи розгалуження та злиття
    • Управління гілками
    • Робота з гілками
    • Віддалені гілки
  • Photoshop & Figma
    • Знайомство з Photoshop
    • Формати графічних файлів
    • Робота з інструментами
    • Зміна розміру зображення
    • Фільтри
    • Нарізка та експорт макета веб-сайту + HTML
    • Знайомство з Figma
    • Реєстрація у Figma
    • Експорт зображення
    • Розбір отримання стилів у Figma
    • Клон макета у Figma
  • HTML & HTML5, Optimization
    • Знайомство з HTML
    • Структура HTML-документа
    • Заголовки, блокові та малі теги
    • Робота зі списками
    • Зображення, iframe, посилання
    • Таблиці, Форми
    • Відео, аудіо Нові теги в HTML5
    • Пошукова оптимізація
    • Сторонні та внутрішньосторінкові завдання
    • Мета теги
    • Контент використання
    • Ключові слова
    • Якірний текст
    • Теги заголовків
    • Атрибут зображення alt & title
    • 301 Redirect, canonical, 404
    • Robots.txt
    • Meta “robots” sitemap.xml
  • CSS & CSS3
    • Знайомство з CSS
    • Синтаксис
    • Підключення css файлу
    • Селектори CSS element, id, class
    • Селектори угруповання CSS background, background position CSS
    • Комбінатор text properties, fonts
    • Псевдо-елементи, псевдо-класи
    • Lists properties
    • padding, margin, border
    • position, display, float, z-index
    • CSS3 box-sizing property
    • Градієнт
    • CSS3 2D та 3D
    • CSS3 Animation
    • @keyframes
    • CSS3 Flexbox
  • Front-End Framework
    • BootStrap 4.0
    • Front-End Framework
    • Plugins Owlcarousel
    • Plugins Fancybox

Частина 2. JavaScript

  • JavaScript базовий
    • Огляд мови JavaScript
    • Огляд інструментарію засобів налагодження коду
    • Команди Console
    • Знайомство Змінні
    • Літерали шаблону
    • Примітивні типи
    • Типи даних. Оператори
    • Метод для String()
    • Об'єкт Math
    • Призначення деструктуризації
    • Вікна діалогів
    • Використання innerHTML
    • Використання If/Else
    • Операція вибору першого певного операнда (??)
    • Умовний доступ до властивостей
    • Switch
    • For (in & of, await)
    • Оператор in
    • Оператори While та Do/While
    • ToLocaleString() метод
    • Масиви даних
    • Операція розповсюдження масиву
    • Array.of(), Array.form(), Array length, forEach()
    • Методи ітератора для масивів
    • Згладжування масивів за допомогою flat() та flatMap()
    • Об'єднання масивів за допомогою concat()
    • Організація стопок і черг за допомогою push(), pop(), shift() та unshift()
    • Робота з підмасивами за допомогою slice(), splice(), fill() та copyWithin()
    • Асоціативні масиви
    • Стандартний клас Object, методи роботи
    • Поняття функції
    • Поняття стрілкових функцій
    • Анонімні функції
    • Callback функції
    • Конструктор функції
    • Рекурсія функції
    • Аргумент функції
    • Поняття та використання замикання
    • Регулярний вираз
    • Робота з рядками, датами
    • Конструкція try…catch
  • JavaScript просунутий
    • Огляд об'єктної моделі W3C DOM
    • Об'єкт Window
    • Властивості Window
    • Методи Window
    • Location, Location методи
    • History
    • Navigator
    • Screen
    • Огляд подій елементів у моделі DOM
    • Посилання на об'єкти за ідентифікатором або ім'ям
    • innerHTML
    • Events
    • setTimeout() & setlnterval()
    • Форма Валідації
    • Події миші та клавіатури для елементів керування
    • jQuery
  • JavaScript просунутий
    • Взаємодія із сервером
    • HTTP методи
    • XMLHttpRequest: властивості, методи
    • Опис модуля за допомогою define та виконання за допомогою require
    • Формати передачі даних від сервера JSON
    • URL API
    • Promise Об'єкти
    • Promise властивості & методи
    • Symbol об'єкт
    • Promise властивості & методи
    • Cookies. Доступ до cookies.
    • Технологія Ajax та робота з HTTP протоколами
    • localStorage & sessionStorage
    • IndexedDB
  • Фреймворк React
    • Знайомство React
    • Встановлення React
    • NodeJS
    • SPA: single page application
    • Структура проєкту
    • Файл структури проєкту
    • Запуск проєкту на React
    • React.Component
    • React className
    • React.Component tags
    • React JS (import\export)
    • React JS (css-modules)
    • React JS (Styled Components)
    • Styled Component Props
    • Render props
  • Робота збиранням проєкту Gulp
  • Сертифікація
  • Ефективне працевлаштування

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

  • Вечірні заняття (19:00 - 21:30) у режимі живих онлайн зустрічей
  • Велика кількість практичних завдань
  • Постійний фідбек від тренера
  • Навчальні проєкти
  • Сертифікат після успішного закінчення навчання
  • Кар’єрний тренінг з HR-фахівцями

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

  • Дмитро Верна - Frontend Developer
  • Марина Басієва - Front end Developer, Директор компанії Infocus
  • Микола Морозов - Front end Developer
Больше информации
Курс

HTML та CSS Advanced – IT-Столица

IT-Столиця
Формат
Online
Начало занятий
Будь-який момент
Длительность
10 занятий
Уровень
Для начинающих, Для опытных
Язык обучения
Ukrainian
Стоимость
5 900 UAH за курс
Гибкий графикВыдаётся диплом/сертификатСопровождение ментораРеальный проект в портфолио
IT-Столица
  • Frontend
Подробнее

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

Знайомство з адаптивною версткою

  • Введення в медіазапити
  • Знайомство з адаптивною версткою
  • Огляд популярних CSS-бібліотек
  • Знайомство з bootstrap - CSS-framework
  • Основні відмінності Bootstrap 3 і 4 версій
  • Grid - система сіток
  • Інші можливості Twitter Bootstrap
  • Практика

HTML5: дата-атрибути й інші корисні можливості HTML5

  • Що таке дата-атрибути
  • Що можна зробити за допомогою дата-атрибутів
  • Вбудовані атрибути
  • Як застосовувати дата-атрибути зі сторонніх скриптів
  • Якорі. Плавне прокручування
  • Практика

Сучасні методології верстки сторінки

  • Верстка Flex box
  • Напрямок розміщення елементів
  • Вирівнювання елементів по вертикалі і горизонталі
  • Вирівнювання тексту всередині блоку
  • Властивості: flex-flow, flex-grow, flex-basis, order
  • Практика

HTML5 та селектори

  • Які селектори перейшли з HTML4/HTML
  • Які нові селектори з'явилися в HTML5
  • Уявлення про контекстні селектори
  • Характеристика псевдокласів
  • Характеристика псевдоелементів
  • Що таке спрайти
  • Що входить в поняття "роловери"
  • Практика

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

  • Usability
  • Які задачі стоять перед користувачами
  • Якими принципами варто користуватися під час формування інтерфейсів для сайтів
  • Accessibility
  • Знайомство з технічним начинням, яке сприяє перегляду тексту
  • Обмежені можливості користувачів: які вони
  • Практика

HTML та CSS: складне застосування

  • Відносне та абсолютне позиціонування елементів
  • Фіксоване позиціювання елементів
  • Як поводять себе дочірні компоненти в позиціонуванні
  • Як відбувається обрізання блоку
  • Як відбувається переповнення блоку: overflow
  • Підтримка властивості overflow в різних браузерах
  • Яким чином відбувається введення зовнішніх ресурсів
  • За допомогою яких механізмів вводиться векторна графіка
  • Іконка сайту
  • ICO-формат
  • Які характерні ознаки підтримки піктограм у сфері всіляких браузерів
  • Практика

Методика сумісності веб-сторінок та всіляких браузерів

  • Умовні коментарі - це
  • Які скрипти використовуються для підтримки селекторів
  • Які скрипти використовуються для видозміни у поведінці браузерів, що вже застаріли
  • Огляд фільтрів
  • Практика

Методика використання атрибутів CSS3

  • Суть градієнтів
  • Суть анімації
  • Знайомство з веб-шрифтами
  • Яким чином відбувається багатоколонна верстка
  • Фонові механізми
  • Алгоритм закруглення вузлів
  • Знайомство зі зразком блоків Flаsh
  • Введення в технології, що підтримуються браузером
  • Практика

Макетна верстка

  • Алгоритм нарізання макету із файлу, що підтримує psd-формат
  • Процедура вибору розмірів
  • Процедура вибору типів верстки
  • Механізм верстки
  • Практика

Введення в типові рішення

  • Що в собі містять фреймворки
  • Характеристика CMS-шаблонів
  • Як відбуваються JavaScript-рішення
  • Знайомство з динамічним CSS
  • Практика

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

  • Викладачі практики
  • Корпоративне навчання
  • Можливість навчатися у вихідні
  • Можливість влаштуватися у провідні IT-компанії
  • Індивідуальне навчання

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

  • Володимир - Програміст
  • Ігор - Програміст
  • Володимир - Програміст
  • Олексій - Програміст
Больше информации

Страницы

Читайте нас в Telegram, чтобы не пропустить анонсы новых курсов.

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

Отзывы о курсах

Марина    12.10.2024

Навчаюся на курсі Front-end . Я новачок в IT. Багато читала і дозріла. Вчуся місяць. Поки що все виходить. Але хочу відзначити величезну підтримку від викладачів і куратора

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

Курси насичені, цікаві, корисні. Якщо ви все ще сумніваєтеся, то сподіваюся мій відгук допоможе вам визначитися з вибором)

Рекомендации: Рекомендую
5
Средняя: 5 (1 голос)
Lemon School
Курсы Frontend
Лиза   17.08.2024

На данный момент от начала учебы прошло больше месяца и могу сказать, что это уверенный курс для старта карьеры.

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

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

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

Проходжу курсурс Front-end (HTML/CSS +JS), все подобається. Домашні завдання є індивідуальні та групові, Дійсно допомагають відпрацювати пройдений матеріал і зануриться в роботу.

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

Страницы