Exercício – criar uma ramificação como Alice

10 minutos

Sua amiga desenvolvedora Alice quer adicionar um pouco de CSS para estilizar as fotos de gatos em seu site. Alice quer fazer este trabalho no seu próprio ramo.

Configurar

Antes de assumir o papel de Alice, você deve fazer algum trabalho para configurar um repositório nu para todos compartilharem e, em seguida, adicionar alguns arquivos.

O Git já está instalado no Azure Cloud Shell, por isso podemos utilizar o Git no Cloud Shell à direita.

Nota

Para este exercício, o Cloud Shell precisa estar no modo Clássico . Na parte superior da janela do Cloud Shell, selecione o ícone Mais (...), selecione Configurações e selecione Ir para a versão clássica.

Criar um repositório nu compartilhado

Crie um novo diretório chamado Shared.git para manter o repositório nu:
```
mkdir Shared.git
cd Shared.git
```
Agora, execute o seguinte comando para criar um repositório vazio no diretório compartilhado:
```
git init --bare
```
Defina o nome da ramificação padrão para o novo repositório. Para realizar esta etapa, você pode alterar a HEAD ramificação para apontar para uma ramificação diferente, neste caso, a main ramificação:
```
git symbolic-ref HEAD refs/heads/main
```

Clone o repositório compartilhado para Bob

Suba um nível a partir deste diretório e crie um diretório para Bob armazenar seu repo:
```
cd ..
mkdir Bob
```

Clone e configure o repositório para Bob:

cd Bob
git clone ../Shared.git .
git config user.name Bob
git config user.email bob@contoso.com
git symbolic-ref HEAD refs/heads/main

Nota

Como você deseja começar com a ramificação padrão do , você precisa alterar HEAD para apontar para refs/heads/main em vez de refs/heads/master qual é o nome da mainramificação padrão.

Adicionar ficheiros base

Como etapa final de configuração, adicionaremos nossos arquivos de site base e os enviaremos para o repositório compartilhado. Para esses comandos, ainda estamos trabalhando no diretório Bob .

Crie alguns arquivos executando o comando Linux touch e, em seguida, prepare e confirme-os usando o Git:

touch index.html
mkdir Assets
touch Assets/site.css
git add .
git commit -m "Create empty index.html and site.css files"

Agora, adicione um pouco de HTML ao seu arquivo usando o editor de código do Cloud Shell. Você pode abrir o editor executando o code comando. Abra index.html no editor on-line digitando code index.html no prompt do terminal:
```
code index.html
```

Cole este código HTML:

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <title>Our Feline Friends</title>
    <link rel="stylesheet" href="CSS/site.css">
  </head>
  <body>
    <nav><a href="./index.html">home</a></nav>
    <h1>Our Feline Friends</h1>
    <p>Eventually we will put cat pictures here.</p>
    <footer><hr>Copyright (c) 2021 Contoso Cats</footer>
  </body>
</html>

Salve o arquivo e feche o editor. Você pode selecionar as reticências "..." no canto direito do editor ou use a tecla aceleradora (pressione Ctrl+S no Windows e Linux; pressione Cmd+S no macOS).
Mude para o diretório Assets e abra site.css no editor:
```
cd Assets
code site.css
```

Adicione o seguinte CSS ao arquivo:

h1, h2, h3, h4, h5, h6 { font-family: sans-serif; }
body { font-family: serif; background-color: #F0FFF8; }
nav, footer { background-color: #C0D8DF; }

Guarde o ficheiro e feche o editor.

Volte para o diretório Bob e confirme novamente:
```
cd ..
git add .
git commit -m "Add simple HTML and stylesheet"
git push --set-upstream origin main
```
Nota

Como estamos usando um nome de ramificação padrão diferente, você precisa dizer ao git para associar sua ramificação principal à ramificação principal do repositório de origem.

Verifique a saída. Se vir um aviso como este exemplo, não se preocupe. Este aviso está apenas informando os usuários sobre uma alteração nos comportamentos padrão do Git.

warning: push.default is unset; its implicit value has changed in
Git 2.0 from 'matching' to 'simple'. To squelch this message
and maintain the traditional behavior, use:

  git config --global push.default matching

To squelch this message and adopt the new behavior now, run:

  git config --global push.default simple

When push.default is set to 'matching', git will push local branches
to the remote branches that already exist with the same name.

Since Git 2.0, Git defaults to the more conservative 'simple'
behavior, which only pushes the current branch to the corresponding
remote branch that 'git pull' uses to update the current branch.

See 'git help config' and search for 'push.default' for further information.
(the 'simple' mode was introduced in Git 1.7.11. Use the similar mode
'current' instead of 'simple' if you sometimes use older versions of Git)

Se quiser certificar-se de que não volta a ver este aviso, pode executar este comando:

git config --global push.default simple

Verifique a saída para este indicador de sucesso:

Counting objects: 9, done.
Delta compression using up to 2 threads.
Compressing objects: 100% (6/6), done.
Writing objects: 100% (9/9), 953 bytes | 953.00 KiB/s, done.
Total 9 (delta 0), reused 0 (delta 0)
To ../Shared.git
 * [new branch]      main -> main

Criar uma ramificação para Alice

Alice quer criar um ramo temático nomeado add-style para fazer o seu trabalho. Vamos assumir o papel de Alice e, em seguida, criar a ramificação e adicionar algum código a essa ramificação.

Suba um nível a partir deste diretório e crie um diretório para Alice para sua cópia do repo:
```
cd ..
mkdir Alice
```

Clone o repositório para Alice e, em seguida, configure-o:

cd Alice
git clone ../Shared.git .
git config user.name Alice
git config user.email alice@contoso.com

Agora você tem uma cópia atual do repositório. Para confirmar, você pode listar o conteúdo do arquivo e executar git status para confirmar o estado do repositório.
```
ls
git status
```
Execute o git branch comando para criar uma ramificação chamada add-style. Em seguida, execute o git checkout comando para alternar para essa ramificação (torná-la a ramificação atual).
```
git branch add-style
git checkout add-style
```
No diretório Alice/Assets, abra site.css. Adicione a seguinte definição de classe CSS à parte inferior do arquivo:
```
.cat { max-width: 40%; padding: 5 }
```
Salve as alterações no arquivo e feche o editor.

Confirme a alteração:

git commit -a -m "Add style for cat pictures"

Neste ponto, Alice quer tornar seu estilo disponível para todos os outros, então eles mudam de main volta e fazem uma puxada no caso de alguém ter feito alterações:
```
git checkout main
git pull
```
A saída diz que a main ramificação está atualizada (em outras palavras, main no computador de Alice corresponde main no repositório compartilhado). Assim, Alice mescla a add-style ramificação na main ramificação executando git merge --ff-only para executar uma mesclagem de avanço rápido. Então, Alice empurra main de seu repo para o repositório compartilhado.
```
git merge --ff-only add-style
git push
```