JavaScript Професійний курс частина 3

Мова викладання в курсі – російська. Незабаром буде доступна українська версія цього курсу.

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

Курс призначений для тих, хто пройшов “Професійний JavaScript, рівень 1”, “Професійний JavaScript, рівень 2 ” або для розробників, які бажають підняти свої навички.
Після проходження курсу ви будете впевнено створювати сучасні веб-додатки. Знатимете, як писати код, вмітимете його тестувати, а також уміло застосовуватимете патерни проектування.

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

– Актуальні стандарти якості: не потрібно перенавчатися після курсу.

– Розуміння повного циклу роботи розробника.

– Фундаментальні та структуровані знання необхідних технологій.

– Досвід роботи з дедлайнами та планування роботи.

Розділ 1
React
Розглянемо схему роботи на курсі. Познайомимося з популярною бібліотекою React. Дізнаємося які проблеми вона розв’язує і як може спростити наш проєкт. Підготуємо інфраструктуру для React-проєкту, розберемося як працюють компоненти і JSX.

– Огляд проєктів.
– Схема роботи на інтенсиві.
– React.

Що таке React.
– Як працює React.
– Які завдання ефективно вирішує.
– Virtual DOM.
– React Component.
– Додаткові інструменти.

JSX.

Компонентний підхід.

– Компоненти React.
– Властивості компонентів.
– Передача даних через властивості.
– Типізація властивостей.
– Вкладені компоненти.

Рендеринг компонент.

– Рендеринг списків.
– Умовний рендеринг.

Розділ 2
Тестування React
Познайомимося з інструментами та методиками тестування React-додатків. Налаштуємо інфраструктуру для тестування, напишемо тести для створених компонент.

– Jest.
– Enzyme.
– PropTypes.

Розділ 3
state
Покращимо знання про React і компоненти. Розберемо state, події та методи життєвого циклу компонента.

– state.
– Односпрямований потік даних.
– Stateless-компоненти, PureComponent.

Події.

– Обробка подій у компонентах.
– Synthetic React Events.
– Методи життєвого циклу.

React і форми.

Обробка помилок.

Розділ 4
React і патерни
Розбираємося з питанням, що таке архітектура програмного забезпечення і як її проектувати. Знайомимося та вчимося на практиці застосовувати патерни проектування.

Проектування.

– Чим відрізняється хороша програма від поганої.
– Навіщо проектувати програмне забезпечення. Цілі проектування.
– Архітектура програмного забезпечення.
– Інструменти для проектування.
– Патерни проектування.

– Які проблеми розв’язують патерни.
– З чого складається патерн.
– Види патернів проектування.
– Патерни в React.

– Прості компоненти (Stateless function).
– Умовний рендеринг (Conditional Rendering).
– Компоненти-обгортки (Proxy component).
– Стилізація компонентів (Style component).
– Компоненти вищого порядку (Higher-order component).
– Перемикання подій (Event switch).
– Render Props.
– Провайдер (Provider).
– Портали (Portals).

Розділ 5
Redux
Знайомимося з Flux-архітектурою: дії (Actions), диспетчери (Dispatcher), подання (Views) і сховища (Stores). Підключаємо до проєкту Redux і оновлюємо кодову базу.

– Flux-архітектура.
– Сховище, диспетчер, дії.
– Redux.

Розділ 6
Оптимізація продуктивності
Поговоримо про продуктивність React-додатків: які є особливості, на що слід звертати увагу під час проєктування компонент насамперед.

– Parse і compile Time.
– Профілювання компонент.
– Керування оновленням компонент.
– Рендеринг довгих списків і таблиць.

Розділ 7
Асинхронність у Redux
Навчимося впроваджувати асинхронний код у синхронну роботу Redux за допомогою Middleware.

– Thunk.
– Middleware.
– Взаємодія з сервером.

Розділ 8
React Router
Знайомимося з маршрутизацією в SPA-додатках. Додаємо в проєкт пакет react-router, створюємо публічні та приватні маршрути.

– Роутинг.
– history API.
– Компоненти Route, Link.
– Приватні маршрути.
– Редиректи.
– Згорнути / Розгорнути

Розділ 9
React і типізація
Познайомимося зі статичною типізацією. Обговоримо, які проблеми вирішує. Додамо до проєкту TypeScript.

Статична типізація.

Що це таке?
Плюси мінуси.
Статична типізація для JS.
TypeScript і React.

Підтримка React у TypeScript.
Інтерфейси.