занять
занять на тиждень
старт
За тиждень записалося
Залишилося
Навчися розробляти застосунки з нуля!
На курсі Full-Stack ти зможеш швидко засвоїти навички розробки на JavaScript з обох сторін — клієнтської і серверної.
Детальні уроки і практичні проєкти дозволять дізнатися, що таке Node.js, Express і React, як їх застосовувати, як створювати повноцінні веб-додатки з нуля, розробляти RESTful API.
Ти навчишся розбиратися в основах баз даних MongoDB і отримаєш всі необхідні навички для вирішення складних задач програмування і розробки веб-проєктів.
Цілі курсу
Навчитися розробляти повноцінні веб-додатки на JavaScript з нуля
Розібратися в основах серверної і клієнтської розробок на Node.js, Express і React
Ознайомитися з основними інструментами і бібліотеками, які використовують Full-Stack розробники
Навчитися створювати та використовувати RESTful API для побудови веб-додатків
Навчитися роботі з базами даних на прикладі MongoDB і вирішенню задач з їх допомогою
Вивчаємо такі технології
-
React
-
Node.js
-
expressjs
-
JavaScript
-
MongoDB
-
HTML5
-
CSS
-
Git
-
Github
-
DOM
-
TypeScript
Full-Stack розробка
Програма курсу
Full-Stack — JavaScript

