Курс для тих, хто хоче стати Full Stack Developer з нуля. На заняттях ви опануєте усі необхідні інструменти frontend & backend розробки: HTML/CSS, JavaScript, React, React Native, Node.js, а також здобудете комплекс необхідних hard та soft скілів для роботи.
Програма курсу
HTML/CSS
Розробка інтерфейсів з нуля
- Що потрібно знати.
- Для чого потрібна ця професія.
- Що таке веб.
- Шляхи розвитку.
Початок роботи
- Налаштування середовища.
- Програми для роботи.
- Завантаження першого сайту.
Введення у HTML
- Теги та атрибути.
- Семантика.
- Робота з текстом.
- Зображення.
- Інтерактивні елементи.
- Списки.
Продовження HTML
- Інструменти розробника.
- Таблиці.
- Символьні підстановки.
- Медіаконтент, фрейм.
- Оформлення і валідація коду.
Введення в CSS
- Підключення стилів.
- Синтаксис, селектори.
- Каскадність і специфічність.
- CSS змінні.
Шрифти
- Підключення шрифтів.
- Локальні шрифти.
- Оформлення тексту.
Блокова модель
- Геометрія елемента.
- Типи елемента.
- Структурні псевдокласи.
Flexbox
- Основні концепції.
- Flex-контейнер і flex-елемент.
- Практичне застосування.
Розкладка CSS Grid
- Основні концепції.
- Grid-контейнер.
- Grid-елемент.
- Практичне застосування.
Декоративні ефекти
- Типи зображень.
- Фон.
- Градієнти.
- Тінь.
- Псевдоелементи.
Графіка
- Растрова графіка.
- Векторна графіка. SVG.
- Додавання SVG на сторінку.
- SVG-спрайт.
Позиціонування
- Типи позиціонування.
- Властивість overflow.
- Накладання елементів.
Анімація
- Трансформація.
- Переходи.
- Анімація.
Практика: тестування API
- Основи роботи.
- Елементи форм.
- Групування полів.
Валідація веб-форм
- Види валідації.
- Перевірка введених значень.
- Псевдокласи стану.
Препроцесори
- Препроцесори SASS, SCSS.
- Вкладені правила.
- Директиви.
- Вендорні префікси.
CSS Методології
- Навіщо потрібні методології.
- Методологія БЕМ.
- Блок, елемент, модифікатор.
Адаптивність і Адаптивна графіка
- Типи і види верстки.
- CSS media запити.
- Стратегії Mobile і Desktop first.
- Адаптив і ретинізація фонових та контентних зображень.
Іспит HTML/CSS
Іспит з пройденого матеріалу.
JavaScript
Введення
- JavaScript – що це таке.
- Підключення скрипта.
- DevTools.
- Визначення об'єктів, властивостей та методів.
- Типи данних.
Оператори
- Оператори.
- Вивід данних/Ввід данних.
- Вирішення логічних задач та побудова алгоритмів.
- Умови if/else та switch/case.
Масиви і цикли
- Масиви.
- Цикли.
- Методи присвоєння.
- Методи масиву.
- Області видимості.
Функції
- Функції.
- Стрілочні функції.
- Лексичне оточення.
- Контексти і виклики.
Замикання this
- Замикання this.
- Контексти і виклики.
- Call, apply, bind.
Об'єкти та класи
- ООП.
- Об'єкти.
- Інкапсуляція, абстракція, наслідування, поліморфізм.
- Практика.
ES6
- Конструктори.
- Внутрішні методи.
- Прототипи.
- ES6.
DOM
- DOM.
- Навігація по DOM.
- Властивості.
- Робота з DOM-вузлами.
Події
- Події.
- Форми.
- Event propagation.
- Drag'n'Drop.
Local Storage & Node.js
- Local Storage.
- Node.js.
- Установка і використання.
- Додавання/видалення бібліотек.
Асинхронний Js & дата
- Асинхронний JS.
- Синхронність, асинхронність, багатопотоковість.
- SetTimeout і setInterval.
- Дата.
- Promise.
Протоколи передачі даних
- TCP/IP.
- HTTP.
- HTTPS.
- Коди відповіді.
- Помилки і обробка.
REST API
- REST API.
- Ajax.
- Fetch.
- Практика.
WebPack & Gulp
Складання проєктів: WebPack, Gulp.
React
- Основи популярної бібліотеки.
- Створення зборки.
- Використання React на прикладах.
Іспит з JavaScript
React
Знайомство з React
- Що таке React.
- Налаштування і інструменти.
- Що таке JSX.
- Компоненти.
- Компоненти-класси vs Функціональні компоненти.
State & Події
- Ререндер компонентів.
- Що таке стейт.
- Що таке JSX.
- Робота зі стейтом, зміна та оновлення стейту.
- Події і SyntheticEvent Object.
Props, види рендеру
- Рендер за умовою.
- Рендер колекцій, Що таке key.
- Що таке Props.
- Передача пропсів між компонентами.
Життєві цикли компонентів
- Монтування, оновлення та розмонтування.
- Методи класового компоненту:
- componentDidMount;
- componentDidUpdate;
- componentWillUnmount.
Хуки частина 1
- useEffect.
- useLayoutEffect.
- useState.
- useReducer.
- useRef.
Хуки частина 2, кастомні хуки React memo
- Хуки для оптимізації, useMemo, useCallback.
- React memo.
- Що таке кастомні хуки, як їх використовувати.
Стилізація
- Inline Styles (інлайнові стилі).
- Звичайний CSS.
- CSS модулі.
- CSS in JS.
Форми
- Неконтрольовані елементи.
- Контрольовані елементи.
- Складні форми.
- Бібліотеки для роботи з формами.
HTTP запити
- Робота з REST АРІ, хороші практики.
- Обробка процесу завантаження.
- Обробка помилок, Error Boundary.
Реакт роутинг, частина 1
- Що таке URL, структура.
- Бібліотека React Router.
- Базовий роутинг Routes and Route.
- Вкладені роути.
- Компонент Outlet.
- Компоненти Link, NavLink.
Реакт роутинг, частина 2
- Робота з історією.
- Приватні роути.
- Програмна навігація "useNavigate" і "navigate".
- Lazy Loading.
- ErrorElement для обробки помилок в додатку.
Стейт менеджмент, useContext. Бібліотека Redux частина 1
- UseContext.
- Вступ до стейт менеджменту, які найпопулярніші.
- Вступ до бібліотеки Redux, Redux Toolkit.
- Базове налаштування бібліотеки Redux.
Бібліотека Redux частина 2
- Робота з Redux Toolkit.
- ConfigureStore.
- CreateAction.
- CreateReducer.
- CreateSlice.
React Native
Знайомство з React Native
- Що таке React Native.
- Особливості роботи.
- Expo.
- Відмінність React від React Native.
- Документація.
Теги і робота з данними
- Огляд базових компонентів.
- Введення даних.
- Обробка данних.
- AsyncStorage.
Стилі
Робота зі стилями.
Навігація
- Створення екранів.
- Переключення екранів.
- Передача данних між сторінками.
Додаткові включення
- Робота з картами.
- Робота з календарем.
- Доступ до данних.
API
- Підключення бібліотеки.
- Надсилання запитів.
- Обробка результатів.
Зовнішні посилання і QR
- Створення сторінки з зовнішніми посиланнями.
- Обробка QR-code.
Завершення
- Рефактор коду.
- Збірка білда для Android.
Node.js
Основи Node js. Цикл подій. Створення консольного застосунку
- Що таке Node.js.
- Робота з бібліотеками.
- Написання консольного застосунку та його запуск.
- Робота з дебагером у VSCode.
Основи Express. CRUD. Postman
- Встановлення.
- Що таке CRUD.
- Написання найпростішого серверу.
- Робота з Postman.
Бази даних. Реляційна база даних SQLite
- Види баз даних.
- Реляційні бази.
- Встановлення SQLite.
- Робота з SQLite.
- Мова SQL.
- Додавання у сервер роботи з базою даних.
Нереляційні бази даних. MongoDB. Схеми й методи Mongoose
- Відмінності реляційних і нереляційних баз данних.
- Встановлення MongoDB.
- Додавання у сервер роботи з базою даних.
Аутентифікація
- Безпека застосунку.
- Захист даних користувача.
- Додавання таблиці користувачів.
- Допуск до виклику ендпоінтів гостей (незареєстрованих юзерів), звичайних юзерів та адміністраторів.
Робота з файлами. Буфери. Завантаження файлів у базу даних
- Стандартна бібліотека роботи з файлами.
- Читання, створення, редагування та зберігання файлів.
- Обробка помилок.
- Завантаження файлів у базу даних.
Робота з об'єктами у Node.js
- Робота з об'єктами. Обмеження.
- Властивості об'єкту.
- Методи роботи з об'єктами.
- Цикл for…in.
Створення модулів. Тестування. Mocha. Chai
- Створення власних локальних модулів.
- Import та required.
- Тестування коду. Хто має писати тести?
- Приклад тестування коду за допомогою Mocha та Chai.
- Дебагер у тестах.
Фінальний проєкт. Розробка серверу. Деплой на Heroku. Допоміжні інструменти розробника: основи git, linter
- Завершення розробки серверу.
- Оформлення проєкту у репозиторії.
- Написання документації до проєкту.
Пошта. Docker
Вебсокети
Python
Введення в Python. Встановлення середовища
- Ознайомлення з мовою Python: історія, застосування
- Встановлення Python та налаштування середовища розробки
- Запуск першої програми на Python
Основи синтаксису Python: змінні, оператори, типи даних
- Змінні та їх типи: числа, рядки, списки, словники
- Оператори: арифметичні, порівняння, логічні
- Вбудовані функції для роботи з типами даних
Керуючі конструкції: умовні оператори та цикли
- Умовні оператори: if, else, elif
- Оператори порівняння та логічні вирази
- Цикли: while і for. Ітерування по послідовностям
Структури даних: списки, кортежі, словники
- Списки: створення, індексація, зрізи, методи
- Кортежі: особливості та використання
- Словники: ключі, значення, методи роботи
Функції та модулі
- Визначення та виклик функцій
- Параметри функцій: позиційні, іменовані
- Робота з модулями: імпорт, створення власних модулів
Введення в ООП. Класи та об'єкти
- Основні поняття ООП: класи, об'єкти, атрибути, методи
- Створення класів та екземплярів класів
- Ініціалізація об'єктів через конструктор
Наслідування та поліморфізм
- Принцип успадкування та його застосування
- Розширення класів, перевизначення методів
- Поліморфізм: загальний інтерфейс для різних класів
Інкапсуляція та абстракція
- Інкапсуляція: обмеження доступу до атрибутів та методів
- Абстракція: визначення загального інтерфейсу класу
- Абстрактні класи та методи
Принципи SOLID в ООП
- Принцип єдиного обов'язку (Single Responsibility Principle)
- Принцип відкритості/закритості (Open/Closed Principle)
- Принцип підстановки Барбари Лісков (Liskov Substitution Principle)
- Принцип розділення інтерфейсу (Interface Segregation Principle)
- Принцип інверсії залежностей (Dependency Inversion Principle)
Основи веб-розробки та архітектура клієнт-сервер
- Основні поняття веб-розробки: клієнт, сервер, HTTP-протокол
- Принципи роботи клієнт-серверної архітектури
Введення до FastAPI. Встановлення та перша програма
- Знайомство з фреймворком FastAPI: особливості, переваги
- Встановлення FastAPI та створення простої веб-програми
- Маршрутизація запитів та обробка маршрутів
Введення до баз даних та ORM (Object-Relational Mapping)
- Основи роботи з реляційними базами даних
- Поняття ORM та переваги його використання
- Інтеграція ORM SQLAlchemy з FastAPI
Визначення моделей даних та створення таблиць
- Визначення класів моделей даних з використанням SQLAlchemy
- Створення таблиць в базі даних на основі моделей
CRUD-операції та робота з даними
- Створення, читання, оновлення та видалення даних з використанням SQLAlchemy
- Основи роботи з сесіями та транзакціями
Введення до аутентифікації та авторизації
- Розрізнення між аутентифікацією та авторизацією
- Токени аутентифікації та їх роль у веб-програмах
Реалізація аутентифікації з використанням JWT (JSON Web Tokens)
- Генерація та перевірка JWT-токенів
- Інтеграція аутентифікації з FastAPI
Реалізація авторизації та управління доступом
- Розділення прав доступу користувачів
- Реалізація ролей та дозволів
Валідація даних та обробка запитів
- Валідація даних, що надходять від клієнтів
- Використання пайплайнів для обробки даних запитів
Робота з файлами та завантаження даних
- Завантаження та зберігання файлів на сервері
- Робота з зображеннями та іншими медіафайлами
Docker для розгортання веб-програм
- Основи Docker: контейнеризація, образи, контейнери
- Створення Docker-контейнера для FastAPI-програми
Оптимізація продуктивності
- Виявлення та усунення вузьких місць у програмі
- Кешування даних та оптимізація запитів до бази даних
Введення в тестування веб-програм
- Типи тестування: модульне, інтеграційне, функціональне
- Написання та запуск тестів з використанням бібліотеки Pytest
Створення API документації за допомогою Swagger
- Автоматична генерація документації на основі коду
- Інтеграція Swagger UI з FastAPI
Розробка фінального проєкту
Студенти розроблять свій власний веб-проєкт на основі вивченого матеріалу.
Розгортання фінального проєкту
Підготовка та розгортання фінального проєкту на віддаленому сервері з використанням Docker.
Soft skills IT
Що таке soft skills
- Які бувають?
- Де застосовувати?
- Як виміряти свій рівень володіння soft skills.
- Як покращувати свої скіли.
Soft skills для IT спеціаліста
- Для чого IT спеціалісту розвивати soft skills?
- Комунікація: як прокачати і де знадобиться.
- Креативність і гнучкість: як прокачати і де знадобиться.
- Самодисципліна: як прокачати і де знадобиться.
- Критичне мислення: як прокачати і де знадобиться.
- Уважність: як прокачати і де знадобиться.
- Проактивність: як прокачати і де знадобиться.
- Адаптивність: як прокачати і де знадобиться.
- Інші навички.
Цілі і їх досягнення
- Колесо балансу.
- Як зрозуміти чого хочу саме я?
- Як правильно поставити свої цілі (смарт).
- Як декомпозувати цілі.
- Як досягати своїх цілей?
Емоційний інтелект/Емпатія
- Що таке емоційний інтелект?
- Ща таке емпатія і чим відрізняється?
- Як це застосовувати з вигодою для себе.
- Особисті кордони при високому рівні емпатії.
Основи комунікації
- Що таке екологічна комунікація?
- Види комунікації.
- Бар'єри в комунікації.
- Ціль в комунікації, як її побачити і застосувати на практиці.
- Правила успішної комунікації.
Конфліктологія
- Що таке конфлікт? Чому це добре?
- Який ідеальний результат конфлікту.
- Види та способи розв'язання конфліктів.
- Як зберігати спокій під час конфліктів.
Ораторське мистецтво
- Навіщо нам рот?
- Як говорити так, щоб тебе почули?
- Як правильно, ефективно та швидко доносити свої думки.
- Страх говорити.
Ефективне навчання
- Що таке ефективне навчання?
- Як правильно навчатись?
- Принципи швидкого і якісного навчання.
- Як не забути все, що вивчив.
Основи фінансової грамотності
- Скільки грошей мені треба для щастя?
- Скільки грошей мені треба насправді?
- Як вести власний бюджет і знати куди і звідки приходять гроші?
- Лайфхак: де взяти гроші, коли їх нема?
Планування і тайм-менеджмент
- Як правильно визначити пріоритетність задач?
- Принципи планування і тайм менеджменту.
- Багатозадачність: добре чи погано? Як встигнути все?
- Трекінгові системи.
Особливості курсу
- Заняття проходять 3 рази на тиждень
- Запис кожного заняття буде доступний в особистому кабінеті
- Практичні домашні завдання
- Живі Q&A-сесії в онлайн-форматі
- Викладачі – практикуючі фахівці у IT-компаніях
- Додаткові переваги у пакеті "Pro"
Викладачі курсу
- Богдан Лущенко - Fullstack Developer
- Крістіна Малітовська - Frontend/Mobile Developer
- Дмитро Рябовол - Розробник UI інтерфейсів. Markup developer at Studytube
- Дарія Звягіна - Head of Product and Service
- Костянтин Полішко - Senior front-end developer at Calaton-systems USA
- Дмитро Бузоверя - Python Developer at AJAX Systems
Больше информации
Дякуємо, що поділилися своїм досвідом — він надихає й показує, наскільки важливою є щоденна самовіддача та дисципліна у навчанні. Ми дуже раді, що система навчання стала для вас справжнім викликом і водночас трампліном до нової професії. Бажаємо вам ще більше професійних перемог, цікавих проєктів і постійного розвитку)