Создаем UI-KIT с нуля на Storybook. Экспресс-гайд: от теории до публикации и использования

Друзья, вы можете больше узнать обо мне и моих услугах на сайте https://sigeev.ru

Также вы можете сразу узнать о интересующей вас услуге:

Менторство: https://sigeev.ru/#/services/mentoring
Консультация: https://sigeev.ru/#/services/consulta...
Тестовое собеседование (frontend): https://sigeev.ru/#/services/tech-int...

tg-канал: https://t.me/sigeev_frontend

В видео разберёмся чем отличается подход к работе на фрилансе и в большой компании, зачем нужна дизайн-система и ui-kit, а также создадим свой минимальный ui-kit на стеке React + Typescript + Storybook.

Таймкоды:
00:00 - О чем видео
00:25 - Фриланс vs Большая компания
02:53 - Дизайн-система и ui-kit
04:08 - Обзор дизайн-системы и storybook
04:47 - Инициализация проектов
06:55 - Обзор UI сторибука
07:26 - Создание переменных для стилей
09:37 - Создание иконок
10:25 - Создание компонента
14:17 - Создание историй компонента
16:53 - Создание документации вручную
17:44 - Публикация ui-kit
20:53 - Использование ui-kit в проекте

Полезные ссылки:

Мои услуги: https://sigeev.ru/

tg-канал: https://t.me/+RIFfH6Wx0GdlYmFi

Репозиторий с кодом: https://github.com/alex173828/sigeev-...
Дизайн-система: https://www.figma.com/community/file/...
Cборщик проекта: https://vitejs.dev/guide/
npm: https://npmjs.com/