Como usar GitHub?

Por mais que o git seja uma ferramenta excelente para o versionamento e distribuição de códigos, muitos desenvolvedores não o conhecem ou não o utilizam. Este post tem como objetivo trazer os conhecimentos necessários para que a partir do zero, você possa dominar os conceitos gerais do git, e usar o github para guardar seus projetos na nuvem.

Índice

1. O que é Git?

2. O que é GitHub?

3. Criando conta no GitHub

4. Criando repositório no GitHub

5. Adicionando chave SSH no GitHub

6. Instalando Git

7. Configurando git

8. Clonando repositório do GitHub com git

9. Fluxo de trabalho do git

10. Comandos básicos do git

11. Mãos à obra

12. Errei o commit, como corrijo?

13. Utilizando git pull

14. Utilizando git branch

15. Utilizando git merge

O que é git?

Git é um sistema de controle de versão de arquivos, o qual permite o desenvolvimento de um projeto, por várias pessoas simultâneamente, sem o risco de uma alteração sobrescrever a outra sem ser indentificada.

Imagine o cenário no qual duas pessoas estão alterando um arquivo ao mesmo tempo, sem um sistema de versão isso seria um caos, certo?

Uma das funções do Git é justamente permitir que um arquivo possa ser editado por pessoas diferentes, ao mesmo tempo.

Outro aspecto interessante é a criação de branch, que nada mais é do que um snapshot do seu projeto.

Vamos supor que seu projeto seja um site HTML, e que você queira criar uma página nova, mas não quer que vá para produção, pois precisa testar bastante antes.

Nesse caso, você cria um branch, faz todas as alterações que desejar, testa, e quando estiver tudo certo, você faz um merge no branch oficinal — normalmente chamado de master — e sua página estará pronta para produção.

O que é GitHub?

O GitHub é uma plataforma de hospedagem de código para controle de versão e colaboração. Ele permite que você e os outros trabalhem juntos em projetos de qualquer lugar do mundo.

Criando conta no GitHub

Para criar uma conta no GitHub, acesse o site github.com e preencha o formulário.

Ponha um username legal, pois fica visível em todos os projetos que você trabalhar. Além disso, é ótimo para por no seu LinkedIn.

Após preencher o formulário clique no botão Sign up for GitHub. Você será redirecionado para outra página para validar um captcha. Depois da validação, clique no botão Create an account.

Agora será necessário escolher qual é o plano da conta que acabou de criar. Por padrão vem selecionado free, então basta clicar no botão Continue.

A próxima tela é apenas um questionário de preferências, basta clicar no link skip this step.

Sua conta já foi criada, porém você precisa validar seu e-mail.

O GitHub enviou uma mensagem para o e-mail que você escolheu para sua conta. Basta clicar no botão Verify email address e pronto.

Criando repositório no GitHub

Agora que já tem uma conta criada e verificada no GitHub, vamos à criação do repositório do projeto. Para isso clique no link Create a repository.

Na imagem acima estamos criando um repositório público cujo nome é tutorial-2019, com o arquivo README.md embutido, o qual contém uma descrição do projeto. É super importante que você crie um repositório, para que possa fazer os testes contidos nesse post. Após preencher o formulário, clique em Create repository.

O repositório ficará disponível no endereço https://github.com/username/reponame.

• username - É o nome do usuário que você escolheu quando foi criar a conta no GitHub

• reponame - É o nome que você escolheu na criação do seu repositório

No nosso exemplo: https://github.com/tutorialgithub2019/tutorial-2019

Adicionando chave SSH no GitHub

Para que não seja necessário digitar a senha toda vez que for fazer push, devemos adicionar nossa chave pública no GitHub, dessa forma o login será feito via SSH.

Primeiro copie sua chave pública. Em sistemas *UNIX e no Mac OS, execute o seguinte comando no terminal e depois copie o resultado:

cat  ~/.ssh/id_dsa.pub

Agora no GitHub, no canto superior direito de qualquer página, clique na foto do seu perfil e clique em Settings.

Na barra lateral Personal settings, clique em SSH and GPG keys.

Clique em New SSH key.

No campo Title, adicione uma descrição para a chave nova, e em Key cole sua chave pública.

Após preencher o fomulário, clique no botão Add SSH Key. Você será redirecionado para uma página na qual terá que digitar sua senha para confirmar a adição da sua chave pública.

Caso você tenha sucesso, sua chave será adicionada à conta GitHub.

Instalando Git

Abaixo seguem as instruções para instalar o git, no sistema que você utiliza.

RHEL / CentOS

sudo yum install -y git

Debian / Ubuntu

sudo apt-get install -y git

Mac OS

Baixe o git para Mac OS

Windows

Baixe o git para Mac OS

Configurando git

A configuração do git é muito simples, para isso abra o terminal e execute os sequintes comandos:

$ git config --global user.name "YOUR NAME"
$ git config --global user.email "YOUR EMAIL ADDRESS"

