Contribute To This Project Download - Contribute To This Project Download de código fonte

Contribute To This Project

Outro código-fonte

1.0.0

Baixar

Contribuir para este projeto

Informações da imagem

Logotipo criado com? Por Candiddeer

Anúncio:
Você gostaria de se tornar um mantenedor neste projeto e ajudar a mantê -lo? Se você estiver interessado, leia o guia do mantenedor, junte -se ao nosso servidor Discord e solicite ingressar na equipe dos mantenedores do projeto.

Índice de acesso rápido

Introdução
Objetivos
Para quem é isso?
Por que eu preciso fazer isso?
O que vou contribuir?
Traduções
Configurar! :)
Contribuir
- Etapa 1: Fork este repositório
- Etapa 2: clonar o repositório
- Etapa 3: Crie uma nova filial
- Etapa 4: Abra o arquivo index.html
- Etapa 5: copie o modelo do cartão
- Etapa 6: aplique suas alterações
- Etapa 7: Compreenda suas mudanças
- Etapa 8: empurre suas mudanças para o github
- Etapa 9: envie um PR (solicitação de tração)
- Etapa 10: comemore
PRÓXIMOS PASSOS
Agradecimentos
Licença
Os 100 principais colaboradores

Introdução

Este é um tutorial para ajudar os colaboradores iniciantes a participar de um projeto simples e fácil.

Objetivos

Faça uma contribuição para um projeto de código aberto.
Fique mais confortável em usar o Github.

Para quem é isso?

Isto é para iniciantes absolutos. Se você souber escrever e editar uma tag âncora <a href="" target=""></a> , poderá fazer isso.
É também para aqueles com um pouco mais de experiência, mas que desejam fazer sua primeira contribuição de código aberto ou obter mais contribuições para mais experiência e confiança.

Por que eu preciso fazer isso?

Qualquer desenvolvedor da web, aspirante ou experiente precisa usar o controle de versão Git, e o GitHub é o serviço de hospedagem Git mais popular usado por todos. É também o coração da comunidade de código aberto. Ficar confortável usando o Github é uma habilidade essencial. Fazer uma contribuição para um projeto aumenta sua confiança e oferece algo para mostrar no seu perfil do GitHub.

Se você é um novo desenvolvedor e está se perguntando se precisa aprender git e github, aqui está a resposta: você deveria ter aprendido o Git ontem.

O que vou contribuir?

Contributor Card

Você vai contribuir com um cartão como este para a página da web deste projeto. Ele incluirá seu nome, seu identificador no Twitter, uma descrição curta e 3 links para recursos úteis para desenvolvedores da Web que você recomenda.

Você fará uma cópia do modelo do cartão dentro do arquivo html e personalizá -o com suas próprias informações.

Traduções

Este tutorial também está disponível em outros idiomas

Árabe (عربي)	Bangla (বাংলা)	Chinês (tradicional) (繁體中文)	Holandês	Inglês (inglês)
Francês (Français)	Alemão (Deutsch)	Hindi (हिंदी)	Italiano (italiano)	Japonês (日本語)
Coreano (한국어)	Polonês (Polski)	Português (português)	Russo (р рйий)	Sérvio (срсfia)
Espanhol (Español)	Turco (Türkçe)	Ucraniano (você	Norueguês (Norsk)	Malyalam

As documentações de traduções para projetos são bem -vindas. Leia Translation Guide para contribuir.

Configurar! :)

Observação

Este tutorial é baseado no PC do GitHub. Se você estiver confortável com o terminal, vá para este tutorial (clique aqui)

Primeiro vamos configurar para fazer o trabalho

Faça login na sua conta do GitHub. Se você ainda não tem uma conta, junte -se ao Github. Eu recomendo que você faça o tutorial do Github Hello World antes de continuar.
Baixe o aplicativo Github Desktop.
- Como alternativa, se você se sentir confortável usando o GIT na linha de comando, você pode fazê -lo aqui está o link para o tutorial da CLI.
- Se você usa o código VS, ele vem com o Git integrado e permitir que você faça o que precisamos diretamente do editor.
- No entanto, a maneira mais simples e fácil de seguir este tutorial é usar o GitHub Desktop.

Agora que você está configurando, vamos continuar com o negócio de contribuir para o projeto.

↑ Vá para o topo ↑

