Pular para o conteúdo principal

Getting Started

Este guia orienta os primeiros passos técnicos para contribuir com esta documentação. Você pode usar o GitHub Web, que é mais simples, ou configurar um ambiente local de desenvolvimento, ideal para alterações maiores.

Escolha sua Abordagem​

GitHub Web (mais simples)​

Ideal para edições rápidas e novos artigos via navegador:

  • ✅ Acesso direto sem instalar nada
  • ✅ Fácil para correções ou melhorias pontuais
  • ✅ Interface intuitiva do GitHub
  • ❌ Sem visualização local das alterações
  • ❌ Limitações para alterações complexas

Desenvolvimento Local (mais completo)​

Indicado para contribuições técnicas mais robustas:

  • ✅ Controle total sobre a estrutura do projeto
  • ✅ Teste local antes de enviar
  • ✅ Visualização em tempo real das mudanças
  • ✅ Possibilidade de trabalhar offline
  • ❌ Requer configuração de ambiente

GitHub Web​

Passo 1 – Fazer Fork​

  1. Acesse: https://github.com/tatyquebralayout/n8n-Doc-pt-BR
  2. Clique em Fork no canto superior direito
  3. Confirme na sua conta GitHub
  4. Aguarde a criação do fork na sua conta

O que acontece: Uma cópia do repositório é criada na sua conta, permitindo que você trabalhe sem afetar o original.

Passo 2 – Editar Arquivo​

Para corrigir conteúdo existente:

  • Navegue até o arquivo desejado no seu fork
  • Clique no ícone de lápis "Edit this file"
  • Faça suas alterações no editor web
  • Use a aba "Preview" para ver como ficará

Para criar novo conteúdo:

  • Vá até a pasta de destino no seu fork
  • Clique em "Add file" > "Create new file"
  • Digite o nome do arquivo com extensão `` (ex: 
    meu-artigo
    )
  • Escreva seu conteúdo seguindo o padrão da documentação

Passo 3 – Commit​

Use mensagens descritivas seguindo o padrão:

Exemplo de Commit Message
feat: adicionar tutorial sobre integração com ViaCEP
fix: corrigir link quebrado na página de instalação
docs: atualizar exemplo de configuração do webhook

Processo:

  1. Scroll até "Commit changes"
  2. Crie uma nova branch (recomendado) ou use a main
  3. Escreva uma mensagem descritiva
  4. Clique em "Commit changes"

Passo 4 – Pull Request​

  1. Clique em "Compare & pull request"
  2. Preencha o título seguindo o padrão: 
    feat: descrição da mudança
  3. Na descrição, explique:
    • O que foi alterado/adicinado
    • Por que a mudança é necessária
    • Como testar (se aplicável)
  4. Clique em "Create pull request"

Desenvolvimento Local​

Pré-requisitos​

Software necessário:

Verificação:

node --version  # deve ser 18+
git --version   # deve ser 2.0+

Passo 1 – Clonar Repositório​

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Clone seu fork
git clone https://github.com/SEU-USUARIO/n8n-Doc-pt-BR.git
cd n8n-Doc-pt-BR

# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Adicione o repositório original como upstream
git remote add upstream https://github.com/tatyquebralayout/n8n-Doc-pt-BR.git

# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Verifique os remotes
git remote -v

Resultado esperado:

origin    https://github.com/SEU-USUARIO/n8n-Doc-pt-BR.git (fetch)
origin    https://github.com/SEU-USUARIO/n8n-Doc-pt-BR.git (push)
upstream  https://github.com/tatyquebralayout/n8n-Doc-pt-BR.git (fetch)
upstream  https://github.com/tatyquebralayout/n8n-Doc-pt-BR.git (push)

Passo 2 – Instalar e Rodar​

# <ion-icon name="settings-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Instalar dependências
npm install

# <ion-icon name="code-slash-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Iniciar servidor de desenvolvimento
npm start

O que acontece:

  • Dependências são instaladas (pode demorar alguns minutos)
  • Servidor local inicia em http://localhost:3000
  • Mudanças são refletidas automaticamente no navegador

Passo 3 – Contribuir​

# <ion-icon name="grid-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Criar nova branch para sua contribuição
git checkout -b feat/minha-nova-funcionalidade

# <ion-icon name="grid-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Editar arquivos (use seu editor preferido)
# <ion-icon name="code-slash-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Exemplo: code docs/meu-artigo

# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Verificar mudanças
git status
git diff

# <ion-icon name="grid-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Adicionar arquivos modificados
git add .

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Fazer commit
git commit -m "feat: adicionar novo tutorial sobre automação"

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Enviar para seu fork
git push origin feat/minha-nova-funcionalidade

Passo 4 – Manter Fork Atualizado​

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Voltar para branch principal
git checkout main

# <ion-icon name="filter-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Buscar mudanças do repositório original
git fetch upstream

# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Aplicar mudanças
git merge upstream/main

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Enviar atualizações para seu fork
git push origin main

Checklist de Qualidade​

Conteúdo​

  • Português claro e direto
  • Exemplos testados e funcionais
  • Links válidos e atualizados
  • Informações precisas e atualizadas
  • Estrutura lógica e bem organizada

Código​

  • Frontmatter completo (title, description, keywords)
  • Markdown válido sem erros de sintaxe
  • Responsividade testada em diferentes telas
  • Ícones IonicIcon implementados corretamente
  • Links internos funcionando

Estrutura​

  • Arquivo no diretório correto
  • Nome do arquivo seguindo convenções
  • Sidebar atualizada (se necessário)
  • Imagens otimizadas (se houver)

Troubleshooting​

Problemas Comuns​

Erro: 

npm install
falha

# <ion-icon name="settings-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Limpar cache do npm
npm cache clean --force
# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Tentar novamente
npm install

Erro: Porta 3000 ocupada

# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Usar porta alternativa
npm start -- --port 3001

Erro: Git push rejeitado

# <ion-icon name="git-branch-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Atualizar branch local
git pull origin main
# <ion-icon name="document-outline" style={{ fontSize: '32px', color: '#ea4b71' }}></ion-icon> Tentar push novamente
git push origin minha-branch

Dicas Úteis​

  • Teste localmente antes de enviar PR
  • Use branches para cada contribuição
  • Mensagens de commit descritivas
  • Documente mudanças complexas
  • Mantenha fork atualizado regularmente

Canais de Suporte​

  • Issues no GitHub: Para bugs e melhorias
  • Discussions: Para dúvidas e discussões
  • Discord/Telegram: Para suporte informal
  • Email: Para questões privadas ou sensíveis
Comece com o que você já sabe. Cada contribuição fortalece o ecossistema técnico n8n.