Skip to main content

Contribuindo

A seguir está um conjunto de diretrizes que irão ajudá-lo para contribuir com nosso Design System. Por favor, reserve alguns minutos lendo estas diretrizes antes de criar uma _issue_ ou _pull request_.

Como contribuir

Há muitas maneiras de contribuir para o projeto. O código é apenas um meio possível de contribuição. Por exemplo, melhorias de documentação são tão importantes quanto mudanças de código.

Comentários: Diga-nos o que estamos fazendo bem ou onde podemos melhorar.

Apoio e suporte: Você pode colaborar em nossas Issues com possíveis soluções.

Relatório: Crie Issues com relatórios de bugs ou para sugerir novas funcionalidades para que possamos tornar o Delta ainda melhor.

Fluxo de trabalho de desenvolvimento

Após clonar o Delta, execute yarn para instalar as dependências. Então, você pode executar vários comandos:

  1. yarn storybook: inicia o servidor do Storybook e carrega histórias de arquivos que terminam com .stories.tsx.
  2. yarn lint: verifica o estilo do código.
  3. yarn test: executa o conjunto de testes por completo.
  4. yarn test:watch: executa o conjunto de testes por completo no watch mode.
  5. yarn generate: cria todos arquivos necessários para começar um novo componente.
  6. yarn build: execute build para todos os pacotes de componentes.
  7. yarn release: publicar pacotes alterados.

Storybook

Crie componentes isoladamente com o Storybook usando yarn storybook

Estilo de codificação

Com a padronização de codificação dos nossos componentes e funcionalidades, conseguimos manter uma melhoria constante e aprendizado sobre os seus resultados. Temos um guia de estilo de código para ajudar a orientá-lo.

Por favor, siga nosso estilo de codificação. O Delta usa Prettier e ESLint, portanto, se possível, habilite o linting em seu editor para obter feedback em tempo real.

  • yarn prettier formata o código.
  • yarn lint executa manualmente as regras de linting.

Por fim, quando você envia um Pull Request, eles são executados novamente por nossas ferramentas de integração contínua, mas esperamos que seu código já esteja limpo!

Testes

Todos os commits que corrigem bugs ou adicionam recursos precisam de testes.

Fazendo uma solicitação de pull

As solicitações pull precisam apenas de dois ou mais colaboradores para serem aprovadas.

Commit's

Antes de criar um Pull Request, verifique se seus commits estão de acordo com as convenções de commit usadas neste projeto.

Quando você cria um commit, pedimos que você siga a convenção @commitlint/config-conventional com as seguintes categorias:

  • feat: alterações que introduzem código completamente novo ou novos recursos
  • fix: alterações que corrigem um bug
  • refactor: qualquer alteração relacionada ao código que não seja uma correção nem um novo recurso
  • docs: alterações relacionadas às documentações (ou seja, README, ou docs para uso da lib)
  • test: alterações relacionadas a adição ou modificação de testes de integração ou unitários.
  • ci: alterações relacionadas à configuração da integração contínua (ou seja, ações do github, sistema ci)
  • chore: alterações no repositório que não se enquadram em nenhuma das categorias acima

Breaking Changes

Mensagem de commit com ! para chamar a atenção para quebra de compatibilidade

Exemplo: refactor!: remove support for Safari

Enviando uma solicitação pull

O Delta é aberto para ser utilizado por todo time de engenharia da Escale. Logo, Pull Requests são sempre bem-vindos, mas, antes de trabalhar em uma grande mudança, é melhor abrir um issue primeiro para discuti-lo com os mantenedores.

Mantenha seus Pull Requests pequenos. Assim o seu Pull Request terá mais chances de ser aceito. Não agrupe mais de um recurso ou correção de bug por Pull Request. Geralmente, é melhor criar duas solicitações de pull menores do que uma grande.

Clone o repositório para sua máquina local:

git clone git@github.com:escaletech/delta.git

Agora você tem um novo diretório chamado delta. Vamos entrar nele:

cd delta

Instale as dependências com yarn (npm não é suportado):

yarn install

Crie uma nova ramificação. Seguimos o seguinte padrão. Por exemplo CXM-2000/button

git checkout -b my-topic-branch

Faça alterações, confirme e envie para o repositório:

git push origin my-topic-branch

Por fim, vá para o repositório e faça seu Pull Request.

Novo componente

Se seu Pull Request é a criação de um novo componente, recomendamos usar o comando yarn generate para gerar a estrutura de arquivos inicial necessária seguindo nosso estilo de código. Para todo componente novo deve ser feito também sua documentação. Você pode ver mais sobre no próximo tópico.

O Delta utiliza o TypeScript para criação de seus componentes e funcionalidades. Se você não estiver familiarizado com essa linguagem, escreva seu código em JavaScript, um colaborador principal pode ajudá-lo a migrá-la para o TypeScript.

Documentação

Todos os componentes criados precisam de documentação demonstrando suas funcionalidades e casos de uso. Para criar a documentação de um componente você deve acessar o arquivo website/docs/components.

Como adicionar uma nova demonstração na documentação

Se, por exemplo, você deseja adicionar novas demonstrações para o componente de Botão, você deve seguir os seguintes passos:

O arquivo Markdown é a fonte da documentação do site. Então, tudo o que você escreveu lá será refletido no site. Nesse caso, o arquivo que você precisa editar é website/docs/components/actions/button.mdx.

Você terminou 🎉

Obrigado por mostrar interesse em contribuir com o Delta 💛, você é incrível.