Full Stack Node.

js
Git e Github

1
PROFESSORES

Wendel Cutrim
wendel@digitalhouse.com
 Antes de começarmos... onde estamos!

Metodologias de Desenvolvimento Express Sequelize

Ensinamentos para gerenciamento de
projeto e versionamento de código
com GIT.

Introdução a Node.js Como funciona a web Banco de Dados

Conceitos básicos de Javascript com
Node.js, módulos nativos e módulos
de terceiros.
Antes de começarmos... onde estamos!

07 08 09

Projeto Integrador:
*Metodologías Ágeis GIT
Wireframes
Protótipos, de baixa Agilidade em todos os Controle de versão de
confiabilidade, como guia aspectos de código e
para diagramação e desenvolvimento de um armazenamento de
desenvolvimento de um software, manifesto ágil, código on-line.
website/aplicativo.
valores e princípios
O que vimos no Playground

● Introdução ao GIT
● Instalação do GIT
● Github
● Criando seu primeiro repositório
● Confirmando arquivos
● Adicionando arquivos
● Guia prático
O que vamos ver hoje

● Versionamento de código local e na

nuvem
● Configuração de chaves SSH
● Código colaborativo com segurança
● *Trabalhando com ramificações
QUAL A DIFERENÇA ENTRE GIT E
GITHUB?
GIT

● Controlador de versão local:

- autor,
- data e hora,
- histórico do projeto recuperável

● É utilizado em várias plataformas online como GitHub, GitLab e

BitBuket
GITHUB

● Armazenar código (mais seguro do que salvar apenas no

computador)
● Portfólio online (vitrine de aplicações e desafios realizados
em programação)
● Código colaborativo (mais de um participante do projeto -
empresas utilizam)

● Open source (código público para toda a comunidade)

Chave SSH ou HTTPS?
 Chave SSH ou HTTPS?

● Documentação Microsoft sobre chaves SSH:

https://docs.microsoft.com/pt-br/windows-server/administration/openssh/o
penssh_keymanagement

● Documentação GitHub para configurar a chave SSH:

https://docs.github.com/pt/authentication/connecting-to-github-with-ssh/te
sting-your-ssh-connection

Configurando Chaves SSH

Comandos essenciais para iniciar um
repositório local.

git init Iniciar o git no repositorio local

git config user.name “Your name” Configurar o nome do usuário

git config user.email “Your email” Configurar o e-mail do usuário

git status Verificar os arquivos que foram

alteradas e não foram adicionados ao
stage
Hora de praticar!
Exercício países - parte 01

● Entrar na sua pasta de projetos e criar uma nova pasta com o nome: colearning-git-github
● Após criar a pasta, abra com o VS Code.
● Com a pasta aberta dentro do VS Code, crie o arquivo: app.js
● No arquivo app.js crie a variável paises, essa variável será um array vazio.
● Após realizar as etapas acima, configure o git na pasta do projeto.
○ Nome do usuário: Digital House
○ E-mail do usuário: teste@mail.com

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 5 minutos

CONFIGUREI O NOME E E-MAIL ERRADO NO GIT,
QUAL COMANDO POSSO EXECUTAR PARA
VERIFICAR OS DADOS QUE ESTÃO SENDO
UTILIZADOS E ATUALIZAR PARA OS
CORRETOS?
Comandos essenciais para iniciar um
repositório local.
git status Verificar os arquivos que foram
alteradas e não foram adicionados ao
stage.

git add . Adiciona todas as modificações no

stage.

git commit -m “message” Commita (salva) as modificações

realizadas, além de versionar o código
criando uma hash
*Dica: Antes e após adicionar os arquivos no stage, sempre utilize o comando: git status,
para verificar se todos os arquivos foram enviados ao stage.
Exercício países - parte 02

● Realizar o primeiro commit.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 2 minutos

Linkando o repositório local (Git) com o
repositório remoto (GitHub)

