Passo 6: Iniciação ao Github

Introdução:

Neste passo foi-nos pedido que criássemos dois repositórios: um para o passo 5 e outro para o passo 4. Houve um problema geral na turma com o repositório do passo 4, envolvendo que programássemos mais um pouco para o resolver, falarei como resolvi esse problema mais à frente. Devo denotar que o meu nick no GitHub é "YaBoyPiki" (para que o professor não estranhe, pois é muito diferente do meu nome verdadeiro).

Passo 4: Iniciação ao HTML

Como já tinha explicado anteriormente, houve um problema com o GitHub pages em relação a este repositório, pois quando clicávamos no link que coloquei em cima, nenhum projeto era aberto (o que faz sentido, pois, como é que o GitHub haveria de saber qual dos 5 projetos queríamos visualizar). Para resolver este pequeno incómodo realizei um código em HTML que basicamente consiste numa lista não ordenada, em que cada valor da lista é uma hiperligação para os 5 projetos exemplo do passo 4. Posso dizer que esta foi uma das partes mais satisfatórias de todo o trabalho, encontrar um problema e ser capaz de o resolver através da programação.

Código:

  • Começo desde já por dizer que este código ficará na pasta do Drive deste passo.
  • O que fiz foi muito simples. Comecei por dar um título à página, apenas por uma questão de acessibilidade e boas práticas.
  • Em seguida, criei uma lista não ordenada, mas poderia ser ordenada, sem qualquer problema, apenas preferi assim por uma razão estética.
  • De seguida, dentro de cada linha da lista coloquei uma hiperligação num texto com o nome do projeto, que nos levaria para o mesmo noutra página Web. Dando assim a possibilidade de manter o índice aberto para poder consultar outros projetos ao mesmo tempo.
<!DOCTYPE html>
<html>
  <head>
  <title>Indice passo 4</title> <!-- Título da página Web -->
 </head>
 <body> <!-- Iníco do corpo da página Web -->
  <h1>Indice dos projetos de exemplo do passo 4 da PT07</h1>
  <ul> <!-- Início da lista não ordenada -->
   <li><a href="html_document\index.html" target="_blank">HTML document</a></li> <!-- Linha da lista com hiperligação para um projeto -->
   <li><a href="html_heading\index.html" target="_blank">HTML heading</a></li>
   <li><a href="html_paragraph\index.html" target="_blank">HTML paragraph</a></li>
   <li><a href="html_links\index.html" target="_blank">HTML links</a></li>
   <li><a href="html_images\index.html" target="_blank">HTML images</a></li>
  </ul> <!-- Fim da lista não ordenada -->
 </body> <!-- Fim do corpo da página Web -->
</html>

Resultado:

Passo 5: Pauta caricaturada da turma

Drive: