Получить доступ

Дизайн-системы

Основа с Middle

Токены, библиотека компонентов, Storybook, доступность и версии.

Что важно знать

  • Токены: цвета, типографика, отступы, радиусы — в переменных, темы — сменой значений.
  • Компоненты с доступностью из коробки и композиционным API.
  • Безголовые библиотеки (Radix, React Aria) — поведение и доступность, оформление своё.
  • Storybook — документация и песочница; скриншотные тесты.
  • Версии: semver, changelog, кодмоды для ломающих изменений.

Критерии освоения

Middle ≈ 6 ч

  • Пишет переиспользуемые компоненты без бизнес-логики с понятным API и историями в Storybook
  • Использует токены дизайна через CSS-переменные для тем

Практика. Сделать 5 компонентов (кнопка, поле, модальное окно, выпадающий список, тост) с доступностью, темами на токенах и историями в Storybook.

Senior ≈ 10 ч

  • Проектирует библиотеку компонентов для нескольких продуктов с версиями и changelog
  • Организует процесс владения и принятия изменений в дизайн-системе

Практика. Вынести UI-кит в отдельный пакет с semver, автоматической публикацией, скриншотными тестами и описанием процесса изменений.

Вопросы с собеседований

Документация

← Вся карта «Frontend-разработчик»

Закрытая бета

Знать тему — половина дела

На живом собеседовании sotto слышит вопрос интервьюера и показывает короткий ответ и план. Оставьте контакт — пришлём доступ и промокод.

  • Промокод на 2 часа — сверх пробных 30 минут
  • Программа для Windows — скачать сразу, войти — через Яндекс ID или VK ID
  • Прямая связь с разработчиком: что улучшить — сделаем