-
Вступ. Установка необхідного ПЗ
Знайомство та план курсу
Типи файлів
Браузер
Мови програмування
Редактори коду
-
HTML
Структура HTML-документу
Теги, атрибути тегів
Розмітка тексту за допомогою HTML
Посилання, списки, таблиці
Зображення. Формати зображень
Форми
Медіа (video, audio). Iframe
Теги-орієнтири (header, main, aside, nav, section, article)
-
Git. Github
-
CSS
Каскадність. Спадкування
Підключення CSS
Рідні стилі. Normalize.css Reset.css
Селектори
Стилізація тексту, шрифти
Блокова модель
Float. Float layout. Clearfix
Position
Псевдокласи. Псевдоелементи
Flexbox. Flexbox layou
CSS Grid. Grid layout
CSS препроцесори, фреймворки, методології
-
Просунута робота з графікою
SVG
SVG спрайти
Іконочні шрифти
Адаптивна графіка. Тег picture
Оптимізація графіки
-
Адаптивна верстка
Viewport. @media
Одиниці вимірювання vh, vw, vmin, vmax, rem
Знайомство з концепцією Responsive Web Design
Mobile-first/Desktop-first
Оптимізація сторінки
-
Семантика і доступність
Семантична розмітка
Доступність для користувача інтерфейсів
-
CSS анімації
Transform
Transition
Filter
Animation
-
Знайомство з 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
Практика
-
Регулярні вирази
Створення регулярного вираза
Робота з регулярними виразами за допомогою методів
Модифікатори регулярних виразів
Структура шаблонів. Метасимволи. Дужки. Квантифікатори
-
Бібліотеки та фреймворки
Огляд популярних бібліотек та фреймворків
Встановлення бібліотек за допомогою 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
-
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
-
NodeJS
Eventloop
Стандарти, які підтримуються (ECMAscript 5, ECMAscript 6)
Core
Streams
Event emitter
-
Знайомство з асинхронністю
Callback
Promise
Async (caolan)
Sync/await
-
Знайомство з проміжними обробниками
Connect
-
Створення веб-сервера
HTTP
Express
-
Використання шаблонизаторів
Pug
Nunjucks
-
Робота з MongoDB
Query
Aggregation
-
Підключення авторизації і аутентифікації
-
Тестування і написання документації
В кінці курсу виконується дипломний проект.
Бонуси курсу
Випускники отримують сертифікат про закінчення курсу.
Кожен сертифікат має унікальний номер, за яким потенційний роботодавець може перевірити його валідність і побачити базові показники успішності.
Як проходить навчання
Переваги навчання у Комп'ютерній школі Hillel
-
Групи по 17 осіб Викладач приділяє час кожному студенту.
-
Викладачі практики У нас викладають тільки практикуючі фахівці з топових IT-компаній.
-
Система особистих кабінетів Ефективне і зручне навчання.
-
Оперативна служба підтримки студентів Термінові питання — своєчасне рішення.
-
Доступ до відеозаписів занять Записи уроків залишаються у студентів після закінчення навчання.
-
Практичні заняття Велика частина занять орієнтована на практику.
-
Що ми робимо для того, щоб ви досягли успіху?
-
Проводимо майстер-класи з підготовки резюме та пошуку роботи
-
Регулярно оновлюємо програми курсів під вимоги ринку
-
Запрошуємо викладати тільки кращих практикуючих фахівців
-
Розвиваємо нашу мережу партнерів серед топових IT-компаній
-
Наші викладачі часто самі забирають до себе наших кращих Студентів ;)
Наші викладачі та випускники працюють в топових IT-компаніях світу
Часті питання
-
Як я можу сплатити за навчання?
Оплата провадиться через виставлення інвойсу на E-mail через сервіси LiqPay та Fondy.
-
Як працює оплата частинами?
Ми пропонуємо можливість розбити вартість курсу на щомісячні платежі до 12 частин за допомогою розстрочки у ПриватБанку або Монобанку. При цьому вам не потрібно сплачувати додаткові комісії або відсотки банкам, оскільки Школа оплачує цю комісію за вас.
Якщо ви бажаєте скористатись оплатою частинами, будь ласка, зверніться до нашого менеджера у будь-який зручний для вас спосіб.
Докладніше про оплату частинами у нашому матеріалі.
-
Чи видається сертифікат про закінчення курсів міжнародного рівня?
Наш сертифікат про проходження курсів внутрішнього зразка. В першу чергу ми вам надаємо знання, що відповідають вимогам існуючих вакансій на ринку праці. В IT-сфері при прийомі на роботу на посаді початкового рівня абсолютно не важливо, які у вас є дипломи і яку сертифікацію ви пройшли. В першу чергу роботодавець на співбесіді буде розглядати те, що ви вмієте і в чому є досвід, а не який диплом ви зможете принести з собою. Це стосується як України, так і компаній, що знаходяться за кордоном.
До того ж багато наших курсів вам можуть дати знання, які вам знадобляться для проходження сертифікації віддаленим чином через інтернет. Дану сертифікацію можна пройти тільки віддалено і самостійно.
-
Чи будуть задавати домашні завдання? Чи перевіряється виконане завдання?
Так! Адже це обов'язкова і дуже важлива частина процесу вашого навчання, так як кожен Студент повинен закріпити весь отриманий на занятті матеріал вдома, виконуючи домашні завдання. Кожне задане ДЗ буде перевірятися викладачем, і по ньому ви будете отримувати фідбек. Також деякі завдання розбираються на наступному занятті. Без виконання домашній завдань ніхто не зможе домогтися бажаного результату.
-
Який потрібно мати комп'ютер, щоб навчатися на курсі Full-Stack — JavaScript?
Вимоги до комп'ютера для навчання на курсі Full-Stack — JavaScript.
Операційна система:
- Windows 10 64-біт
- macOS 10.13 або вище
- Linux: Ubuntu 16.04 - 20.04
Процесор* :
- Мінімум intel core i5 4-го покоління
- Рекомендується i5 7-го
Оперативна пам'ять:
- Мінімум 8 Гб
- Рекомендується 16 Гб
Пам'ять:
- Мінімально 500 Гб HDD і більш
- Рекомендується 200 Гб SSD і більш
* Допустимі аналоги від AMD
- Верстка сайту за допомогою HTML + CSS
- 123819
- 1761
Верстка сайту за допомогою HTML + CSS
дивитись 121 хв-
Савелій Сичов Software Engineer у Microsoft
- Як пройти співбесіду по JS? І навіщо?
- 89277
- 3538
Як пройти співбесіду по JS? І навіщо?
дивитись 71 хв-
Юрій Федоренко Senior Front-End Developer у MacPaw
- Як створити правильне меню, що випадає - HTML / CSS (float і flexbox верстка)
- 61507
- 868
Як створити правильне меню, що випадає - HTML / CSS (float і flexbox верстка)
дивитись 130 хв-
Савелій Сичов Software Engineer у Microsoft
- Замикання у JavaScript
- 48472
- 3125
Замикання у JavaScript
дивитись 6 хв-
Юрій Федоренко Senior Front-End Developer у MacPaw
- Створення чату на Node.js за 3 години
- 37706
- 657
Створення чату на Node.js за 3 години
дивитись 182 хв-
Юрій Чіхрай NodeJS Backend Developer
- Як пройти співбесіду по JS? І навіщо? vol.2
- 32034
- 1910
Як пройти співбесіду по JS? І навіщо? vol.2
дивитись 69 хв-
Юрій Федоренко Senior Front-End Developer у MacPaw