S01 Preparação: Publicando Suas Páginas no GitHub
Visão Geral
Em atividades anteriores, você concluiu o seguinte:
- Criou um novo repositório no GitHub
- Habilitou o GitHub Pages para seu repositório, de modo a hospedar seu conteúdo como uma página web para que outros vejam.
- Clonou seu repositório no seu computador para ter uma cópia das páginas HTML que você possa editar.
- Fez alterações em páginas no seu computador.
Nesta atividade, você aprenderá a dar push ou enviar suas alterações para o GitHub. Como o GitHub está hospedando seu site para que outros vejam, esta etapa de envio é a maneira como você publicará suas páginas na web.
Preparação
Para enviar alterações dos arquivos do seu computador para o GitHub, você precisa seguir várias etapas. Algumas delas podem parecer bem complexas, mas lembre-se de que o Git é uma ferramenta muito poderosa usada por desenvolvedores de software profissionais todos os dias, além de fazer muito mais do que você verá neste curso. Em cursos futuros, você usará ainda mais recursos, por isso é útil se familiarizar com os principais deles agora.
Quando você cria um repositório no GitHub e o clona em seu computador, ele faz uma cópia completa desse repositório no seu computador. Para enviar suas alterações ao GitHub, você deve primeiro confirmá-las (commit) no repositório do seu computador e depois enviá-las (push) para o GitHub.
O diagrama a seguir mostra as etapas no seu computador pelas quais um arquivo deve passar para chegar ao GitHub.
Nesta aula, você só precisará confirmar (commit) suas alterações salvas no seu repositório local e sincronizá-las com o GitHub.
Fluxo de Trabalho
As etapas a seguir descrevem o processo geral do seu fluxo de trabalho nesta aula.
Editar arquivos e pastas
A primeira etapa do processo de publicação usando o Git é editar arquivos e pastas no diretório de trabalho do seu repositório. Você não precisa fazer nada em específico para isso. Basta abrir sua pasta wdd130 no VS Code, navegar até os arquivos e pastas nos quais deseja trabalhar e fazer suas alterações, incluindo inclusões, exclusões e modificações. O Git está automaticamente monitorando essas alterações para você.
Use o Controle do Código-Fonte para Gerenciar Uploads
Selecione o ícone Controle do Código-Fonte na Barra de Atividades do VS Code.
Na aba Controle do Código-Fonte no VS Code, você verá uma lista de todas as alterações feitas. Se desejar, clique em um arquivo e veja as alterações. O VS Code pode mostrar as versões antiga e nova e destacar as diferenças.
Confirmando (commit) alterações no seu repositório local
Sempre que você confirmar (commit) alterações em um repositório, você deve fornecer uma mensagem de commit. Ela é importante, pois descreve as alterações que você está fazendo e que podem ser visualizadas no futuro. É útil se você ou qualquer outra pessoa quiser saber a finalidade dessas mudanças. Se você não adicionar uma mensagem de commit, o Git não permitirá que você confirme (commit) no seu repositório.
A maneira mais fácil de adicionar uma mensagem de commit é digitá-la na caixa de mensagem, logo acima do botão Confirmar (commit).
Depois de digitar uma mensagem de commit, clique no botão Confirmar (commit) para enviar suas alterações no seu repositório local.
Neste ponto, suas alterações não aparecerão na lista de alterações, pois foram adicionadas ao repositório. No entanto, eles ainda NÃO estão no GitHub. Para que suas alterações cheguem ao GitHub, você precisa enviá-las por push.
Caso se esqueça de adicionar uma mensagem de commit e clicar no botão Confirmar (commit), o VS Code abrirá um novo arquivo e lhe dará a chance de adicionar sua mensagem a esse arquivo.
Digite sua mensagem na parte de cima desse arquivo, salve-o e feche-o para que o Git conclua o processo de commit.
Enviando alterações para o GitHub
Depois de confirmar (commit) suas alterações para seu repositório local, você já pode dar push para o GitHub.
Quando houver alterações no seu repositório local que não estejam presentes no GitHub, o botão Sync Changes (Sincronizar Alterações) aparecerá. Você pode clicar nesse botão para dar push em suas alterações ao GitHub.
Ao clicar nesse botão, o VS Code pode informar que você está prestes a dar push e
pull para alterações da fonte (seu repositório do GitHub) no branch
main. Clique no botão para permitir que ele execute essa ação.
Se você estiver trabalhando com outras pessoas ou tiver feito alterações em outro computador, esse botão tentará primeiro dar pull ou baixar quaisquer alterações do GitHub que você não tenha no seu computador e, em seguida, dará push em suas alterações para o GitHub.
Verificando suas alterações no GitHub
Depois de dar push em suas alterações para o GitHub, navegue até seu repositório do GitHub em um navegador e veja como ficaram.
O URL do seu repositório GitHub é: https://github.com/seu-nomedeusuario/wdd130 (substitua
seu-nomedeusuario pelo seu nome de usuário real). No seu repositório, você deverá ver sua mensagem de
commit junto com o tempo transcorrido desde que você fez a alteração:
Se desejar, você pode clicar na mensagem de confirmação (commit) para ver as alterações que foram feitas.
Pode levar um tempo para que suas alterações sejam implantadas no seu site no GitHub Pages.
Quando
terminar, você poderá ver a página atualizada em um navegador, acessando o URL da sua página, ou seja:
https://seu-nomedeusuario.github.io/wdd130 (substitua seu-nomedeusuario pelo seu nome
de usuário real).
Instruções da Atividade
Esta atividade ajudará você a fazer uma alteração, confirmá-la (commit) e enviá-la (push) para o GitHub.
- Faça uma alteração em um dos arquivos html na Semana 01. (Você pode fazer algo tão simples quanto adicionar uma linha em branco).
- Salve suas alterações.
- Clique no ícone de Controle do Código-Fonte na Barra de Atividades do VS Code.
- Insira uma mensagem de confirmação (commit) e confirme (commit) suas alterações para o repositório local.
- Sincronize suas alterações para enviá-las (push) ao GitHub.
- Verifique se você consegue ver sua mensagem de confirmação (commit) no GitHub.
Envio
Agora você concluiu todas as atividades de aprendizagem desta semana.
Volte ao Canvas para enviar o
questionário de S1 Atividades de Aprendizagem.