• YOUR NAME - É o nome que vai aparecer nos Commits e Pull Requests.

• YOUR EMAIL ADDRESS - Deve preencher com o mesmo e-mail que você criou a conta no GitHub.

No nosso caso…

$ git config --global user.name "Gabriel Z Amaral"
$ git config --global user.email "[email protected]"

Clonando repositório do GitHub com git

Chegou a grande hora, vamos clonar! O comando é simples git clone endereco_repo.

Se tiver configurado o acesso via SSH, o endereco_repo é: [email protected]:username/reponame.git

Caso contrário o endereco_repo é: https://github.com/username/reponame.git

Porém, há uma forma mais simples de obter o endereço do repo. Para isso vá à página do seu repositório e clique no botão Clone or download.

Por padrão vem a opção de clonar via HTTPS, porém se quiser ver o endereço SSH, clique em Use SSH.

E se estiver vendo o endereço SSH e quiser ver o HTTPS, clique em Use HTTPS.

No nosso caso os comandos seriam assim:

Clonar via HTTPS

git clone https://github.com/tutorialgithub2019/tutorial-2019.git

Clonar via SSH

git clone [email protected]:tutorialgithub2019/tutorial-2019.git

Note que, se for a primeira vez que se conecta ao GitHub via SSH, uma mensagem de confirmação será exibida no terminal.

Basta digitar yes e teclar ENTER para prosseguir.

Repare que, ao fazer o git clone, o projeto é baixado para a sua máquina, em um diterório com o nome do projeto.

Antes de prosseguirmos, é interessante sabermos qual é o fluxo que o git segue. Dessa forma será mais fácil entender o que está acontecendo.

Fluxo de trabalho do git

Os repositórios locais consistem em três “árvores” manitdas pelo git.

1ª. Working Directory - Contém os arquivos atuais.

2ª. Index - É uma área entre o Working Directory e o HEAD. É utilizado para criar um conjunto de alterações para serem confirmadas.

3ª. HEAD - Aponta para a última confirmação (commit) que você fez.

Com o fluxo explanado, podemos passar para os comandos básicos do git.

Comandos básicos do git

Estes são os 4 comandos básicos que iremos aprender a utilizar.

• git add

  Este comando adiciona os arquivos no INDEX.

• git commit -m “comentário sobre a alteração”

  Este comando pega todos os arquivos adicionados no INDEX, cria uma revisão contendo um número e o comentário que você colocou.

• git push

  Este comando envia todos os commits para o GitHub.

• git status

  Exibe informações dos arquivos alterados (novos, editados, deletados) e se já foram adicionados no INDEX ou não.

Mãos à obra

Primeiro acesse o diretório do seu projeto

$ cd tutorial-2019

Agora vamos criar um arquivo chamado index.html e vamos por o seguinte conteúdo:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Tutorial GitHub</title>
</head>
<body>
  <h1>Tutorial GitHub</h1>
</body>
</html>

Agora vamos executar o comando git status.

Note que o nosso arquivo está na lista de Untracked files. Isso se dá pelo fato de ser um arquivo novo, que o git ainda não estar mapeando ele.

Vamos agora adicionar o arquivo ao INDEX, para isso iremos utilizar o comando git add index.html. Após, execute novamente o comando git status e veja que o arquivo estará na lista de arquivos a serem commitados.

Agora vamos realizar o commit da alteração, para isso basta executar git commit -m "index.html criado". Agora que já commitou, execute git status mais uma vez.

Note que não existem mais arquivos a serem commitados, isso se dá pelo fato de que as alterações já foram salvas local. Mas lembre-se de que ainda não estão no GitHub. Para que isso ocorra, devemos executar o comando git push.

Agora podemos ver a alteração no GitHub, basta atualizar a página do seu projeto.

Aprendemos aqui 4 comandos básicos do git, com eles conseguimos compreender melhor como funciona esta ferramenta e o GitHub.

Errei o commit, como corrijo?

Você errou a descrição do commit, ou quer adicionar novos arquivos? Se ainda não fez o push basta utilizar o comando git commit --amend para modificar o commit mais recente. Este comando cria um commit novo com as alterações que você realizou.

Utilizando git pull

Este comando é muito importante quando se tem várias pessoas no mesmo projeto, ou caso você tenha seu repositório em dois computadores diferentes — casa e trabalho, por exemplo —, e precisa manter tudo atualizado.

Para exemplificar essa situação, iremos realizar uma alteração via GitHub e vamos puxá-la para o repositório local via git pull.

Vamos alterar o arquivo README.md, para isso clique no ícone de lápis.

Adicione uma linha qualquer no arquivo, após preencha a descrição do commit e por fim, clique no botão Commit changes.

Agora vá ao terminal e execute o comando git pull.

Note que a alteração foi puxada para o seu branch local.

Utilizando git branch

Trabalhar com branch no git é muito simples, e facilita a vida do programador.

