Índice
0. Caso ainda não tenhas uma conta no GitHub, deves começar por criar uma em https://github.com/join
1. Entra no GitHub em https://github.com identifica-te com o teu login e password.
2. Começa por criar um novo Repositório (cada projeto deve ser criado no seu próprio repositório)
Procedimento:
a. Clicar em + (canto superior direito) e escolha New Repository
b. Escolha um nome sugestivo e curto (sem maiúsculas, nem espaços)
c. Preencha a Descrição apesar de ser opcional (é uma boa prática preenchê-la)
d. Colocar o visto na opção "Initialize this repository with:" Add a README file" (opcional se estivermos a importar um repositório existente)
e. Clique em "Create repository"
3. Para visualizarmos o website do repositório temos de ativar o GitHub Pages em cada um deles
Procedimento:
Acede ao repositório que pretendes obter o link do Github Pages (.io)
Abre a opção Settings (em cima ao centro mais para o lado direito);
No menu vertical do lado esquerdo, em "Code and automation", clica em "Pages"
Em Source escolher "Branch: Master" e clicar em "Save"
O repositório fica publicado no seguinte URL: https://username.github.io/nome_do_repositorio/
Exemplo do repositório hello-world na conta lpitta:
Na secção Pages podemos ler na caixa de fundo verde claro: "Your site is published at https://lpitta.github.io/hello-world/
4. Para carregar os ficheiros HTML, CSS e JS devemos ir a Code (em cima do lado esquerdo) e clicar no botão "Add file > Upload files" (em cima do lado direito)
Devemos agora utilizar a técnica do Drag and Drop ou clicar em "choose your files" para selecionar os ficheiros locais que pretendemos enviar para o Github.
No final devemos clicar em "Commit changes" (ao main branch)
Nota: Quando os projetos começam a ficar mais complexos (com dezenas ou centenas de ficheiros) devemos instalar o GitHub Desktop que nos permite sincronizar automaticamente as nossas atualizações (locais) com o Github (remoto).
5. Testar o resultado do código (HTML, CSS e JavaScript) que enviámos para o Github
Devemos esperar cerca de 10 a 20 segundos para que o upload seja validado pelo GitHub e enviado para o GitHub Pages.
A seguir basta clicar no URL fornecido pelo GitHub Pages: ver passo 3.
Exemplo para o repositório hello-world: https://lpitta.github.io/hello-world/ e verificar o resultado.
Nota: O ficheiro inicial (aquele que vai ser aberto em 1º lugar) do nosso website deve ter sempre o nome index.html. Só assim é que ele será ser aberto automaticamente sempre que acedermos a esse site.
O GitHub Pages é um serviço gratuito que permite alojar as nossas páginas web estáticas a partir do repositório GitHub.
Cada conta GitHub recebe um site que pode armazenar um numero ilimitado de projetos.
O URL inicial tem a seguinte sintaxe: https://username.github.io, onde username é o seu nome de utilizador
Para configurar o URL inicial devemos:
1. Criar um repositório com o nome especial username.github.io (trocar username pelo seu username!)
2. Criar ou carregar o ficheiro index.html (Deve conter os links para cada um dos projetos desenvolvidos)
3. Criar o ficheiro readme.md (nesta fase pode estar vazio)
4. Agora o URL inicial já deve funcionar. Ver exemplo: https://lpitta.github.io
Mais informação em https://pages.github.com
URL inicial do user LPitta: https://lpitta.github.io
Acesso à página GitHub do utilizador LPitta (Público): https://github.com/lpitta
Março 2022: Deixou de funcionar >>> Foi criado no FreeNom o seguinte SLD: lpitta.ga
O domínio lpitta.ga deve apontar para o URL inicial do user, ou seja para https://lpitta.github.io
*SLD: Second Level Domain.
Acesso ao output do repositório "Hello-World": https://lpitta.github.io/hello-world/
Acesso à página do repositório "Hello-World": https://github.com/lpitta/hello-world
2020: guides.github.com/features/pages/
2017: programmingliftoff.com/create-your-first-website-on-github-pages/
O GitHub Desktop permite fazer o controlo de versões a partir do computador pessoal em ambiente gráfico.
Procedimento de instalação:
Acede a https://desktop.github.com, descarrega e instala o Github Desktop.
(Nota: só funciona em SOs de 64bit)
O Git scm permite fazermos o controlo de versões a partir do computador pessoal com um interface de linha de comando.
Procedimento de instalação:
Aceda à página de apoio: sites.aebenfica.org/apontamentos-tic/programacao/github
Qualquer uma das aplicações fazem a sincronização automática e bidireccional entre o computador local e o repositório remoto do GitHub.
O editor Atom é um editor bastante poderoso, gratuito e tem integração total com o Github.
Por esta razão, se estivermos a trabalhar com o Github poderá ser o nosso editor favorito.
Procedimento de instalação:
Aceder a https://atom.io, descarregar e instalar.
A integração com o Github já vem pré configurada, só precisamos de fazer login (via token).
No computador local:
Criar uma pasta vazia para o projeto, com o nome "Projeto1" (por exemplo)
No Atom:
a. Escolher File > Add Project Folder > selecionar a pasta "Projeto1"
b. Adicionar ficheiros ao projeto a partir de File > New File
c. Guardar os ficheiros clicando em CTRL+S (File > Save)
Instalar o package Git Plus em File > Settings > + Install (caso ainda não esteja instalado)
No Github:
Criar o repositório com o nome pretendido (pode ser o mesmo da pasta criada inicialmente: "Projeto1")
Não alterar nenhuma opção e clicar em "Create Repository" (botão verde)
Executar as seguintes 2 linhas de comando, a partir do Atom no package Git Plus (atalho para abrir o Git Plus: CTRL+SHIFT+P)
git remote add origin https://github.com/username/nome_projeto.git
git push -u origin master
No Atom:
Carregar em CTRL+SHIFT+P para abrir a consola Git Plus
Escrever: git plus: init (para inicializar o repositório localmente)
Escrever: git plus: run (para abrir a consola de comandos e argumentos do git)
Escrever: remote add origin https://github.com/username/nome_projeto.git
(não digitar o git inicial e trocar username e nome_projeto pelo seu username e pelo nome do projeto atual, neste caso Projeto1)
Escrever: push -u origin master
Quando pretendermos enviar de novo (push) para o Github devemos aceder a:
Packages > Git Plus e escolher "Add All + Commit + Push"
Como temos, sempre, de escrever um comentário surge o ficheiro COMMIT_EDITMSG onde devemos
escrever uma mensagem e clicar em CTRL+S para guardar.
Todos os ficheiros editados e salvos localmente vão ser Commit e Push para o Github :)