Publicando seu projeto Hugo no Github:Pages

Esta é a Parte 2 da nossa série de artigos sobre como criar uma página pessoal com Hugo e Github Pages.

Marco Paulo Ollivier
Jul 8 · 5 min read

No primeiro artigo, mostramos como criar uma página utilizando o gerador de páginas estáticas Hugo.

Nessa segunda parte, utilizaremos um recurso do Github para publicação de páginas estáticas chamado Github Pages. Falaremos sobre algumas características específicas do recurso oferecido e configurações importantes que devem ser levadas em conta na hora de configurar nosso projeto.

O Github pages

Existem duas maneiras de criar uma página no Github Pages:

  • Para organizações e usuários (https://<USERNAME|ORGANIZATION>.github.io)
  • Para projetos (https://<USERNAME|ORGANIZATION>.github.io/<PROJECT>/)

Requisitos mínimos

  1. Uma conta no Github; e
  2. Um projeto Hugo pronto para ser disponibilizado. Para isso, basta seguir nosso artigo anterior de como criar uma página estática com Hugo.

Mãos a obra

Primeiro passo: Criando um repositório para o projeto Hugo

Github do projeto

Esse repositório servirá para o armazenamento dos nossos arquivos de conteúdo e outros arquivos fonte.

Segundo passo: Crie um repositório para sua organização

Então vamos criar um repositório chamado gopheriomeetup.github.io.

Tela de criação de uma página no Github

ATENÇÃO: para que a página seja associada a organização/usuário e não como um sub-módulo, o nome tem que ser exatamente igual. Por exemplo: se estamos criando a página para a organização gopheriomeetup, o repositório tem que se chamar, necessariamente, gopheriomeetup.github.io.

Terceiro passo: Clone o repositório do seu projeto

  1. Execute hugo server
Terminal do projeto Hugo

2. acesse http://localhost:1313

Projeto Hugo executando

Depois de validar, pare a execução CTRL+Ce apague a pasta rm -rf public

Quarto passo: associe seu arquivo estático ao repositório da página

$ git submodule add -b master git@github.com:gopheriomeetup/gopheriomeetup.github.io.git public

Quinto passo: Gerando o conteúdo estático

$ hugo$ cd public$ git add .$ git commit -m "message"$ git push
Terminal depois de fazer o push no repositório do conteúdo estático

Feito isso, o conteúdo já estará disponível no repositório do github:pages

Página do repositório estático

Sexto passo: últimos ajustes no Github:Pages

Mude a opção source para master branch e como indicado no alerta verde, a página já está disponível no endereço https://gopheriomeetup.github.io/

Página publicada na internet

Passo extra: Deixe o processo um pouco mais automatizado

#!/bin/bashecho -e "\033[0;32mDeploying updates to GitHub...\033[0m"# Build the project.
hugo # if using a theme, replace with `hugo -t <YOURTHEME>`
# Go To Public folder
cd public
# Add changes to git.
git add .
# Commit changes.
msg="rebuilding site `date`"
if [ $# -eq 1 ]
then msg="$1"
fi
git commit -m "$msg"
# Push source and build repos.
git push origin master
# Come Back up to the Project Root
cd ..

Conclusão



Responsive

Software Engineering Blog & Programming Tutorials

Marco Paulo Ollivier

Written by

Software Developer, futuro físico, entusiasta de Economia, Política e Filosofia. Também é Vascaíno, fã do GnR. Metido a fotógrafo e guitarrista meia-boca😜

Responsive

Software Engineering Blog & Programming Tutorials

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade