Do design ao código(Design System), com a padronização tanto no design UI/UX, quanto de componentes com a lib Storybook de um design simples de um form, mas que mesmo sendo o mais simples possível, da para extrair o máximo de padronização(patterns) dos componentes e fazer o storybook ficar super recheado e ter um centro dos componentes, para que o time de devs não fique perdidos com qual cor, tamanho, fonte etc usar em um botão por exemplo. E como boa pratica foi feito um CI/CD para que cada atualização no storybook é feito um build e o deploy no github pages automaticamente utilizando o Github Actions.
- Deploy do app Web(Vercel): https://maratona-ignite-lab-design-system.vercel.app
- Deploy do Storybook(Github pages): https://pedrohvfernandes.github.io/maratona-ignite-lab-design-system/
- Figma
- React
- TypeScript
- Node(Npm)
- Vite
- Storybook
- Workflows with yml. (CI/CD)
- TailwindCSS
- RadixUi
- Phosphor icons
- Clsx
- Storybook addons (a11y) for easily Acessibility.
git clone https://github.com/PedrohvFernandes/maratona-ignite-lab-design-system
cd maratona-ignite-lab-design-system
npm install
npm run dev
npm run storybook
- Linkedin: https://www.linkedin.com/in/pedro-henrique-vieira-fernandes
- Git: https://github.com/PedrohvFernandes
- Instagram: pedro17fernandes
- portfolio: PedrohvFernandes.github.io