Contribuir

Torne -se um colaborador de código aberto em 10 etapas fáceis.

Tempo estimado: menos de 30 minutos .

Etapa 1: Fork este repositório

O objetivo aqui é fazer uma cópia deste projeto e colocá -lo em sua conta.
Um repositório (repo) é como um projeto é chamado no Github e um garfo é uma cópia dele.
Verifique se você está na página principal deste repositório.


Clique no botão do garfo

Agora você tem uma cópia completa do projeto em sua própria conta.

↑ Vá para o topo ↑

Etapa 2: clonar o repositório

Agora queremos fazer uma cópia local do projeto. Essa é uma cópia salva em sua própria máquina.
Abra o aplicativo Github Desktop. No aplicativo:


Clique no arquivo e depois clone o repositório

Você verá uma lista de seus projetos e garfos no Github.
Selecione <your-github-username>/Contribute-To-This-Project .
Clique em Clone

↪️ Um projeto bifurcado terá o símbolo do garfo à esquerda. Seu garfo terá seu próprio usuário do github

Isso levará um momento à medida que o projeto é copiado para o seu disco rígido. Eu recomendo que você mantenha o caminho padrão que geralmente é ..DocumentsGitHub .
Agora você tem uma cópia local do projeto.

↑ Vá para o topo ↑

Etapa 3: Crie uma nova filial

Depois que o repositório for clonado e você o abrir na área de trabalho do GitHub, é hora de criar uma nova filial.
Uma filial é uma maneira de manter suas alterações separadas da parte principal do projeto chamado Master . Por exemplo, se as coisas derem errado e você não estiver feliz com suas alterações, pode simplesmente excluir a filial e o projeto principal não será afetado.

↪️ Clique na `Current branch` e clique em `New`
↪️ Dê um nome à sua filial e clique em `Create branch`
↪️ Publique sua nova filial no Github

Você pode nomear o que quiser, mas como esta é uma filial para adicionar um cartão com seu nome ao projeto, chamá your-name-card é uma boa prática, porque mantém a intenção dessa ramificação clara.
Agora você criou um novo ramo separado do mestre.
Para as próximas etapas, verifique se você está trabalhando nesta filial. Você verá o nome da filial em que está no centro superior do aplicativo Github Desktop, onde diz a filial atual .

Não trabalhe no ramo master

↑ Vá para o topo ↑

Etapa 4: Abra o arquivo index.html

Agora precisamos abrir o arquivo que vamos editar com seu editor de código favorito.
Encontre a pasta do projeto no seu computador. Se você manteve o padrão, isso deve ser algo como your-computer > Documents > GitHub > Contribute-To-This-Project
O arquivo index.html está diretamente na pasta Contribute-To-This-Project .
Abra seu editor de código (sublime, vs Code, Atom..etc) e use o comando Open file e localize o arquivo index.html no diretório principal do projeto


↪️ Como alternativa, você pode localizar o arquivo no seu disco rígido, clicar com o botão direito e abrir com seu editor

Agora você tem o arquivo que você vai editar no seu editor e está pronto para começar a fazer alterações.

↑ Vá para o topo ↑

Etapa 5: copie o modelo do cartão

Faremos uma cópia do modelo do cartão para começar a trabalhar nele
Bem dentro do <body> , você encontrará uma seção <div class="container"> . Isso contém muitas outras seções.
As duas primeiras seções são exatamente como: <div class="row"> . Desabre -os clicando na seta pelas laterais no seu editor de código VS, conforme mostrado na figura abaixo. (Se você estiver usando outro editor, talvez não consiga usar o recurso. Você só precisará rolar para baixo). O colapso facilita a ocorrência de alguns componentes de código que você não precisará mudar.
Agora você deve ver a seção que abriga todos os cartões de contribuição: <div class="grid" id="contributions">

Dentro desta seção, você encontrará a seção rotulada == TEMPLATE ==
Copie tudo dentro da praça vermelha na imagem, desde o comentar Contributor card START para o comentário Contributor card END

Cole tudo diretamente abaixo do comentário, indicando; Bem no topo do cartão de colaborador mais recente.
Verifique se há uma única linha de espaço entre a extremidade do seu cartão e o início da última carta. Adicione também uma linha de espaço entre o início do seu cartão e a linha com o comentário === Paste YOUR CARD directly BELOW this line === . É uma boa prática manter nosso código o mais claro possível
Nunca use linters ou formatados de estilo. O projeto tem uma configuração mais bonita

