Lucchesi
topo

Como criar um blog grátis no GitHub usando o Jekyll #1

Todo mundo sabe que programadores de verdade escrevem seus posts em Markdown, versionam todo o conteúdo usando o Git e, claro, hospedam seus blogs no próprio GitHub, certo?

Brincadeiras à parte, nesta série de 3 artigos eu ensino como você pode criar de graça um site ou blog profissional, usando o Jekyll, o GitHub Pages e a CloudFlare.

Continue lendo e você vai aprender a:

Então, se você é do time que já fica com preguiça só de imaginar toda aquela trabalheira para instalar, configurar e caçar todos os plugins necessários para o WordPress, pega seu café porque este artigo é pra você!

Para entender por que usar o Jekyll, leia: O retorno das páginas estáticas.

Jekyll, GitHub Pages e CloudFlare

Antes de colocar a mão na massa, vamos entender cada uma dessas tecnologias e como elas se relacionam.

Jekyll

O Jekyll é um gerador estático de sites com recursos especiais para a criação de blogs. Ele processa um amontoado de arquivos em diferentes formatos: como Markdown ou HTML — e gera um conjunto de páginas estáticas, prontas para serem hospedadas em qualquer servidor com overhead praticamente zero.

GitHub Pages

O GitHub Pages é um serviço de hospedagem compatível com o Jekyll, projetado para hospedar sites estáticos diretamente de um repositório GitHub. Isso significa que você pode desenvolver o seu site ou blog usando o Jekyll e hospedá-lo de graça nos servidores do GitHub!

CloudFlare

A CloudFlare é uma empresa que provê diversos serviços úteis para quem tem um domínio personalizado e quer hospedar o site no GitHub Pages. Ela oferece um plano grátis que conta com um certificado SSL e tudo o que você precisa para habilitar o HTTPS no seu site.

Resumindo:

  1. Nós desenvolvemos o site com o Jekyll.
  2. Hospedamos no GitHub Pages,
  3. Usamos a CloudFlare para o HTTPS (se tivermos um domínio próprio).

Criando o repositório no GitHub

Crie um repositório chamado <username>.github.io, onde <username> é o seu nome de usuário no GitHub.

A primeira parte do nome do repositório tem que ser igual ao seu nome de usuário, caso contrário, não funcionará.

Clique em Settings e dê uma olhada na seção GitHub Pages.

Você deve ver algo como a imagem abaixo:

Criando a página inicial

Antes de partirmos para o Jekyll, vamos fazer um pequeno teste…

Crie um arquivo index.html na raiz do repositório e adicione a string “Hello world!”.

Dica: você pode fazer isso pela própria interface do GitHub acessando a URL https://github.com/<username>/<username>.github.io e clicando no botão Create new file.

Outra opção é clonar o repositório e criar o arquivo localmente:

git clone https://github.com/<username>/<username>.github.io
cd <username>.github.io
echo "Hello world!" > index.html

Nós precisaremos desta opção mais pra frente, então, lembre-se dela.

Publicando a nova página

Agora, tudo o que temos que fazer para colocar nossa página no ar é salvar as modificações no GitHub.

Se você estiver criando o arquivo pelo botão Create new file, basta adicionar uma mensagem de commit e clicar no botão Commit new file.

Se você clonou o repositório localmente, é só subir as modificações para o GitHub:

git add --all
git commit -m "Initial commit"
git push -u origin master

Acesse o endereço http://<username>.github.io e veja sua nova página.

Pronto, agora você já pode avançar para a segunda parte do tutorial.