GitHub Pages

Criando o Repositório Novo

Para utilizar o GitHub Pages, obviamente, você precisa primeiramente criar uma conta no GitHub. Se ainda não fez isso, faça agora, clicando aqui.

Tela Principal do GitHub
Tela Principal do GitHub

Na tela principal do GitHub clique em Repositories e depois no botão New. Na tela seguinte, no campo Repository Name digite o nome de seu repositório. Utilize o método camel case (quando a primeira letra do primeiro termo é minúscula e a primeira letra dos demais termos é maiúscula) ou separe por hífem. Logo depois, clique no botão Create Repository.

Tela de criação de um novo repositório
Tela de criação de um novo repositório

Fazendo Upload de Arquivos

Após você criar o repositório, ele seguirá par a tela de código (<> Code). Neste tela, clique no link uploading an existing file (Fazer upload de um arquivo existente). Na tela seguinte, você pode arrastar os arquivos criados para o quadro Drag files here to add them to your repository. A página inicial deve se chamar index.html. Caso sua página tenha outro nome, crie uma página index.html com a tag meta redirect, como o exemplo mais abaixo. Nele, a página index.html redirecionará automaticamente para a página imagens.html. Se você arrastar uma pasta, o GitHub criará ela no repositório. Fique tranquilo, ele será uma réplica do seu computador. Após terminar de arrastar os arquivos e pastas necessários, clique no botão Commit Changes.

Tela de códigos
Tela de Códigos

Redirecionando o site
Redirecionando o site



Tela de upload de arquivos
Tela de upload de arquivos

Configurando o GitHub Pages

Clique na opção Settings do menu. Agora, no menu lateral (esquerdo), clique em Pages. Na seção Build an deployment, selecione na lista suspensa, troque None (Nenhum) por Main (principal) e clique no botão Save. O site já está pronto, para ver o link, clique no menu superior em Code e depois em Settings novamente, seguido de Pages e a opção de visualizar o site estará disponível. Também será possível ver o link do site, que neste exemplo é https://alexandre-l-rangel.github.io/teste/.

Configuração do GitHub Pages
Configuração do GitHub Pages



Site
Site publicado

Até a próxima

Comentários

Postagens mais visitadas deste blog

Criando Aplicativos com o MIT APP Inventor

Como Usar o Figma: Conceitos de Design e Layouts Multi-páginas