Курси React

На цьому курсі будуть детально розглянуті питання, що стосуються хмарних сервісів, обробки інформації офлайн, запам'ятовування паролів, застосування анімації в React Native і роботи push-повідомлень на мобільних пристроях. Ви опануєте нові методи створення додатків для мобільних пристроїв на Android і iOS, навчитеся використовувати інструменти консолі розробника Facebook.

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

Теми:

• Як використовувати анімацію в React-додатках
• Модуль і система анімації в додатку на React
• Компонент ReactTransitionGroup для створення анімації
• Взаємодія різних компонентів для створення анімації
• Прості анімації меню за допомогою CSS-методів
• Анімація руху кола
• Анімація карток
• Як використовувати різні анімаційні стилі
• Як перетягувати картки
• Як відбувається обробка жестів в додатку
• Як налаштувати систему відгуків на жести
• Як реалізувати обробку екранних подій
• Створення об'єкта "Жест"
• Як повернути елементи й інтерполювати значення
• Налаштування свайпа: як визначити мінімальну дистанцію
• Функція зворотного виклику callback на свайп
• Як реалізувати одноразову авторизацію із застосуванням пароля
• Процес авторизації в додатку
• Огляд одноразового пароля
• Google Cloud Functions або звичайний сервіс
• Додавання проекту Firebase в додаток Android
• Відправлення запиту та обробка відповіді
• Як відбувається логування Facebook
• Аутентифікація в Facebook: етапи
• Як проводити налаштування і працювати в консолі розробника Facebook
• Налаштування бібліотеки Redux для створення додатків
• Система асинхронного зберігання даних
• Обробка інформації в offline-режимі
• Як зберегти й налаштувати стан додатка
• Як реалізується зберігання даних в Redux
• Push-повідомлення: реєстрація
• Push-повідомлення: огляд
• Як зберігаються дані Push-повідомлень
• Як генеруються Push-повідомлення
• Як відбувається тестування програми
• Налаштування елемента MapViews в React Native

Попередні вимоги

• Програму базового курсу React Native
• Основи роботи з системою контролю версій
• Знання JavaScript і CSS

Що можуть випускники курсу:

• Використовувати анімаційні вставки та переходи в додатках, роблячи їх більш динамічними
• Застосовувати компоненти MapView для визначення місця розташування користувачів
• Проводити налаштування кросплатформних push-сповіщень в призначених для користувача програмах
• На практиці застосовувати просунуті функції фреймворка React Native, щоб робити програми складнішими й функціональнішими

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

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

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

Теми:

• Патерни програмування при роботі з фреймворком
• Що собою являє екосистема React
• У чому полягають відмінності імперативного та декларативного стилей програмування
• Фреймворки JavaScript - переваги
• Компоненти props/state - відмінності, особливості застосування
• JSX - поєднання HTML і JavaScript. Переваги та практичне застосування
• Браузерні події й React.js
• React Router - маршрутизатор із застосуванням JSX
• Створення форм і керування ними
• Етапи життєвого циклу компонентів
• Технологія AJAX (Asynchronous Javascript and XML) - обмін даними з сервером у фоновому режимі
• Доступ до API за допомогою axios
• Як застосовувати NPM, Webpack, Babel і інші інструменти для налаштування React-компонентів
• Передача багаторазових компонентів Reusable Components в Redux-Form
• Управління станом додатку за допомогою Redux
• Асинхронні операції й Promises
• Розгортання додатку або деплой - етапи
• Динамічний рендеринг й індексування JavaScript-коду

Попередні вимоги

Щоб бути зарахованим на програму студент повинен володіти мінімально необхідними знаннями та навичками. Серед них: JavaScript, CSS, HTML. Також перед заняттями необхідно ознайомитися з системою контролю версій. Навчання проходить ефективніше, якщо студент вже має досвід роботи з іншими фреймворками, як наприклад, ECMAScript 6, Babel.js.

Після курсу випускники знають і вміють:

• Побудувати додаток, сайт, лендінг, використовуючи бібліотеку React.js
• Застосовувати інструменти JSX і Virtual DOM для створення інтерактивних додатків
• Створити самостійно SPA-додаток з нуля й адаптувати його під різні пристрої
• Використовувати бібліотеку React.js в командній роботі з декількома розробниками

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

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

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

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

