Веб-разработка/Веб-технологии/

Основы работы с библиотекой ReactJS

Продолжительность 8 ак. часов

Ближайшая дата обучения: 25.09.2023

Связаться сейчас

О курсе

Разработка с React.js позволяет создавать мощные и эффективные веб-приложения с отзывчивым интерфейсом.

Освойте новый инструмент для работы с онлайн-школой OTUS.

Цели обучения

По окончанию курса слушатели смогут самостоятельно разрабатывать ReactJS приложения и сопровождать готовые разработки масштаба предприятия

Требования

знание основ JavaScript

Целевая аудитория

Веб разработчики

Программа обучения

8ч.

• ReactJS -библиотека для пользовательских интерфейсов с компонентным подходом.

• Что такое компоненты в ReactJS

Компонентный подход к разработке приложения с использованием JavaScript.

• Подключение библиотеки React

Сайт Reactjs.org. Все очень просто — из JavaScript приложения — делаем React приложение. Создание полноценного React компонента. Использование Babel компилятора. Анатомия приложения и пользовательского компонента.

• JSX

• JSX - это препроцессор, который добавляет синтаксис XML к JavaScript. Выражения в JSX. Определение тегов и их атрибутов в JSX, дочерних элементов, невозможность встраивания кода в JSX элемент (атака инъекций). Babel и преобразование эдементов к JS объектам. Встраивание JS в JSX компоненты, аттрибут key — уникально определяет объект JSX. Реализация методов в JSX объектах. Функция React.createElement -замена html на JS.

• Создание событий, передача событий в компоненты, работа с динамическими классами.

Метод bind. Определение логики на уровне приложения.

• Использование условных операторов для отображения динамических компонентов.

• Использование состояния state и жизненный цикл компонента. Асинхронные запросы.

• JSX — как синтаксический сахар

• JSX — как синтаксический сахар, тип React компонента и область видимости, правила именования, свойства props в JSX, spred атрибут (...) , проверка типов с PropTypes

• Работа с формами, валидация формы, отправка параметров формы REST сервису

• Ссылки ref и DOM

когда использовать ссылки ref, доступ к ссылкам, добавление ссылки ref на DOM-элемент, ссылки ref и функциональные компоненты, не контролируемый компонент DOM на основе тега input типа file