Разработка WEB-приложений на фреймворке React.js

Курс «Разработка WEB-приложений на фреймворке React.js» предназначен для тех, кто хочет овладеть навыками создания современных веб-приложений с использованием популярного фреймворка React.js. В ходе курса участники ознакомятся с ключевыми концепциями и инструментами, необходимыми для эффективной разработки, от создания компонентов до взаимодействия с сервером.

Общие сведения​

Объём программы

104 ак. часа (время на просмотр видеолекции и выполнение практических заданий, сдачи тестов и аттестации)

Стоимость обучения

37 060 рублей

Категория слушателей

к освоению программы допускаются лица, имеющие или получающие среднее профессиональное и (или) высшее образование.

Контакты

+7 (499) 317-91-92
+7 (903) 105-90-17
uc@mpt.ru

Запись на обучение

Документ об окончании

При успешном окончании обучения выдаётся удостоверение о повышении квалификации Российского экономического университета им. Г.В. Плеханова

Ознакомление с фреймворком React.js. Настройка рабочего пространства. Создание простого проекта. Компонент на примере карточки

  • React;
  • SPA – single page application;
  • Преимущества SPA;
  • Недостатки SPA;
  • Взаимодействие React с DOM;
  • Ключевые понятия в React;
  • Компоненты (components);
  • Видимые, невидимые и переиспользуемые компоненты;
  • Функциональные компоненты;
  • Классовые компоненты;
  • JSX (javascript syntax extension);
  • Встроенные и пользовательские компоненты;
  • Корневой элемент в JSX;
  • Обозначение классов в JSX;
  • Свойства (props) и состояние (state);
  • Правила свойств и состояний;
  • Stateful и stateless;
  • Перерисовка компонентов;
  • Создание React проекта;
  • Архитектура проекта;
  • Компоненты на примере новостной карточки;
  • Расширения для VS Code.

    • Bootstrap

  • Bootstrap;
  • Подключение Bootstrap;
  • Принцип работы Bootstrap;
  • Container;
  • Row;
  • Col;
  • Контрольные точки;
  • Col-auto;
  • Вертикальное выравнивание;
  • Горизонтальное выравнивание;
  • Упорядочивание;
  • Смещение колонок;
  • Практика: создание верстки с помощью Bootstrap;
  • Расстояния в Bootstrap.

    • API, HTTP-запросы, react hooks. Fetch. Жизненный цикл. Асинхронная разработка, axios

  • API;
  • Rest API;
  • Создание тестового API;
  • HTTP-запросы;
  • Протокол HTTP;
  • Запросы и ответы;
  • Методы;
  • Код состояния;
  • Структура;
  • React hooks;
  • Usestate хук состояния;
  • Useeffect хук эффекта;
  • Fetch;
  • Применение fetch в проекте;

    • Роутинг. Работа с формой. Слои, Внедрение фреймворка Nest.js. Принцип использования.

  • React router;
  • React router dom;
  • Компоненты react router;
  • Exact и strict;
  • Установка;
  • Применение в проекте;
  • Формы;
  • Установка react hook form;
  • React hook form;
  • Слои;
  • Библиотека leaflet;
  • Nest.js;
  • Установка;
  • Внедрение в проект react.

    • Context

  • Context;
  • Context.Provider;
  • Использование context;
  • Разработка проекта.

    • Framer motion. Figma

  • Framer motion;
  • Установка;
  • Компонент motion;
  • Трансформация;
  • Motion value;
  • Figma;
  • Страницы;
  • Слои;
  • Наименование слоев;
  • Фреймы;
  • Компоненты;
  • Auto layout;
  • Использование библиотек;
  • Знакомство с интерфейсами и создание макета.

    • Основы TypeScript

  • Основы TypeScript;
  • TypeScript;
  • Базовые типы языка;
  • Проблема переназначения;
  • Установка TypeScript;
  • Создание React приложения на TypeScript;
  • Онлайн компилятор кода TypeScript;
  • Строки;
  • Числовое значение;
  • Логическое значение;
  • Массивы;
  • Кортеж;
  • Произвольный тип;
  • Перечисления;
  • Объект;
  • Тип;
  • Интерфейс;
  • Отличия интерфейса от типа;
  • Установка TypeScript в проект;

    • Компоненты высшего порядка, переменные окружения. Production

  • Переменные окружения;
  • Компоненты высшего порядка (HOC);
  • HOC HIGHER-ORDER COMPONENT;
  • Доработка приложения;
  • Deploy на GitHub;
  • Хостинг на Vercel.com.

    • Примечание

    Программа повышения квалификации включена в состав дипломированных программ профессиональной переподготовки. Пройдя обучение, вы имеете возможность получить диплом, дающий право на ведение новой профессиональной деятельности.

    Узнать больше

    Калинина Александра Владимировна

    Подробнее

    По результатам обучения можно получить:

    Глубокое понимание фреймворка React.js и его ключевых концепций.

    Навыки разработки одностраничных приложений (SPA) с использованием React.js и Bootstrap для создания современного и адаптивного пользовательского интерфейса.

    Понимание принципов взаимодействия с сервером через HTTP-запросы, асинхронной разработки и обработки данных с использованием библиотеки axios и хуков React.

    Умение создавать компоненты высшего порядка (HOC) и использовать их для повторного использования логики в приложении.

    Навыки работы с формами и внедрение фреймворка Nest.js для разработки бэкенда приложения.

    Понимание принципов управления состоянием приложения через контекст и использование библиотеки Framer Motion для добавления анимаций и динамичности интерфейсу.

    Основы работы с TypeScript в проектах на React, что позволит писать более структурированный и типизированный код.

    Навыки развертывания готового приложения на платформе GitHub и Vercel.com для его публикации и доступности в сети.

    Преимущества программы:

    Гибкое обучение без ограничений по месту и времени благодаря дистанционному формату.

    Наглядные видео лекции, которые обеспечивают понимание сложных тем и примеры из реальной практики.

    Опытные преподаватели всегда готовы помочь вам преодолеть тупики и ответить на вопросы.

    Разнообразные практические задания, способствующие закреплению полученных знаний на практике.

    Получение удостоверения об успешном окончании курса, подтверждающего ваши компетенции в области React разработки.

    Мы вас ждём

    Присоединяйтесь к программе "Разработка WEB-приложений на фреймворке React.js" и овладейте навыками, востребованными на современном рынке труда. Начните свой путь к экспертизе в области программирования уже сегодня!