Olá, Mundo! Bem-vindos ao meu novo blog com Jekyll

Hoje é um dia especial:

Estou [re]inaugurando meu blog pessoal, que foi desenvolvido utilizando o Jekyll e o tema Indigo, uma ferramenta incrível para criar sites e blogs estáticos como este. Quero aproveitar este primeiro post para compartilhar um pouco sobre como o Jekyll funciona, suas vantagens e como ele se integra perfeitamente com o GitHub Pages.

O que é o Jekyll?

O Jekyll é um gerador de sites estáticos desenvolvido em Ruby. Ele converte arquivos simples, como Markdown ou HTML, em um site completamente estático, sem a necessidade de um banco de dados ou linguagem de servidor.

Utilizando o Liquid, uma template engine de código aberto criada pela Shopify e escrita em Ruby, o Jekyll consegue interpretar alguns dados parametrizados em arquivos de configuração, geralmente no arquivo _config.yml, e gerar páginas HTML dinâmicas a partir destes dados.

Vantagens do Jekyll

• Velocidade: Sites estáticos são muito mais rápidos do que sites dinâmicos, pois não precisam consultar um banco de dados para renderizar uma página. O Jekyll gera páginas HTML estáticas que são servidas diretamente para o usuário.

• Segurança: Sites estáticos são muito mais seguros do que sites dinâmicos, pois não possuem vulnerabilidades de banco de dados ou de servidor.

• Simplicidade: O Jekyll é muito fácil de usar e não requer conhecimento avançado de programação. Basta escrever seu conteúdo em Markdown ou HTML e o Jekyll fará o resto após o seu processo de build.

Como o Jekyll funciona na prática?

O Jekyll é uma ferramenta de linha de comando que pode ser instalada via RubyGems (embora eu não seja do mundo Ruby, posso dizer que as Gems são basicamente pacotes do NPM ou Composer).

O processo de criação de um novo é simples e sua documentação é mais do que suficiente para quem está começando. A documentação oficial do Jekyll pode ser encontrada aqui.

Em resumo prático, ao criar um projeto prático com o Jekyll, você terá uma estrutura de pastas semelhante a esta:

.
├── _config.yml
├── _data
│   └── members.yml
├── _drafts
│   ├── begin-with-the-crazy-ideas.md
│   └── on-simplicity-in-technology.md
├── _includes
│   ├── footer.html
│   └── header.html
├── _layouts
│   ├── default.html
│   └── post.html
├── _posts
│   ├── 2007-10-29-why-every-programmer-should-play-nethack.md
│   └── 2009-04-26-barcamp-boston-4-roundup.md
├── _sass
│   ├── _base.scss
│   └── _layout.scss
├── _site
├── .jekyll-cache
│   └── Jekyll
│       └── Cache
│           └── [...]
├── .jekyll-metadata
└── index.html # can also be an 'index.md' with valid front matter

E como é de se esperar, o diretório _posts é onde você armazena seus posts em Markdown, com o formato de nome de arquivo ANO-MES-DIA-titulo.md.

É possível também criar layouts personalizados, includes e data files para organizar melhor o seu projeto.

Ele também suporta tags e categorias para organizar seus posts, como você pode ver no front matter deste post.

Ao concluir a escrita de um post, você pode rodar o comando jekyll build para gerar o site estático, que será armazenado no diretório _site. E é este site que será servido para o usuário final, sendo ele composto por páginas HTML estáticas.

Integrando o Jekyll com o GitHub Pages

O GitHub Pages é um serviço de hospedagem de sites estáticos do GitHub. Ele é gratuito e permite que você hospede sites estáticos diretamente de um repositório do GitHub.

Para integrar o Jekyll com o GitHub Pages, basta criar um repositório com o nome SEU_USUARIO.github.io e fazer o push do seu site estático gerado pelo Jekyll para este repositório. O GitHub Pages irá automaticamente servir o seu site estático na URL https://SEU_USUARIO.github.io.

Caso prefira, você também pode deixar a parte de build do Jekyll para o GitHub, utilizando o GitHub Actions para gerar o site estático automaticamente a cada push no repositório. Ao criar um novo repositório no GitHub, acessando a aba “Settings” e depois “Pages” (ao lado esquerdo da tela), será oferecida a opção de adicionar um tema Jekyll automaticamente através do link “Learn how to add a Jekyll theme to your site”.

Através dessa simples integração, você pode ter um blog pessoal ou um site estático de forma gratuita e sem complicações.

O que esperar deste blog?

Aqui, compartilharei ideias, aprendizados e experiências do meu dia a dia como desenvolvedor de software. Meu objetivo é criar um espaço para discutir tecnologia, metodologias de desenvolvimento, frameworks e boas práticas — tudo isso enquanto pratico e aprimoro minha escrita e técnica.

E é isso! Espero que você tenha gostado deste post e que ele tenha te inspirado a criar o seu próprio blog com Jekyll. Se tiver alguma dúvida ou sugestão, deixe um comentário abaixo. Até a próxima!

Matheus Martins

Desenvolvedor de Software Full Stack

Tweet Share