Вступ до React

На уроці учні познайомляться з React, навчаться створювати простий додаток за допомогою Create React App.

JSX у React

На уроці учні познайомляться з JSX, навчаться писати прості компоненти за допомогою JSX.

Основи React

На уроці учні познайомляться з підвидами компонентів, дізнаються, що таке state у React компонентах, навчаться додавати події до елементів та працювати зі списками.

Стан та життєвий цикл

На уроці учні познайомляться зі станом та життєвим циклом в React компонентах, дізнаються різницю між функціональними та класовими компонентами, навчаться їх використовувати, а також коротко ознайомляться з Redux.

Форми

На уроці учні познайомляться з можливістю працювати з формами в React, а також з такими поняттями, як підйом стану та валідація з PropTypes.

Стилізація у React

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

Створення списку заміток

На уроці учні познайомляться з можливістю вибору типу компонента під час виконання, попрактикуються застосовувати знання props, state, lifecycle та інших, а також створять список нотатків за допомогою React.

Hooks

На уроці учні познайомляться з основними хуками React, принципами їх роботи та напишуть свій (кастомний) хук і закріплять пройдений матеріал на практиці.

Введення в роутинг

На уроці учні познайомляться з бібліотекою react-router, навчаться організовувати маршрутизацію у додатку.

Створення сторінки помилки

На уроці учні познайомляться із Запобіжниками, React.Fragment, Строгим Режимом у React, а також навчаться створювати сторінку помилки.

Створення модального вікна

На уроці учні познайомляться з Рефами, Context API і Рендер пропсами, створять модальне вікно з використанням контексту і рендер пропс.

Оптимізація та продуктивність React додатків

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

Практика

По завершенню курсу ви будете вміти:

• Застосовувати базові концепції побудови односторінкових додатків в екосистемі React
• Писати та розбивати додатки на логічні частини і компоненти
• Стилізувати додатки за допомогою CSS модулів
• Будувати прості односторінкові додатки за допомогою React

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

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

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

• Богдан Мартиненко - Frontend Developer
• Тарас Заславський - Frontend Developer
• Владислав Бєлік - React Frontend Developer
• Ростислав Сілівейстр - Web Frontend Developer
• Олексій Татаренков - Frontend Developer
• Олексій Кучеренко - Тренер-консультант напрямку Frontend

Курс допоможе розібратися з особливостями React. Протягом курсу розберетеся як працювати із даними та керувати станом додатка (Redux), навчитесь вільно використовувати нові можливості React та використовувати його для створення сучасних додатків.

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

Вступ

• Огляд структури курсу та роботи над ним
• Огляд інструментів які будуть використовуватись протягом курсу(Git, Github, Git flow, IDE, Chrome dev tools, NPM, Node.js)
• Як працює веб
• Огляд підходів до створення веб додатків(SPA, MPA, PWA). Розвиток даних підходів
• Що ж таке Framework
• Чому саме React

Повторення основ JavaScript

• Огляд мови в цілому
• Об’єкти
• Масиви
• Функції
• Асинхронний JS
• Нові стандарти ES6+
• Рекомендації по написанні якісного коду

DOM & BOM

• Події
• Навігація по елементах
• Доступні сховища даних у браузері та як працювати із ними
• Огляд інших браузерних API’s

React вступ

• Що таке React
• Як додати реакт на сторінку
• Переваги та недоліки
• VirtualDOM
• Як правильно розділяти додаток на компоненти
• React інструменти – create-react-app, відлагодження коду, розширення для браузера

JSX та рендеринг

• JSX огляд
• Рендеринг елементів
• Обробка подій у JSX
• Списки та робота із ними
• Умовний рендеринг
• Ref
• Фрагменти
• Рендеринг властивостей (Render prop)

Стан та властивості компонента

• Statefull та stateless компоненти
• Потік даних та обмін ними у компонентах
• PropTypes
• Антипатерни для стану та властивостей

Життєвий цикл компонентів

Форми та робота із ними

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

