Відео курс React Поглиблений - відео курси ITVDN
ITVDN: курси програмування
Відеокурси з
програмування

    Обери свою IT спеціальність

    Підписка

    Обери свою IT спеціальність

    Підписка

      Про курс

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

      На курсі ви навчитеся впроваджувати роутинг за допомогою бібліотеки React Router, використовувати CSS препроцесори та UI бібліотеки, навчитеся використовувати публічні API для отримання даних. Також ви будете використовувати Redux Toolkit для спрощення коду та розв’язання багатьох проблем, реалізуєте можливість логіну через сторонній identity provider та багато іншого.

      Читати далі...

      Цей курс входить до спеціальності:

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

      Для гарного розуміння матеріалів даного курсу рекомендовано пройти курс React Базовий, мати базові знання CSS та HTML та досвід використання HTTP API.

      Читати далі...

      Ви навчитеся

      • Будувати state management за допомогою Redux і Redux Toolkit.
      • Розуміти основи популярних CSS-фреймворків для стилізації.
      • Використовувати бібліотеку Material UI і її компоненти замість ручної стилізації.
      • Використовувати React hooks і створювати власні (кастомні) хуки.
      • Розуміти, як дослідити проблеми швидкодії React застосунку.
      • Використовувати React Developer Tools для дослідження дерева компонентів та профайлингу.
      • Розв’язувати проблеми з memory leak.
      • Використовувати React.lazy та Suspense для динамічного завантаження модулів, React Router для динамічного завантаження маршрутів.
      • Використовувати RTK Query для звертання до API.
      • Додавати автентифікацію для застосунку на основі OAuth2.
      • Використовувати мову запитів GraphQL для здійснення запитів та зміни даних на сервері.
      • Познайомитись із концепцією Server-side Rendering (SSR).
      • Дізнатися про Jest Testing Framework та його альтернативи. Навчитися тестувати компоненти за допомогою React Testing Library.
      Читати далі...
      Завантажити матеріали курсу Для отримання матеріалів курсу необхідно авторизуватися
      Отримати сертифікат Для отримання сертифікату необхідно авторизуватися
      • Тривалість: 10 год 5 хв
      • Курс створено: 07.02.2024
      • Уроків: 15
      • Оновлено: 07.02.2024
      • Мова: українська

      Що входить до курсу

      • 15 відео уроків
      • Домашні завдання
      • Тестування
      • Сертифікат
      • Перевірка ДЗ

      ×

      Ви відкрили доступ до тесту! Пройти тест

      Ви дійсно бажаєте відкрити доступ до тестування за курсом React Поглиблений на 40 днів?

      Увійдіть або зареєструйтеся для того, щоб продовжити перегляд безкоштовного відео

      На першому уроці курсу ми розглянемо загальний план уроків курсу. Ви навчитесь створювати React проєкт на основі TypeScript. Зможете додати роутинг за допомогою бібліотеки React Router. Розглянете спосіб налаштування базового Redux store з простим редюсером для відображення списку елементів. Також створите компонент для відображення інформації про фільми і налаштуєте СSS стилі для нього.

      Читати далі...

      На уроці ви розглянете що таке CSS препроцесори на прикладі Sass. Навчитесь використовувати CSS модулі та писати базові @media запити. Налаштуєте стилі для картки фільму та layout сторінки.

      Читати далі...

      Розглянемо UI бібліотеки, їхні типи та переваги. Зробимо огляд двох популярних UI бібліотек Material UI та Bootstrap. Познайомимось із підходом CSS-in-JS, його перевагами та недоліками. Також розглянемо базові можливості бібліотек emotion та styled-components.

      Читати далі...

      На уроці познайомимось із TMDB API для того, щоб відобразити список фільмів. Налаштуємо developer account та отримаємо token. Зробимо запит до Now Playing API із нашого проєкту за допомогою fetch. Збережемо список фільмів у redux store. Наприкінці підключимо бібліотеку Material UI і використаємо її компоненти замість ручної стилізації.

      Читати далі...

      На уроці розглянемо використання контексту в React разом із useContext хуком. Навчимось застосовувати хук useRef. Застосуємо портали для рендерингу поза піддеревом елемента. Додатково розглянемо error boundary для обробки помилок в компонентах.

      Читати далі...

      Навчитесь створювати власні (кастомні) хуки на прикладі useIntersectionObserver для завантаження фільмів під час скролінгу сторінки. Подивитесь на потенційний memory leak під час використання useEffect.

      Читати далі...

      Пригадаємо основні особливості HTML форм. Познайомитесь із загальними концепціями бібліотек Formik та React Hook Form та їхніми відмінностями. Створите форму для фільтрації фільмів за допомогою React Hook Form та компонентів Material UI.

      Читати далі...

      Розглянемо поняття мемоізації на прикладі React.memo, useMemo та useCallback. Подивимось, коли варто і не варто застосовувати React.memo та які переваги вона дає. Використаємо ці функції в нашому проєкті на практиці.

      Читати далі...

      На уроці познайомимось із React Developer Tools для дослідження дерева компонентів та профайлингу. Також розглянемо альтернативні способи програмного профайлингу частини дерева компонентів. Навчимось використовувати React.lazy та Suspense для динамічного завантаження модулів. Додатково подивимось на можливості React Router для динамічного завантаження маршрутів.

      Читати далі...

      Розглянемо проблеми, що виникають при роботі із core Redux бібліотекою на прикладі boilerplate коду. Познайомимось із бібліотекою Redux Toolkit, що покликана розв’язати ці проблеми. Подивимось на можливості RTK Query для завантаження даних в Redux застосунках.

      Читати далі...

      На уроці перепишемо Redux store та запити до API, використовуючи RTK Query. Розглянемо спосіб реалізації infinite scroll за допомогою RTK Query. Також будемо використовувати Redux DevTools для дослідження запитів в store.

      Читати далі...

      Познайомимось із мовою запитів GraphQL та основними елементами синтаксису для здійснення запитів та зміни даних на сервері. Розглянемо систему типів GraphQL для створення схеми даних.

      Обговоримо популярні бібліотеки для роботи з GraphQL в React та навчимось на практиці робити запити.

      Читати далі...

      Розглянемо поняття автентифікації та авторизації. Додамо можливість логіну через сторонній identity provider на прикладі Auth0. Створимо приватні маршрути для захисту сторінок, що вимагають логіну. Познайомимось із протоколом OpenID Connect та JWT токенами. Навчимось робити запити до API, що вимагає авторизацію через access токени.

      Читати далі...

      Познайомимось із концепцією Server-side Rendering (SSR), та порівняємо її із звичним рендерингом. Розглянемо Server React DOM APIs та hydration, які дають змогу реалізувати SSR. Зробимо огляд React meta-frameworks (Next.js, Remix та ін.). та їхньої ролі в SSR. Розглянемо React Server Components та їхню відмінність від звичайного Server-side Rendering.

      Читати далі...

      Поговоримо про те, які переваги дає написання тестів розробнику. Розглянемо основні типи тестів та їхнє застосування в frontend застосунках. Познайомимось із Jest Testing Framework та його альтернативами. Навчимося тестувати компоненти за допомогою React Testing Library.

      Читати далі...
      ПОКАЗАТИ ВСЕ

      Купуй передплатуз доступом до всіх курсів та сервісів

      Бібліотека сучасних IT знань у зручному форматі

      Вибирай свій варіант підписки залежно від завдань, що стоять перед тобою. Але якщо потрібно пройти повне навчання з нуля до рівня фахівця, краще вибирати Базовий або Преміум. А для того, щоб вивчити 2-3 нові технології, або повторити знання, готуючись до співбесіди, підійде Пакет Стартовий.

      Стартовий
      • Усі відеокурси на 3 місяці
      • Тестування з 10 курсів
      • Перевірка 5 домашніх завдань
      • Консультація з тренером 30 хв
      59.99 $
      Придбати
      CodeMaster
      • Усі відеокурси на 9 місяців
      • Тестування з 16 курсів
      • Перевірка 10 домашніх завдань
      • Консультація з тренером 60 хв
      • Професійні ключі на софт від JetBrains
      67.00 $
      134.00 $
      Придбати
      Акція
      Преміум
      • Усі відеокурси на 12 місяців
      • Тестування з 24 курсів
      • Перевірка 20 домашніх завдань
      • Консультація з тренером 120 хв
      169.99 $
      Придбати
      коментарі та обговорення
      Notification success
      Ми використовуємо cookie-файли, щоб зробити взаємодію з нашими веб-сайтами та послугами простою та значущою.