Agora, este é o seu cartão para você personalizar e editar.

↑ Vá para o topo ↑

Etapa 6: aplique suas alterações

Agora vamos começar a editar o HTML, alterando os campos personalizáveis em nosso cartão.

↪️ Substitua 'Nome' pelo seu nome

Nota: Não altere class="name"

↪️ Insira o URL da sua conta do Twitter `href="Insert URL here"` , digite seu identificador no campo de texto

Se você preferir usar um contato que não seja o Twitter, precisará substituir o ícone do Twitter <i class="fa fa-x-twitter"></i> indo para a fonte de ícones incríveis que procuram o ícone certo e substituindo apenas a parte fa-x-twitter pelo novo ícone como fa-facebook , por exemplo. Em seguida, siga as mesmas etapas acima.


↪️ Conte -nos algo sobre você. Mantenha -o curto e doce. Pense mais como um tweet do que uma postagem no blog

↪️ Compartilhe com os links da comunidade 3 para recursos úteis para o desenvolvimento da Web. Isso pode ser qualquer coisa, um vídeo, uma palestra, um podcast, um artigo, uma referência ou uma ferramenta. Se você é um iniciante, não se intimide com isso, compartilhe o que você sabe, mesmo que ache que é básico. Você ficará surpreso com quantas pessoas se beneficiarão.

Link: Insira o link href="here" substituindo o # . Evite usar os encurtadores de URL ou URLs que não são do site que você está postando!
Título: Escreva uma breve descrição title="here" .
Nome: Escreva o nome do recurso no campo de texto >here</a> .
Certifique -se de salvar todas as suas alterações .
Teste suas alterações . Isso é importante! Abra o arquivo HTML no seu navegador (clicando duas vezes nele, por exemplo) e veja como será o seu cartão no site. Veja que a página inteira ainda parece a mesma e nada está quebrado. Clique em seus links e verifique se eles estão funcionando. Abra o console (Ctrl + Shift + J (Windows / Linux) ou CMD + Opt + J (Mac)) e verifique se não há mensagens de erro.
Ótimo, você terminou de editar seu código! As próximas etapas enviarão suas alterações no Github e, em seguida, enviarão -as para serem fundidas com o projeto principal.

↑ Vá para o topo ↑

Etapa 7: Compreenda suas mudanças

Volte para o aplicativo Github Desktop.
Suas alterações serão adicionadas automaticamente à área de estadiamento.
Isso significa que o Git registrou todas as alterações salvas .
Você pode ver isso refletido no aplicativo. Tudo o que você adicionou ao arquivo estará em verde e as exclusões serão exibidas como vermelho.


↪️ O próximo passo é chamado de `Commit` . Isso significa aproximadamente `confirm the changes`

↪️ É assim que o seu cabeçalho de desktop do Github deve ser. Observe o símbolo do garfo ao lado do nome do projeto no `Current repository` , sua `Current branch` terá o nome que você deu na Etapa 3

↪️ Para `Commit` você deve preencher o campo `Summary` . Esta é a mensagem de confirmação explicando o que você mudou. Nesse caso, `"Add my card information"` seria uma mensagem razoável. Opcionalmente, você pode adicionar uma `Description` mais detalhada. Clique no botão `Commit` . Seu botão dirá algo como `Commit to "your-branch-name"`

↑ Vá para o topo ↑

Etapa 8: empurre suas mudanças para o github

Suas alterações agora estão salvas ou comprometidas. Mas eles são salvos apenas localmente, que está no seu computador.
A sincronização de alterações locais com seu repositório no Github é chamada de push . Você está "empurrando" as alterações do seu repositório local para o repositório remoto no GitHub.

↪️ Clique no `Push`

Depois de alguns segundos, a operação está concluída e agora você tem exatamente a mesma cópia desta filial em sua máquina e no Github.

↑ Vá para o topo ↑

Etapa 9: envie um PR (solicitação de tração)

