Front-end Pro. Просунутий рівень після курсу Front-end Basic. Онлайн
Описание

Курс призначений для глибокого вивчення мови програмування JavaScript і бібліотеки React, яка використовується для створення складних Front-end додатків.
Популярна мова JavaScript використовується при створенні веб-додатків для додання інтерактивності веб-сторінок. Написання коду в React дуже схоже на роботу в HTML, що дає можливість легко почати писати код, упустивши синтаксис. Одна з головних особливостей React — свобода дій.
На курсі ви познайомитеся з принципами ООП, DOM, REST API і отримаєте практичні навички створення додатків з використанням «реакт-стека», що дозволить претендувати на посаду Junior Front-end Developer.
ЦІЛІ КУРСУ
- Навчитися взаємодіяти з серверами за допомогою JavaScript
- Освоїти ООП
- Навчитися працювати з REST API
- Вивчити всі особливості бібліотеки React
- Вивчити всі нюанси: від того, як працює DOM, до того, як зібрати додаток Webpack-ом
БОНУСИ КУРСУ
- Всі студенти цього курсу можуть відвідувати заняття з англійської мови
- Всі студенти курсу пройдуть тренінг з проходження співбесіди та складанню резюме з нашим HR-фахівцем
- Тестова співбесіда з технічним фахівцем
Дни недели занятий | на выбор |
---|---|
Время занятий | на выбор |
Занятий в неделю | 2 |
Длительность занятия | |
Часы занятий | |
Группы | |
Возраст аудитории | Студенты, Взрослые |
Вид подготовки | Базовый курс |
Город | Онлайн |
Преподаватель | специалист-практик |
Учебные материалы | |
Пробное занятие | |
Документ об окончании | Сертифікат |
Опции | Групповые занятия, Индивидуальное обучение |
Трудоустройство | Нет |
Условия трудоустройства |
Запись на курс
Программа обучения
Знайомство з JS
- Знайомство та план курсу
- Введення в технологію веб-розробки
- Підключення скриптів, перший запуск програми
- Взаємодія з користувачем через примітивні функції
- Git, Github
Змінні та оператори
- Коментарі
- Оголошення змінних
- Сплив змінних
- Порівняння var, let, const
- Типи даних
- Оператори
Умовні конструкції
- Умовна конструкція if/else 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
Екзамен
- Онлайн