Интерактивный тренажёр

Storybook

21 урок о том, как описывать компоненты историями: args и Controls, декораторы, документация, play-функции и проверка доступности. Читаете урок, правите код, а Storybook перерисовывает холст прямо в браузере.

Части курса

01 Часть 01

Первые истории

Пишем истории для кнопки: args, Controls, события и состояния.

5 уроков
Что внутри

Цель: Написать историю для компонента, настроить её пропсы и панель Controls.

02 Часть 02

Окружение и документация

Составные компоненты, render, декораторы, общие настройки и автодокументация.

5 уроков
Что внутри

Цель: Показать компонент с вложенным содержимым в нужном окружении и получить для него документацию.

03 Часть 03

Тесты и доступность

Форма входа: play-функции, проверки expect и аддон доступности.

5 уроков
Что внутри

Цель: Проверить поведение компонента историей и найти в нём ошибку доступности.

04 Часть 04

Документация и итоговая практика

Своя страница в MDX, живые истории в тексте, теги и описания компонентов.

6 уроков
Что внутри

Цель: Описать и проверить новый компонент, затем собрать Storybook для передачи.