Este é o momento em que você estava esperando; enviando uma solicitação de tração (PR).
Até agora, todo o trabalho que você fez foi no garfo do projeto, que, como você se lembra, reside em sua própria conta do Github.
Agora é hora de enviar suas alterações no projeto principal para serem fundidas com ele.
Isso é chamado de solicitação de tração porque você está pedindo ao mantenedor de projetos original que "puxe" suas alterações no projeto deles.
Vá para a página principal do seu garfo no Github (ele terá o ícone do garfo e seu próprio nome de usuário na parte superior).
Na parte superior do repositório, você verá uma mensagem de solicitação de puxar destacada com um botão verde.


↪️ Clique na `Compare and pull request`

↪️ É assim que a página `Open a pull request` é.

Lembre -se de que você está tentando mesclar sua filial com o projeto original, não com a filial Master do seu garfo .
A imagem abaixo oferece uma idéia de como o cabeçalho da sua solicitação de tração deve ser.
À esquerda está o projeto original, seguido pela filial principal. À direita está o seu garfo e o ramo que você criou.


↪️ Crie uma solicitação de tração: Escreva um título, adicione informações opcionais na descrição e clique em `Create pull request`

Não fique perturbado com todas as opções. Você só precisa fazer essas três etapas por enquanto.
Deixe a opção Allow edits from maintainers marquem.
Agora, uma solicitação de tração será enviada ao mantenedor do projeto. Assim que for revisado e aceito, suas alterações aparecerão na página da web do projeto.

↑ Vá para o topo ↑

Etapa 10: comemore

É isso. Você fez isso! Agora você contribuiu para o código aberto no Github.

Você adicionou código a uma página da web ao vivo: https://syknapse.github.io/contribute-to-this-project

Suas mudanças não serão visíveis imediatamente ; Primeiro, eles precisam ser revisados, aceitos e mesclados pelo mantenedor do projeto. Uma vez fundido, seu cartão deve ser visível e viver na página.

É muito normal um revisor pedir alterações em um PR. Pense nisso como uma boa prática se isso acontecer com você. Fique de olho nos comentários e alterações solicitadas. Depois de fazer as alterações solicitadas (de volta à sua filial), tudo o que você precisa fazer é comprometer e pressionar suas alterações. O PR atualizará automaticamente com as novas alterações.

Prometo que vou tentar revisar e mesclar o mais rápido possível, mas faço isso no meu tempo livre, então alguns dias de atraso são inevitáveis.

↑ Vá para o topo ↑

PRÓXIMOS PASSOS

Volte daqui a um tempo para verificar sua solicitação de tração mesclada.
Você deve receber um email do GitHub quando suas alterações forem aprovadas ou se forem solicitadas alterações adicionais. E quando o PR é finalmente fundido com o mestre e seu cartão foi adicionado.
Você também pode aprender a contribuir com esta série gratuita : como contribuir para um projeto de código aberto no github
Se você achou este projeto útil , dê uma estrela no topo da página e tweet sobre ele para ajudar a espalhar a palavra
Você pode se juntar ao nosso servidor Discord
Você pode me seguir e entrar em contato? (Twitter) ou usando qualquer uma dessas outras opções
Este é um projeto de código aberto, além de contribuir com seu cartão, você pode ajudar a consertar bugs, melhorias ou novos recursos. Abra um problema ou envie uma nova solicitação de tração
Para ajudar a melhorar nossa comunidade, dê uma olhada na guia Discussões do Github, localizada ao lado de obter solicitações. Esta área é um local para se apresentar, entrar em discussões mais profundas sobre código aberto e se comunicar com os mantenedores do projeto. Você nos ajudará a criar esse recurso e aprimorar nossa comunidade?
Obrigado por contribuir com este projeto . Agora você pode ir em frente e tentar contribuir para outros projetos; Procure o Rótulo para opções de contribuição para iniciantes.
Também estou procurando colaboradores para me dar uma mão na revisão e fusão do PRS. Se você deseja fazer prática mais avançada do GIT, leia o guia do mantenedor, junte -se ao nosso servidor Discord e solicite ingressar na equipe do Project Keeners.

↑ Vá para o topo ↑

Agradecimentos

Este projeto é fortemente influenciado pelo grande projeto de primeiras contribuições de Roshan Jossey com seu excelente tutorial.

Também é particularmente inspirado pela grande comunidade em torno de #GoogleudacityScholars the Google Challenge Scholarship: Front-end Web Dev, classe da Europa de 2017.