
udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
Convert a Figma design to ReactJS components using Storybook
Этот курс — практическое руководство по тому, как преобразовать дизайн-систему из Figma в полностью типизированные, изолированные и производительные компоненты ReactJS с использованием Storybook. Материал ориентирован на разработчиков, которые хотят научиться строить масштабируемые библиотеки компонентов и работать так же, как это делают профессиональные продуктовые команды.
Курс шаг за шагом проведёт вас через весь процесс создания дизайн-системы: от анализа макетов до реализации, документирования и оптимизации. Вы научитесь разрабатывать интерфейсные компоненты, которые одновременно удобны в использовании, легко поддерживаются и отвечают высоким стандартам качества.
Вы узнаете методы извлечения структурных и визуальных паттернов из Figma, чтобы затем грамотно перенести их в код. Особое внимание уделено стандартизации, унификации и сохранению консистентности дизайн-системы.
Storybook станет вашей основной средой для изолированной разработки компонентов. В курсе вы научитесь:
Вы создадите полностью адаптивное приложение на ReactJS с собственной библиотекой компонентов. Задания построены по принципу возрастающей сложности, что помогает формировать мышление настоящего инженер-программиста.
В ходе курса вы разработаете важнейшие элементы дизайн-системы:
Также предусмотрены бонусные компоненты, включая Checkbox, Toggle, Radio и Tooltip. Все элементы разрабатываются с упором на надёжность, переиспользуемость и масштабируемость.
Каждый компонент будет строго типизирован, что обеспечит корректное использование библиотеки и повысит её предсказуемость. Вы освоите ключевые возможности TypeScript:
В финальной части курса вы научитесь собирать и оптимизировать библиотеку компонентов. После сборки её размер будет уменьшен до всего 360 КБ, что обеспечивает молниеносную загрузку страниц и высокую производительность приложения.
Курс будет полезен:
После прохождения курса вы сможете уверенно преобразовывать любые дизайн‑системы в мощные и удобные React‑компоненты, а также разрабатывать собственные библиотеки, применимые в реальных коммерческих проектах.
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
https://github.com/thijssmudde/tailwind-storybook-starter/tree/main