Você conhece o Jekyll? Bom, antes de apresentá-lo, vamos concordar com uma coisa: segurança e velocidade são aspectos fundamentais da hospedagem de sites. Se o seu conteúdo demora demais para carregar, babau!, você perdeu a visita.
Além disso, cada plugin que você instala no seu site e/ou blog traz possíveis falhas de segurança, e eu duvido que você faça auditoria manual cada vez que atualiza o seu blog.
Se você está interessado em criar sites rápidos, seguros e que podem ser hospedados em qualquer lugar, continue lendo.
1. O que é Jekyll?
O Jekyll é um gerador de sites estáticos – de fato, ele é o mais popular dentre eles. Um site estático não possui componentes rodando no lado do servidor: ele usa tecnologias web padrão (HTML5, JS, CSS) e não interage com componentes dinâmicos (um banco de dados, por exemplo).
É versátil, podendo ser usado para criar blogs, landing pages, sites institucionais, entre outros. O conteúdo é criado através de simples arquivos de texto no formato MarkDown. Cada vez que você atualiza estes arquivos, estes são compilados (transformados) em um site completo.
Os sites criados com esta plataforma podem ser hospedados em qualquer provedor de hospedagem, mesmo aqueles sem suporte para linguagens de programação no lado do servidor (PHP, JSP, ASP.NET e outros).
1.1 Prós em relação aos outros
Por padrão, um site criado com o Jekyll é…
… seguro:
um site WordPress normalmente é complexo e cheio de módulos e plugins criados por várias pessoas. Se você não precisa do poder/complexidade oferecido por exemplo pelo sistema de plugins, pode ser vantagem deixar essa complexidade para trás e trabalhar com a estrutura do Jekyll. Verdade seja dita: os sites criados em WordPress tem um monte de mecanismos para diminuir a superfície de ataque e evitar problemas de segurança. Mas com o Jekyll, nada disso é necessário.
…rápido:
justamente por não depender de módulos/plugins no lado do servidor, sites criados com o Jekyll podem ser servidos muito rapidamente. Não precisa ficar instalando plugins de cache – a plataforma e o próprio navegador cuidam disso. Além disso, a experiência de criar conteúdo para um site criado com ele é muito simples, já que tudo é configurado por arquivos texto. Isso também significa que ele é…
… fácil de versionar:
se você é programador e/ou já trabalha com sistemas de versionamento de código-fonte (como git e svn), você vai adorar o Jekyll. Tudo é texto (fora as imagens :P) e é facilmente versionado.
1.2 E os contras?
Se você precisa de qualquer tipo de interação que envolva o servidor, manipule banco de dados etc, o Jekyll não pode ser usado para isso. É possível integrar com outras tecnologias, como APIs e serviços de armazenamento na nuvem, mas por si só, o Jekyll não oferece este recurso.
Além disso, se você está desenvolvendo um site para um cliente, e existe uma expectativa de que o cliente mantenha o conteúdo do site, ele teria que usar o terminal e instalar algumas ferramentas de linha de comando…
2. A instalação do Jekyll
As instruções a seguir assumem que você está usando uma distribuição GNU/Linux baseada em Debian. A mais popular por aqui é o Ubuntu, mas existem diversas outras, como o Mint e o próprio Debian. Os comandos devem ser digitados em um terminal. Para instruções no Windows, veja o site do Jekyll.
2.1 Instalando as dependências
O Jekyll é uma gem (biblioteca) desenvolvida na linguagem Ruby[]. Para poder usar o Jekyll, você deve primeiro instalar o Ruby:
sudo apt install ruby
Agora vem uma questão de preferência pessoal: onde colocar suas gems. Eu gosto de instalar no meu $HOME, para não ter problemas de conflito ou precisar de sudo. Então, para instalar as gems dentro do seu $HOME (ex. /home/pedrinho), execute os seguintes comandos:
echo 'export GEM_HOME=$HOME/.gems' >> ~/.bashrc
echo 'export PATH=$HOME/.gems/bin:$PATH' >> ~/.bashrc
2.2 Install o Jekyll propriamente dito
O Jekyll usa o bundler para gerenciar as dependências. Ele instala as versões exatas das gems necessárias para o Jekyll funcionar. Você pode instalar os dois com o mesmo comando:
gem install jekyll bundler
Para verificar que o Jekyll foi instalado corretamente, digite jekyll sem parametros. Deve aparecer algo como o seguinte:
hahn@ubuntu:~$ jekyll A subcommand is required. jekyll 3.8.3 -- Jekyll is a blog-aware, static site generator in Ruby Usage: jekyll <subcommand> [options] ...
3. O Jekyll foi instalado. Próximo passo é?
Agora vamos criar um site. Por padrão, o Jekyll cria um diretório contendo todos os arquivos necessários para criar um blog: posts, tema, página de erro 404, estilos etc. Para criar um blog no diretório meu-site, execute:
jekyll new meu-site
Agora você pode entrar no diretório e visualizar os arquivos.
hahn@ubuntu:~$ cd meu-site hahn@ubuntu:~$ ls -lash total 48K 4,0K drwxr-xr-x 5 hahn hahn 4,0K ago 30 18:56 . 4,0K drwxr-xr-x 51 hahn hahn 4,0K ago 31 14:44 .. 4,0K -rw-r--r-- 1 hahn hahn 398 ago 30 18:56 404.html 4,0K -rw-r--r-- 1 hahn hahn 539 ago 30 18:56 about.md 4,0K -rw-r--r-- 1 hahn hahn 1,7K ago 30 18:56 _config.yml 4,0K -rw-r--r-- 1 hahn hahn 1,1K ago 30 18:56 Gemfile 4,0K -rw-r--r-- 1 hahn hahn 1,7K ago 30 18:56 Gemfile.lock 4,0K -rw-r--r-- 1 hahn hahn 35 ago 30 18:56 .gitignore 4,0K -rw-r--r-- 1 hahn hahn 175 ago 30 18:56 index.md 4,0K drwxr-xr-x 2 hahn hahn 4,0K ago 30 18:56 _posts 4,0K drwxr-xr-x 5 hahn hahn 4,0K ago 30 18:56 _site
Agora, para criar o site propriamente dito, execute o seguinte comando a partir desse diretório:
bundle exec jekyll serve
O retorno deve ser algo parecido com:
Configuration file: /home/hahn/tmp/meu-site/_config.yml
Source: /home/hahn/tmp/meu-site
Destination: /home/hahn/tmp/meu-site/_site
Incremental build: disabled. Enable with --incremental
Generating...
done in 0.281 seconds.
Auto-regeneration: enabled for '/home/hahn/tmp/meu-site'
Server address: http://127.0.0.1:4000/
Server running... press ctrl-c to stop.
Parabéns! Agora você pode abrir o seu site acessando o endereço informado em um navegador qualquer, como o Firefox. O mais legal é que cada vez que algum arquivo nesse diretório for modificado, o Jekyll recria o site a partir dele. Experimente editar o arquivo about.md.
Regenerating: 1 file(s) changed at 2018-08-31 18:52:49
index.md
...done in 0.108573394 seconds.
Bonito, hein? E muito rápido.
Agora você pode pegar o conteúdo do diretório _site_ e subir pra qualquer servidor web acessível na internet. Esse diretório contém tudo o que o Jekyll produziu: todo o conteúdo do site que acabamos de criar, incluindo CSS otimizado, arquivos com os posts separados por data e um feed RSS. Se você incluir imagens no seu MarkDown, elas também vão aparecer aqui.
Rapidão, seguro, simples, e 100% compatível. Pura alegria.
4. Tá, e agora?
Agora está tudo pronto para começar a adicionar conteúdo. Vou mostrar rapidamente como adicionar páginas, posts e trocar o tema do blog.
Na hora de criar páginas e posts, você pode usar sintaxe markdown (.md) ou HTML normal. Apenas para lembrar: certifique-se de que você está executando o bundle exec jekyll serve, assim todas as modificações serão aplicadas ao blog automaticamente.
4.1 Criando uma página
Uma página pode ser usada para exibir conteúdos que não mudam com frequência, como aquelas páginas de Sobre…. Para adicionar uma página, basta criar um arquivo na raiz do site ( por exemplo, cardapio.md ou sobre.html) e este ficará disponível nos links do blog. A estrutura do site ficará como a seguir:
4.2 Criando um post
Os posts do blog ficam no diretorio _posts. Para criar um post, basta criar um arquivo nesse diretório, com o seguinte nome: yyyy-mm-dd-titulo-do-post.md, onde yyyy-mm-dd é a data no formato ano-mes-dia. O início do conteúdo do arquivo deve indicar o layout utilizado e o titulo que será exibido na página, conforme o exemplo abaixo:
--- layout: post title: "Titulo do post!" --- # Olá Bem-vindo ao meu blog. Bla bla bla. Aqui vai o textão. Bla bla bla.
4.3 Trocando o tema do seu site
Como o Jekyll usa tecnologias de frontend web padrão (como HTML, JS, CSS), é fácil criar temas para ele. Você também pode dispor de uma infinidade de temas para escolher como por exemplo o JekyllThemes.Org, JekyllThemes.io, Themes.Jekyllrc.org, ThemesForest.net, Themes.Jekyllrc.org, desde temas gratuitos até aqueles pagos que incluem suporte e atualizações.
5. Compatibilidade na KingHost
Por se tratar em tecnologias que rodam 100% no navegador, o Jekyll é compatível com a grande maioria das hospedagens. Isso, é claro, inclui a KingHost. Se você quer entender mais, já publicamos um artigo com tudo que você precisa saber sobre hospedagem de site. Conheça nossos planos de hospedagem clicando aqui embaixo.
