Criando e Publicando um Blog com Hugo e Cloudflare Pages

Se você quer criar um blog rápido, leve e fácil de manter, o framework Hugo é uma excelente escolha. Combinado com o Cloudflare Pages para hospedagem gratuita, você pode ter seu blog online em poucos minutos. Neste tutorial, vamos passar por todos os passos necessários.

Pré-requisitos

Antes de começar, certifique-se de ter os seguintes itens instalados:

  • Git - para controle de versão
  • Hugo - para geração do site estático
  • Uma conta no Cloudflare

Passo 1: Criar um Novo Projeto Hugo

  1. Abra seu terminal.

  2. Execute o seguinte comando para criar um novo site:

    hugo new site meu-blog

  3. Navegue até o diretório criado:

    cd meu-blog

  4. Inicialize o repositório Git:

    git init

Passo 2: Adicionar um Tema ao Hugo

Hugo suporta vários temas prontos que você pode usar. Aqui está como adicionar um tema:

  1. Escolha um tema no repositório oficial do Hugo Themes: https://themes.gohugo.io/.

  2. No exemplo, usaremos o tema hugo-coder. Execute:

    git submodule add https://github.com/luizdepra/hugo-coder.git themes/hugo-coder

  3. Configure o tema no arquivo config.toml:

    theme = "hugo-coder"

Passo 3: Criar o Primeiro Post

  1. Crie um novo post:

    hugo new posts/meu-primeiro-post.md

  2. Edite o arquivo content/posts/meu-primeiro-post.md com o conteúdo do seu post:

    ---
title: "Meu Primeiro Post"
date: 2024-12-25
draft: false
---

Este é o meu primeiro post no blog criado com Hugo!

Passo 4: Testar o Blog Localmente

Antes de publicar, visualize seu blog localmente:

hugo server

Acesse http://localhost:1313 no navegador para ver seu blog.

Passo 5: Publicar no Cloudflare Pages

Configurar o Repositório no GitHub

  1. Crie um repositório no GitHub e empurre os arquivos do seu blog:

    git remote add origin https://github.com/seu-usuario/meu-blog.git
git branch -M main
git push -u origin main

Configurar o Cloudflare Pages

  1. Acesse o painel do Cloudflare Pages.

  2. Clique em Create a project.

  3. Conecte sua conta GitHub e selecione o repositório do blog.

  4. Configure os seguintes parâmetros:

    • Framework Preset: Hugo
    • Build Command: hugo
    • Output Directory: public

  5. Clique em Save and Deploy.

O Cloudflare Pages irá automaticamente construir e publicar seu blog. Após alguns minutos, ele estará disponível em um domínio gerado pelo Cloudflare.

Conclusão

Agora você tem um blog funcional usando Hugo e hospedado no Cloudflare Pages! Aproveite para personalizar o tema, adicionar mais conteúdo e compartilhar seu site com o mundo.

Caso tenha dúvidas ou sugestões, deixe nos comentários! 🚀