Crie seu site pessoal e hospede no github page com o travis

Walter Nascimento
Walter Nascimento | PT-BR
3 min readApr 24, 2021

[click here for English]

Criando repositório

Para ter seu site hosṕedado de graça no github page é só você ir na sua conta do github e criar um repositório com o seu nome de usuário, no meu caso criei um assim:

walternascimentobarroso.github.io

após criar qualquer página que html que você enviar já vai funcionar e vc terá um site com a url assim:

http://walternascimentobarroso.github.io/

Template

Existem diversos template de página pessoal gratuitos na internet, para esse post vou usar este:

https://startbootstrap.com/template/resume

Criando site pessoal

Após criar seu repositório faça o clone do projeto ex.:

git clone https://github.com/<username>/<username>.github.io.git

O melhor é evitar criar códigos direto no master, se você conhece git flow siga seu fluxo, caso não conheça para o post não ficar muito grande vamos usar apenas um branch separado.

git checkout -b development

Depois acesse o site e baixar o template, extraia o conteúdo e adicione no seu repositório,

abra o arquivo index e edite as informações conforme você deseja, se domina css pode ajustar o template como quiser (lembrando que esse projeto usa o bootstrap, então se domina o bootstrap pode alterar as classes para ficar mais no seu estilo)

após as alterações feitas é só enviar as informações para o servidor

git push — set-upstream origin development

Lembrando que para a url (http://walternascimentobarroso.github.io/) funcionar o conteúdo tem que estar na branch principal, como no nosso caso criamos um branch para desenvolvimento, então vamos usar uma ferramenta de CI para fazer o merge

Travis

Travis é uma ferramenta de Integração contínua para projetos open source.

Obtendo acesso

Pegue um token de acesso do Github para que Travis possa enviar de volta para o seu repositório:

Acesse https://github.com/settings/tokens/new e crie um novo token

Agora siga os passos:

  • Clique em configurações(settings) e vá em Environment Variables

Vamos criar uma variável chamada GH_TOKEN

GH_TOKEN=<cole aqui o token copiado>

Enviando pro travis

No seu projeto crie um arquivo com o nome .travis.yml e coloque as configurações.

com isso ao fazer o commit o travis ler o arquivo travis.yml

por fim crie um arquivo chamado package.json não precisa ter nada nele apenas um {} é o suficiente, pois o travis busca as dependências dentro deste arquivo

após todas as configurações e alterações concluídas é só enviar para o servidor e aguardar

git push

Para ficar o projeto mais legal, crie um arquivo readme.md e coloque

[![Build Status](https://travis-ci.org/<username>/<username>.github.io.svg?branch=master)](https://travis-ci.org/<username>/<username>.github.io)

alterando para o seu usuario.

Obrigado por ler!

Se você tiver alguma dúvida, reclamação ou dica, pode deixar aqui nos comentários. Vou ter o maior prazer em responder!

😊😊Até mais! 😊😊

--

--