me_edu
← Каталог
Программирование

React: первое приложение

Компоненты, пропсы, состояние и реактивный интерфейс

4.9(0) 0 учеников 7 ч 35 шаговНачальныйСложность 3/5
К
Команда me_edu
Бесплатный курс платформы

Чему вы научитесь

  • Компоненты, JSX и композицию интерфейса
  • Пропсы — передачу данных в компоненты
  • Состояние через useState и реактивность
  • Обработку событий и работу с формами
  • Условный рендер и списки с ключами
  • Эффекты useEffect и загрузку данных

О курсе

Полный курс React на несколько недель: компонентный подход и JSX, пропсы, состояние через useState, обработка событий и формы, условный рендер и списки с ключами, эффекты useEffect и загрузка данных, подъём состояния и композиция компонентов. Каждая тема — развёрнутое объяснение, разобранный пример с кодом, иллюстрация цикла рендера и практика с проверкой ответов.

Нагрузка

12 недель · 6 ч/нед

Структура

9 разделов · 35 шагов · практика после модулей

Результат

Итоговый проект и сертификат после завершения.

Параметры сложности

Прикладной: 3/5

есть расчет, проект и самостоятельные задания

Темп3/5
Практика5/5
Глубина2/5
Схемы3/5
Самостоятельность2/5
Место в базе знаний

План программиста

Сквозная траектория: Python, JavaScript, TypeScript, React, backend, SQL, тесты, Docker и портфолио.

Как устроено обучение

Методическая подача

Визуальный язык

структурные схемы, разборы примеров, контрольные вопросы и карты применения

Кейсы

реалистичные учебные ситуации, где теория сразу переводится в решение

Ритм практики

понятие, пример, самостоятельное действие, обратная связь, перенос в проект

Доказательство результата

итоговая работа с критериями качества и понятным результатом для портфолио

Учебный микс

Теория19
Видео1
Практика8
Проверка7
Схемы14
Задания45
Визуальный стандарт курса

14 визуальных материалов · 64% по предмету

требуется ручная ревизия: слишком много общих или нерелевантных схем

audit
Основные типы
логика · 5процесс · 3структурная схема · 3цикл · 2график · 1
Что требуется от иллюстраций
поток данныхсостояниеархитектурная схематестовый сценарий

Профессиональная программа

Измеримые результаты

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

Входной уровень

  • Базовая компьютерная грамотность
  • Готовность регулярно писать код и исправлять ошибки

Проверка знаний

  • Входная самопроверка: что уже понятно и где есть пробелы.
  • Короткая практика после каждого модуля с немедленной проверкой.
  • Промежуточный мини-проект, где несколько тем соединяются в одну задачу.
  • Итоговая работа с критериями: точность, объяснение, самостоятельность, применимость.

Итоговый проект

Консольное приложение или мини-сервис: чтение данных, обработка, отчёт, тесты и документация.

Академическая база

MIT OCW 6.0001 Introduction to Computer Science and Programming in Python

Университетская вводная программа по Python и вычислительному мышлению.

Guttag: Introduction to Computation and Programming Using Python

Учебник, связанный с MIT 6.0001.

National Academies: How People Learn II (2018)

Когнитивная наука обучения: предзнания, практика, перенос, обратная связь.

Biggs, J. Constructive Alignment

Курс строится от результатов обучения к заданиям и проверке.

Brown, Roediger, McDaniel: Make It Stick

Практика извлечения, интервальные повторения и смешанная практика.

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

9 разделов · 35 уроков
1Как учиться на этом курсе4 урока
34 мин3 схем3 заданий
  • Карта пониманияБесплатно8 мин
  • Что рисовать и фиксироватьБесплатно8 мин
  • Ритм практики и повторенияБесплатно8 мин
  • Проверка учебного маршрутаБесплатно10 мин
2Видеолекция2 урока
186 мин1 схем
  • React JS с нуля — полный курсБесплатно180 мин
  • Перед стартомБесплатно6 мин
3Компоненты и JSX4 урока
29 мин2 схем6 заданий1 проверок
  • Что такое компонентБесплатно7 мин
  • JSX — разметка внутри JavaScriptБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: компоненты и JSXБесплатно12 мин
4Пропсы4 урока
29 мин1 схем6 заданий1 проверок
  • Передача данных через пропсыБесплатно7 мин
  • Пропсы по умолчанию и childrenБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: пропсыБесплатно12 мин
5Состояние (useState)4 урока
29 мин2 схем6 заданий1 проверок
  • Хук useStateБесплатно7 мин
  • Правила состоянияБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: состояниеБесплатно12 мин
6События и формы4 урока
28 мин2 схем6 заданий1 проверок
  • Обработка событийБесплатно6 мин
  • Управляемые формыБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: события и формыБесплатно12 мин
7Условный рендер и списки4 урока
28 мин1 схем6 заданий1 проверок
  • Условный рендерБесплатно6 мин
  • Списки и ключиБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: условия и спискиБесплатно12 мин
8Эффекты и загрузка данных4 урока
29 мин1 схем6 заданий1 проверок
  • Хук useEffectБесплатно6 мин
  • Загрузка данных с сервераБесплатно7 мин
  • ПроверкаБесплатно4 мин
  • Практика: эффектыБесплатно12 мин
9Композиция и подъём состояния5 уроков
35 мин1 схем6 заданий1 проверок
  • Подъём состоянияБесплатно7 мин
  • Композиция и что дальшеБесплатно6 мин
  • ПроверкаБесплатно4 мин
  • Практика: композицияБесплатно12 мин
  • ИсточникиБесплатно6 мин

Отзывы

Пока нет отзывов.