git remote add origin url adicionando url do repositório online

git remote -v Verificar o endereço do repositório

remoto.

git push origin main enviar atualizações para repositório

remoto
Exercício países - parte 03

● No GitHub, criar o repositório colearning-git-github

● Alterar o nome da branch master do repositório local para main
● Após finalizar os passos acima, realizar a vinculação do repositório remoto com o repositório
local.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 2 minutos

Exercício países - parte 04

● Utilizando o método push() adicione os seguintes dados dentro da variável paises:

○ 'Brasil', 'Argentina', 'Colombia','Peru','Chile', 'Equador', 'Bosnia', 'Venezuela', 'Bolívia',
'Uruguai', 'Guiana', 'Suriname', 'Paraguai', 'Guiana Francesa'
● Imprima os valores armazenados na variável paises da maneira que apareça o seu índice e o
que está armazenado em sua posição.
● Realizar o commit das alterações e enviar as modificações para o repositório remoto.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 5 minutos

Exercício países - parte 05

● Após realizar o commit, apague o console.table(paises)

● Agora imprima todos os países do array, mas que seja de posição por posição.
○ Lembra como podemos fazer isso? Existem 3 maneiras…
● Realizar o commit das alterações e enviar para o repositório remoto.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 5 minutos

COMO POSSO VERIFICAR O HISTÓRICO DE
VERSÕES E QUEM REALIZOU TAL
VERSIONAMENTO?
Revisando comandos essenciais

git pull origin master trazer atualizações do repositório

git log visualizar histórico de modificações

RESOLVENDO CONFLITOS NO GIT
Dica de Ouro!!!

● É um processo muito trabalhoso criar um repositório local, iniciar o git, configurar usuário,
email, criar um repositório remoto e realizar a linkagem do repositório remoto com o local.
Para realizar esse procedimento, gastamos em torno de 3 - 5 minutos.

● Existe uma maneira prática e rápida de criarmos um repositório com o git iniciado e o
repositório remoto configurado e linkado, restando apenas clonar em nossa máquina,
configurar o usuário e email. O mais importante, é que podemos realizar esse processo em
questão de segundos.
Dica de Ouro!!!

Primeiro passo é criar o repositório remoto no GitHub.

git clone url-do-repositório Irá realizar o clone de um repositório

remoto para o seu computador.
Exercício 02

● Clonar o repositório: https://github.com/wendelcutrim/desafio-calculadora

● Após clonar o repositório, abrir a pasta do projeto com o VS Code.
● Abrir o arquivo calculadora.js e apagar a linha 6 em diante.
● Criar uma nova função utilizando arrow function com o nome: calculadora, essa função deve
receber 3 parâmetros, sendo que o 3º parâmetro é um callback.
● O Retorno desta função deve ser o resultado da operação solicitada, exemplo:
calculadora(5, 2, somar) //Retorno: 7

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 10 minutos

Exercício 03

● Realizar o commit das alterações e enviar para o repositório remoto.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 2 minutos

 OPA… DEU RUIM NÉ?
ESSE ERRO OCORREU PORQUE FOI REALIZADO
O CLONE DE UM REPOSITÓRIO QUE NÃO É SEU.
COMO PODEMOS RESOLVER ISSO?
 Existem 2 maneiras para resolver esse problema:

1. Realizar um Fork do projeto e em seguida, clonar

para seu repositório local.

2. Criar um novo repositório remoto e alterar o link

de apontamento para o nosso repositório.
Alterando o link de apontamento do
repositório remoto

● Documentação GitHub:
https://docs.github.com/pt/get-started/getting-started-with-git/man
aging-remote-repositories
Exercício 04

● Criar um novo repositório remoto com o nome: desafio-calculadora

● Alterar o link de apontamento do repositório remoto do nosso projeto local.
● Realizar o commit das alterações e enviar para o repositório remoto correto.

