Онлайн-воркшоп

Знакомство с React

Напишем свой Instagram за 120 минут!

онлайн

Дмитрий Вакациенко

Team Lead Frontend Developer

Руководитель курса по React

До начала воркшопa осталось:

Описание воркшопа

Разберётесь с основой React! Этот урок познакомит вас с основополагающими концепциями механики библиотеки React; раскроет принципы работы внутреннего движка Fiber; объяснит, почему React-приложения настолько быстрые и отзывчивые.

Напишите своё React-приложение — Instagram! Во время урока вы научитесь работать с JSX-разметкой, которая легко создаёт страницы с динамическим контентом, cможете управлять отображением элементов, эффективно использовать один из основных паттернов React — conditional rendering и создадите правильную архитектуру React-компонентов.

Получите набор материалов! Для урока используется видеоматериалы и обновленные конспекты. В новом конспекте применяются нововведения React v16.6.4: современные подходы и практики, с примерами, советами и иллюстрациями.

Важно! Во время урока будет доступен чат, в котором наша команда будет отвечать на ваши вопросы в прямом эфире.

Этот урок будет полезен, если вы:

  • начинающий frontend-разработчик;
  • хотите познакомиться с React;
  • планируете использовать React в рабочем проекте;
  • в короткие сроки решили освоить React.

Требования к участникам:

HTML, CSS, базовые навыки JavaScript, настроить среду для разработки по инструкции, прочитать конспект к уроку, желание познакомиться с новой библиотекой и время!

Структура воркшопа

  1. Познакомимся с элементарной единицей — ReactElement.
  2. ReactComponent — игрок высшей лиги.
  3. Откроем для себя новый движок Fiber и механизм reconciliation.
  4. Виртуальный DOM и улучшенная производительность.
  5. Выполнение JavaScript-кода внутри JSX-разметки.
  6. Узнаем об атрибутах разметки.
  7. Как работает экранирование в JSX.
  8. Научимся создавать самозакрывающиеся теги.
  9. Обращение к компоненту через точку.
  10. Потренируемся писать комментарии в JSX.
  11. Изучим композицию компонентов.
  12. Узнаем как рендерить списки.
  13. Рассмотрим фрагменты.
  14. О рендеринге строк и чисел в новом React.
  15. Что такое conditional rendering и как его использовать?

Выберите удобный пакет участия

Стандартный

  • Набор учебный материалов
  • Инструкция по настройке среды окружения
  • Файлы презентаций тем, рассмотренных на уроке
  • Доступ к трансляции онлайн-воркшопа
  • Доступ к закрытому чату React-разработчиков — Lectrum Club
  • Исходный код, используемый на уроке

Расширенный

  • Всё, что включает Стандартный, и ещё:
  • Помощь в настройке среды окружения
  • Запись воркшопа в Full HD качестве
  • Персональный ментор в течение недели после воркшопа
  • Дополнительное практическое задание + код-ревью с расширенным фидбеком
Участие в пакете «Стандартный» — бесплатно
Участие в пакете «Расширенный» —