Imagine que você está trabalhando em um projeto tanto em sua casa, quanto no seu trabalho. Daí você fez algumas alterações no computador do trabalho, mas precisa continuar as alterações em casa, para isso, você precisa manter os repositórios atualizados em ambos os computadores.

Porém, você não pode por as alterações em produção sem finalizá-las e testá-las. Para isso existe o branch, você cria uma ramificação do seu repositório — como se fosse um espelho —, assim você pode trabalhar nesse código, sem se preocupar em quebrar produção.

Após finalizar todas as alterações, você pode juntar os códigos novamente no branch principal — normalmente o master.

Um branch pode ser criado direto no terminal utilizando o comando git branch -b novo_branch, porém, iremos criar via GitHub.

Criar branch no GitHub

Vá até a página do seu repositório e repare no dropdown escrito “Branch: master”. Isso quer dizer que até agora estamos trabalhando direto no master.

Vamos agora criar o branch cujo o nome será novo_branch, para isso clique no dropdown, preencha o campo com o nome do branch e clique em Create branch: novo_branch.

Agora que o branch foi criado no GitHub, vamos puxá-lo para o seu repositório local. Uma maneira simples é utilizando o comando git pull.

Com o branch no seu repositório local, basta fazer o checkout para ele, para começar a trabalhar nele. Para isso execute o seguinte comando no terminal git checkout novo_branch.

Para saber em qual branch você está, basta executar o comando git branch, que todos os branchs locais serão exibidos e o que estiver selecionado, irá aparecer com um * ao lado do nome.

Agora vamos alterar o arquivo index.html no branch novo.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Tutorial GitHub</title>
</head>
<body>
  <h1>Tutorial GitHub</h1>
  Alteração feita no branch novo.
</body>
</html>

Após salvar o arquivo, adicione o mesmo ao INDEX, com o comando git add index.html e após faça um commit utilizando git commit -m "linha nova adicionada".

Vamos ao branch master — git checkout master — para que fique mais fácil de entender como funciona o conceito de branch.

Confira agora como está o arquivo index.html.

Reparou que a linha que adicionamos não existe no arquivo? Relaxe, não perdemos as alterações. Volte para o branch novo_branch que irá ver as alterações lá.

Faça o push do código novo e verifique no GitHub, as alterações no branch que criou.

Agora ficou tudo mais claro, concorda? Vamos então aprender a fazer merge (juntar um branch no outro)

Utilizando git merge

Como dito anteriormente, o comando merge serve para mesclar um branch no outro. Vamos lá!

Faça checkout para o branch master git checkout master, após execute git merge origin/novo_branch.

Verifique que o arquivo index.html agora está com a linha que alteramos no outro branch.

Agora vamos simular um merge com conflito, para que possamos saber como corrigir este problema e subir nosso código.

Ainda no branch master, altere o arquivo index.html, deixando-o assim:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Tutorial GitHub</title>
</head>
<body>
  <h1>Tutorial GitHub</h1>
  Alteração feita no branch novo.
  <p>Linha para conflitar</p>
</body>
</html>

Mais uma vez, adicione o arquivo e faça o commit.

$ git add index.html
$ git commit -m "para fazer um merge com conflito"

Agora vá para o outro branch git checkout novo_branch e altere o index.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Tutorial GitHub</title>
</head>
<body>
  <h1>Tutorial GitHub</h1>
  Alteração feita no branch novo.
  <p>Linha adicionada no branch novo para conflitar</p>
</body>
</html>

Agora faça o commit, o push e volte para o branch master.

$ git add index.html
$ git commit -m "linha para conflitar"
$ git push origin novo_branch
$ git checkout master

Chegou a hora de ver o conflito. Faça novamente o merge do branch novo, no master.

$ git merge origin/novo_branch

Voilà! Temos o nosso conflito.

Abra novamente o index.html e veja como é representado o conflito.

Podemos ver dois blocos de código. O que está no block HEAD, é o código do branch atual, o segundo bloco é o código que você quer mergear no branch atual.

Agora vamos resolver o conflito. No nosso caso, queremos os dois códigos, logo ficará assim:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Tutorial GitHub</title>
</head>
<body>
  <h1>Tutorial GitHub</h1>
  Alteração feita no branch novo.
  <p>Linha para conflitar</p>
  <p>Linha adicionada no branch novo para conflitar</p>
</body>
</html>

Após a alteração, basta seguir os mesmo passos git add, git commit e git push.

Vá ao GitHub e confirme que o conflito foi corrigido e que o branch master está com o arquivo index.html atualizado com ambas as alterações.

Aprenda mais sobre git

Aproveite para aprender mais sobre git, lendo estes materiais adicionais.

git - guia prático

Uma Referência Visual do Git

Agora que chegamos ao final deste post, irei excluir a conta do GitHub, pois tenho a minha pessoal. Não é pelo fato de ser de graça, que devemos desperdiçar os recursos do GitHub.

Espero ter ajudado de alguma forma. Qualquer crítica ou dúvida, deixe nos comentários.