TEMPO PARA REALIZAR ESTE EXERCÍCIO: 5 minutos

Links úteis

● https://learngitbranching.js.org/?locale=pt_BR

● https://gitexplorer.com/

● https://girliemac.com/blog/2017/12/26/git-purr/

● https://git-scm.com/doc

● https://ohshitgit.com/
O QUE SÃO BRANCHES?
São uma ‘linha’ de desenvolvimento diferente da utilizada
para testar novas funcionalidades sem interferir na linha
principal, chamada de main ou master.
Criando Branches
Para criar uma branch de nome “sprint02”.

git branch sprint02

>_

Para passar a utilizar a branch “sprint02”.

git checkout sprint02

>_
Criando Branches

Para criar uma branch de nome “sprint02” e passar a utilizá-la com um

só comando.

>_ git checkout -b sprint02

Listando Branches

Para listar todas as branches de um repositório local execute.

>_ git branch

Para listar todas as branches locais e remotas execute.

>_ git branch -a

O QUE É O HEAD?
O HEAD é uma referência ao estado atual do seu
repositório.
É comum que ele esteja apontando para o último
commit.
Head

main HEAD

Commit 6

Commit 1 Commit 2 sprint02

Commit 8
Git Checkout
Podemos utilizar o comando git checkout para mover a HEAD do repositório
para qualquer branch.

>_ git checkout sprint02

main

Commit 6

Commit 1 Commit 2 sprint02 HEAD

Commit 8
Git Checkout
Podemos utilizar o comando git checkout para mover a HEAD para
qualquer commit. Basta saber os 6 primeiros caracteres do hash do
commit.

>_ git checkout a6de24

main

4ef654
HEAD

a6de24 45e465 sprint02

50efb4
O QUE É UM MERGE?
Git Merge
Para realizar o merge, devemos voltar para a branch que desejamos
mesclar o novo conteúdo. Nesse exemplo vamos unificar o conteúdo da
branch sprint02 com a main

>_ git checkout main

Após voltar para a branch principal, vamos unificar o conteúdo da

sprint02 com a branch main.

>_ git merge origin main

Agora o conteúdo que desenvolvemos na branch sprint02 está unificado

com a nossa branch principal.
Git Merge

Antes: Depois do comando “git merge sprint02”

D
HEA
main

0b45ef 0b45ef HEA

D

main

a6de24 a6de24 6ec542

sprint02 sprint02

72eba3 72eba3
Git Flow
COMO UTILIZAR O GITHUB PARA
TRABALHAR EM EQUIPE?
1. Criar o repositório Remoto no GitHub
2. Clicar no menu Settings do repositorio
3. Após abrir as configurações, clique na opção: Collaborators
4. Clicar no botão: Add people e inserir o email de cada integrante do projeto
para dar permissão a eles no repositório.
5. Após os integrantes serem adicionados, eles devem clonar o link do repositório, em que
foi convidado, pois mesmo o repositório não sendo deles, será possível realizar commits e
push, pois eles foram convidados e possui permissão para isso.
Dicas para trabalhar em equipe.

● Após todos terem acesso ao repositório, crie uma branch com o nome Dev para todos
trabalhar nela.
● A partir da branch Dev, cada integrante crie uma branch nova para a feature que será
desenvolvida.
○ Ex: O fulano de tal vai criar a tela de login, então a partir da branch dev ele deverá
criar uma nova com o nome sprint02-login
● Após finalizar as funcionalidades novas, faça o merge com a Dev e quando todos
finalizarem a sprint se estiver tudo certo na Dev, faça o merge com a Main
Exemplo do Fluxo Git
Links úteis

● https://learngitbranching.js.org/?locale=pt_BR

● https://gitexplorer.com/

● https://girliemac.com/blog/2017/12/26/git-purr/

● https://git-scm.com/doc

● https://ohshitgit.com/
Até a próxima aula!