O projeto Ignite Design System V2 é uma biblioteca de componentes de IU reutilizáveis e bibliotecas de estilo para a criação de aplicações que utilizam React. Ela fornece elementos como caixas, cabeçalhos, botões, campos de entrada, caixas de seleção, formulários de várias etapas, e agora tooltips e notificações toast, entre outros.
O projeto tem como objetivo simplificar a implementação de elementos comuns da interface do usuário e, ao mesmo tempo, manter opções de estilo personalizáveis. Ao fornecer um conjunto abrangente de elementos pré-construídos e tokens de design, ele permite que os desenvolvedores criem interfaces de usuário consistentes e visualmente atraentes com mais eficiência.
🧩 Componentes prontos para uso e também customizáveis
🖌 Tokens de cores disponíveis para importação
📄 Documentação para auxiliar na utilização
⚙ Construído em TypeScript
ignite-design-system-v2.mp4
O layout da aplicação/componentes foi projetado pela Rocketseat e está disponível no Figma.
As seguintes ferramentas foram usadas para desenvolver esse projeto:
* Confira o arquivo package.json
Antes de você começar, certifique-se que você tem as seguintes ferramentas instaladas na sua máquina: Git, Node.js. Também é bom ter um editor para trabalhar com o código, como o VSCode.
- Clone o repositório:
git clone https://github.com/guipmdev/ignite-design-system-v2/- Mude para o diretório do projeto:
cd ignite-design-system-v2- Instale as dependências:
npm install- Execute todos os scripts dev usando o Turborepo:
npm run dev- Espere iniciar e depois acesse http://localhost:6006/ para visualizar a documentação
Este projeto está licenciado de acordo com os termos da licença MIT. Consulte o arquivo LICENSE para mais informações.
- Muito obrigado à Rocketseat pelo layout e pelas dicas de como montar este projeto
Feito com 💙 por @guipm.dev - Fique à vontade para entrar em contato comigo!