React роутинг

• History API
• React router

Управління станом додатка (Redux)

• Варіанти управління станом додатка
• Redux плюси та мінуси
• Flux архітектура
• Redux архітектура
• Побічні ефекти: міделвари (redux-thunk, redux-saga, redux-router etc)
• Структурування Redux у структурі проєкту
• Redux інструменти

Hooks API

• Огляд хуків які доступну у React
• Основи створення власних хуків та можливі варіанти їх застосування
• Кращі практики
• Антипатерни

Взаємодія із сервером даних через API

• Fetch API
• Пакети для надсилання реквестів
• Аутентифікація та ауторизація

Стилі у React

• Огляд інструментів для написання стилів
• Анімація у React

Фінальне заняття

• Тестування у React – огляд інструментів, загальні рекомендації
• React Native і React VR
• Куди рухатись далі

Вимоги для проходження курсу

• Знання HTML/CSS
• Знання JS на базовому рівні
• Знання DOM
• Буде плюсом знання GIT на базовому рівні

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

• Дипломний проєкт
• Двом найкращим студентам компанія компенсує вартість навчання
• Вебінар від Sr. Recruiter в Sigma Software: "Interview Easy or Hard"

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

Ярослав Сидорик - Software Developer (JavaScript) та ментор в Sigma Software

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

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

React

• Основи React
• Робота з віртуальним DOM
• React компоненти
• Прив'язка даних
• Стан компонента
• Життєвий цикл компонента
• React Hooks
• Робота із запитами
• Маршрутизація
• Робота зі станом (flux, redux)
• Реалізація проекту

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

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

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

• Іван Стельмах - Senior Software Engineer at Avenga
• Василь Цивінський - JavaScript Engineer at Software MacKiev
• Андрій Нагорний - React/React-Native Developer at GlobalLogic

Вивчаємо з простих прикладів (JSX, props, state) до хуків, redux (redux + redux toolkit). Робота з API, інтеграція з backend. Проект. Deploy на хостінг.

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

Вивчаємо:

• create-react-app
• Структура програми React
• Структура компонента React
• JSX
• Роутінг React
• SPA, MPA
• Події та функції React
• ref
• state, render
• Життєвий цикл компонента
• Створення елементів DOM
• Хуки
• redux, redux toolkit
• Інтеграція React та backend (PHP)
• Інтеграція React та backend (Node.JS)
• Проєкт

Спринти

• Створюємо перший додаток на React, вивчаєм структуру проєкту, знайомимось з JSX, компонентами
• Компоненти. Створення компонентів і вкладених компонентів
• Роутинг. Створення SPA і багатосторінкових сайтів
• Події і функції. Отримуємо значення з input
• Вивчаємо state в React
• Життєвий цикл компонентів в React
• Refs і DOM
• Створення елементів React
• Хуки
• Redux і redux toolkit (частина 1)
• Redux - store, reducers, action (частина 2)
• Redux (частина 3). Виводимо товари інтернет-магазину
• Redux (частина 4). Виводимо корзину інтернет-магазину
• React і PHP
• React і Node.js
• Огляд проєкту по курсу
• Проєкт. Налаштовуємо і запускаємо бекенд
• Проєкт. Створюємо компоненти і роутинг. Компонент Create
• Проєкт. Компонент Note, створення і збереження повідомлень. Форми, видимість блоків
• Проєкт. Робимо активну навігацію, добавляємо Bootstrap
• Deploy проєкту на хостинг. Розгортаємо React і Node.js на сервері

Вимоги до проходження курсу

• Впевнені знання JavaScript, або проходження курсу JavaScript 2.0
• Рекомендовано пройти курс "Методи масивів"

Проєкт

Розробляємо проєкт - створення сайту для обміну нотатками з можливістю видалення нотатки після перегляду. MPA додаток з роутером, створенням нотаток та занесенням їх до бази даних, отриманням нотатки з хешу, видаленням після перегляду. Оформлення - фреймворк Bootstrap.

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

• 21 спринт 87 тасок
• Проєкт
• Допомога та підтримка
• Розбір та усунення багів
• Доступ без обмежень по часу
• Сертифікація