Projeto Ignite Lab System

Sobre

Aplicação desenvolvida durante o Ignite Lab com o intuíto de desenvolver um Design System, do Figma ao React.

Storybook

Desafios

• - Estrutura visual do Design System - Criação de uma base visual do Design System no Figma, definindo tokens e componentes que serão implementados no React;
• - Do Figma ao React, criando aplicação - Exportação dos tokens e components dentro do React, documentando tudo pelo Storybook;
• - Testar e automatizar - Aplicar testes automatizados dentro do Storybook, simulando interações do usuário e automatizar o deploy da aplicação usando o Github Actions.

Stacks utilizadas

• React
• TypeScript
• Jest
• Testing Library
• Figma
• HTML
• CSS
• Tailwind

Como testar localmente:

1. Clone o repositório git clone git@github.com:afstudiox/ignite-lab-design-system.git
2. Executar o o comando npm install na raiz do projeto para instalar as dependências.
3. Executar o o comando npm run dev na raiz do projeto para inicializar a aplicação.
4. Executar o o comando npm run storybook na raiz do projeto para visualizar a documentação.
5. Executar o o comando npm run test-storybook na raiz do projeto para executar os testes da aplicação.

Fontes de consultas:

• Javascript.com

• W3Schools

• MDN

• StackOverflow

©️ Direitos Autorais

Este projeto foi desenvolvido para fins de aprendizado por Andre Felipe dos Santos. É permitido baixar ou clonar o repositório para fins de estudo, porém não é permitida a publicação de cópias totais ou parciais do mesmo. Esta isenção de responsabilidade não abrange bibliotecas e dependências, que estão sujeitas às suas respectivas licenças.