· infraestrutura  · 4 min read

Postando no blog estático direto pelo GitHub com Hexo e Travis CI

Utilizando o Travis CI para fazer deploy de blogs com Hexo. Como fazer Deploy com Travis CI e GitHub Pages.

Confesso que fiquei tentado a migrar para o Jekyll (Ruby) depois que um amigo me mostrou que da para postar no blog direto do GitHub sem ter o Jekyll instalado na máquina. Porém eu não desisti do meu queridinho, o Hexo (feito com Node <3).

Se você não conhece o Hexo, da uma olhada nesse artigo: Migrando de WordPress para Hexo.

Andei pesquisando sobre como postar no Blog direto pelo GitHub Pages através de outras plataformas e cheguei até esse artigo do Humberto Rocha ensinando a usar o Travis CI para rodar o Build do projeto com o Pelican. Quando vi isso logo imaginei que dava para fazer o mesmo com Hexo e poder escrever/revisar direto pelo GitHub. - E dá!

Configurando o Travis CI repositório do seu Blog

Acesse o site do Travis CI e habilite para o repositório do seu Blog clicando em Add new repository. - Aquele + do lado de My repositories

Add new repository

Localize o repositório e ative o Travis CI.

Ativando o Travis no GitHub Pages

Agora acesse as configurações desse repositório clicando na engrenagem ao lado do nome e desabilite a opção de Build pull requests para que o seu Blog não seja atualizado se alguém abrir um Pull Request e habilite o Build only if .travis.yml is present para que a branch com o travis.yml seja a única a gerar atualizações.

Configurações de Build

Criando um token para autorizar o Travis CI a publicar no GitHub

Não utilizaremos a chave SSH para o Travis poder acessar o repositório, mas um Token gerado via GitHub mesmo. Para isso acesse esse link e crie um token. No ultimo passo da criação irá aparecer o número que você deve salvar. Anote esse número.

Agora volte a tela de configuração do repositório no Travis (aquela engrenagem do lado do nome do repositório) e configure a opção Environment Variables com o seguinte:

Em name deixe: DEPLOY_REPO.

E em value coloque: https://O TOKEN DO GITHUB@github.com/USUÁRIO NO GITHUB/REPOSITORIO DO BLOG.git

Isso fará com que exista uma variável de ambiente no sistema operacional chamada DEPLOY_REPO que utilizaremos para o Build com o token do GitHub. Isso vai garantir a segurança do repositório para que outras pessoas não possam gerar o build.

O nome dessa variável pode ser diferente, de acordo com o que achar mais semantico ou melhor, basta alterar as próximas confiurações para o nome que você colocou.

Configuração do .travis.yml para o Blog

No seu projeto, adicione o arquivo .travis.yml com as seguintes configurações, substituindo onde é necessário:

language: node_js

# Adicione a branch onde está a instalação do Hexo
branches:
  only:
  - BRANCH

before_install:
- npm install -g hexo

install:
- npm install

# Configure seu nome de usuário e e-mail
before_script:
- git config --global user.name 'SEU NOME DE USUARIO'
- git config --global user.email 'SEU EMAIL'


script:
- hexo generate

# Configure a Branch a ser feito o deploy
after_success:
- mkdir .deploy
- cd .deploy
- git clone --depth 1 --branch BRANCH --single-branch $DEPLOY_REPO . || (git init && git remote add -t BRANCH origin $DEPLOY_REPO)
- rm -rf ./*
- cp -r ../public/* .
- git add -A .
- git commit -m 'Site updated'
- git branch -m BRANCH
- git push -q -u origin BRANCH

Recomendo que você use um arquivo .nvmrc com a versão do Node em que está rodando o Hexo. O Travis irá reconhecer isso automaticamente e vai setar a versão escolhida na hora do build. Isso vai previnir alguma atualização do Node no servidor do Travis que quebre o build.

Agora configure o Hexo para fazer o deploy com seu usuário via Token com a seguinte linha no arquivo _config.yml do seu Blog, substituindo onde for necessário:

deploy:
  type: git
  repo: git@github.com:USUARIO/REPOSITORIO.git
  branch: BRANCH

Para que o deploy para o GitHub aconteça, será necessário instalar, caso ainda não tenha feito, o plugin que faz o deploy com o seguinte comando:

npm install hexo-deployer-git --save-dev

Isso vai atualizar seu package.json com a dependência que será instalada no servidor de integração do Travis durante a execução do build.

Salvando tudo e subindo para o GitHub

Você vai salvar os arquivos:

  • .travis.yml
  • _config.yml
  • packages.json

Portanto execute:

git add .travis.yml _config.yml packages.json
git commit -m “Add travis integration”
git push

Agora observe no site do Travis que ele ficará configurado para fazer o build do projeto.

Travis configurado

Esse post foi para produção via deploy com o Travis! ;D

Caso ainda fique dúvidas, de uma olhada no meu repositório ou deixe um comentário.

Compartilhe a palavra.

Referência

Back to Blog

Related Posts

View All Posts »

Configurando o ambiente de desenvolvimento fullstack JavaScript

Para trabalhar com programação precisamos de um bom editor de textos e do ambiente de execução da nossa linguagem de programação. Neste artigo vamos conhecer um editor legal e aprender a instalar versões do Node.js, que irá executar nosso código JavaScript.