Gozer: un sencillo generador de sitios web estáticos.

Gozer: un sencillo generador de sitios web estáticos

Cat ramen
Cat ramen Jamstack

En la movida conocida como Jamstack, los generadores de sitios web estáticos ocupan un lugar central. Hoy te propongo darle una mirada a uno de los tantos generadores que andan en la vuelta, estoy hablando de Gozer.


¿Qué es Gozer?

Gozer es un generador de sitios web estáticos que fue concebido para ser rápido y sencillo de usar.

Desarrollado en Golang, este generador está diseñado para transformar archivos Markdown en HTML, ofreciendo a los usuarios cierta flexibilidad al momento de personalizar los sitios web.

Características de Gozer

Gozer destaca, sobre todo, por su capacidad de convertir de manera rápida el texto escrito en Markdown a HTML; porque sí, al igual que otros generadores estáticos, Markdown es el lenguaje elegido para escribir el contenido.

⚡ Probé Gozer con 5010 archivos Markdown, y realizó la conversión en unos sorprendentes 9.601 segundos. Nada mal, Gozer; nada mal.

El uso de Markdown en este tipo de generadores, está muy extendido por ser más «amigable» con el usuario. HTML no está mal, pero si escribís todos los días, lidiar con los tags de HTML, aunque solo sean párrafos y alguna cosa más, es un poco cansador.

Gozer dispone de algunas funcionalidades que amplían sus capacidades más allá de la generación de las páginas web, como la creación de mapas de sitio XML para los motores de búsqueda y fuentes RSS para lectores de feeds.

Instalando Gozer

Hay dos formas de instalar Gozer, a saber:

  1. Bajando el último binario disponible desde acá 👉 Releases.
  2. Usando el instalador de Go (requiere tener Golang instalado):

go install github.com/dannyvankooten/gozer@latest

Una vez que lo tenes instalado, elegí un directorio y ejecuta lo siguiente:

gozer new

Crear un proyecto con Gozer.
Creando un proyecto con Gozer.

Este comando crea la siguiente estructura:

  • config.toml: Archivo de configuración en formato TOML.
  • content: Directorio en donde viven los archivos Markdown (extensión .md), que contienen el contenido del sitio. Por defecto, crea el archivo index.md.
  • public: Acá quedan los archivos estáticos generados por Gozer.
  • templates: Archivos HTML que son usados en combinación con el sistema de template de Go: html/template. Por defecto, se genera el archivo default.html.

Buildeando el proyecto

Vamos a construir el sencillo sitio web que viene por defecto en el repositorio del proyecto. Estando ubicado en el directorio en donde vas a generar el sitio, ejecuta el siguiente comando:

gozer build

Buildeando un proyecto.
Buildeando un proyecto.

Este comando es el encargado de construir el sitio web estático a partir de los archivos Markdown, utilizando los templates que hayas definido. También te crea los archivos feed.xml y sitemap.xml

Una utilidad interesante que viene incluida en Gozer, es la posibilidad de levantar un servidor web ejecutando el comando: 

gozer serve

Esto permite que veas el sitio en http://127.0.0.1:8080

Sitio por defecto que viene en el proyecto Gozer.
Sitio por defecto que viene en el proyecto Gozer.

🤙 El servidor es capaz de reconocer los cambios en tiempo real, y generar un nuevo build.

Creando contenido

Cómo mencioné anteriormente, el contenido se escribe en formato Markdown. Si no estás familiarizado con el formato, te recomiendo ver la documentación oficial 👉  https://www.markdownguide.org

A modo de ejemplo, vamos a crear una página que simule ser la entrada en un blog. El primer paso es generar un archivo Markdown que tenga la fecha y el nombre del post: 2024-12-03-funes-el-memorioso.md

En la cabecera del texto, incluimos el título de la página usando el formato TOML, y el contenido:

+++
title = "Funes, el memorioso"
+++
Lo recuerdo (yo no tengo derecho a pronunciar ese verbo sagrado, sólo un hombre en la tierra tuvo derecho y ese hombre ha muerto) con una oscura pasionaria en la mano, viéndola como nadie la ha visto, aunque la mirara desde el crepúsculo de día hasta el de la noche, toda una vida entera. Lo recuerdo, la cara taciturna indiada y singularmente remota, detrás del cigarrillo. Recuerdo (creo) sus manos afiladas de trenzado.

Ejecutamos gozer serve y nuestra recién creada página queda accesible en: http://127.0.0.1:8080/funes-el-memorioso/

Página con contenido generada con Gozer.

Gozer agarró el nombre del archivo (que era este: 2024-12-03-funes-el-memorioso.md), creó un directorio llamado funes-el-memorioso dentro de la carpeta Build, y un archivo index.html, que contiene el contenido convertido a HTML.

Los templates

Gozer usa el paquete html/template de Goland; esto nos da la funcionalidad básica para poder armar nuestros sitios. 

Dentro de la carpeta templates, vas a ver un archivo default.html. Ese archivo contiene dos variables: title y content.

<!DOCTYPE html>
<head>
   <title>{{ .Title }}</title>
</head>
<body>
   {{ .Content }}
</body>
</html>

Todos los template reciben las siguientes variables:

  • Pages: Todas las páginas en el sitio
  • Posts: Todos los post en el sitio. Un post es cualquier página con una fecha en el nombre de archivo.
  • Site: Propiedades globales del sitio: Url, Title
  • Page: La página actual, que tiene los siguientes atributos: Title, Permalink, UrlPath, DatePublished y DateModified.
  • Title:  El título de la página actual (es una abreviación de Page.Title).
  • Content: El contenido de la página convertido a HTML.

Podés utilizar esas variables dentro de los archivos templates, por ejemplo, para iterar por todos los posts, o preguntar si un archivo tiene fecha de publicación, como se puede apreciar en el siguiente código:

<div class="container-fluid">
	<div class="row fh5co-post-entry">
		{{ range (slice $.Posts 0 4) }}
		<article class="col-lg-3 col-md-3 col-sm-3 col-xs-6 col-xxs-12 animate-box">
			<figure>
				<a href="{{ .Permalink }}"><img src="images/pic_1.jpg" alt="Image" class="img-responsive"></a>
			</figure>
			<span class="fh5co-meta"><a href="#">Markdown</a></span>
			<h2 class="fh5co-article-title"><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
			{{ if not .DatePublished.IsZero }}
			<span class="fh5co-meta fh5co-date">{{ .DatePublished.Format "Jan 2, 2006" }}</span>
			{{ end }}
		</article>
		{{ end }}

		<div class="clearfix visible-lg-block visible-md-block visible-sm-block visible-xs-block"></div>
		<div class="clearfix visible-xs-block"></div>
	</div>
</div>

También es posible incluir templates, funcionalidad fundamental para evitar repetir código. La inclusión se hace de la siguiente manera:

{{ template "_header.html" .}}

😕 Ojo con ese punto luego del nombre del archivo a incluir. Hay que ponerlo siempre. (Perdí una buena media hora por no haber incluido ese maldito punto).

Por defecto, todos los archivos de contenido (los que tienen formato Markdown) utilizan el template default.html; sin embargo, podés especificar que template usar de la siguiente manera:

+++
title = "Título"
template = "mi-default.html"
+++

Contenido en Markdown.

¿Hay templates disponibles?

Gozer es un proyecto que, al momento de escribir esto, tiene menos de un año de antigüedad, por lo tanto, aún no hay muchos recursos disponibles. Sin embargo, al usar un sencillo motor de template que está muy bien documentado, es cuestión de tiempo para que la comunidad comience a generar alguna que otra plantilla.

Te dejo una adaptación que hice del tema de Magazine de Free CSS. Es una plantilla básica, pero puede servir si queres hacer un blog sencillo 🌐 https://magazine-gozer.surge.sh

Podés descargar el template desde el siguiente repo 👉 https://github.com/htejera/magazine-gozer

Template «Magazine» de Free CSS adaptado para Gozer.
Template «Magazine» de Free CSS adaptado para Gozer.

Si buscas un tema más minimalista, quizás te interese Tokyo. Podés descargarlo desde el repo: https://github.com/htejera/tokyo-gozer 

Tema Tokyo para Gozer.
Tema Tokyo para Gozer.

El creador de Gozer también publicó su sitio web personal en Github, que, por supuesto, se genera con Gozer 👉 https://github.com/dannyvankooten/www.dannyvankooten.com

¿Dónde alojar un sitio web estático creado con Gozer?

Podés hostear tu sitio web en prácticamente cualquier proveedor de alojamiento.

De los que yo he probado, te puedo mencionar a: Netlify, Surge, Cloudfare Pages, Kinsta y tiiny.host.

La mente detrás de Gozer

Todo software tiene una (o más) cabezas que dieron vida a la criatura. En este caso, el padre de Gozer es el programador holandes, Danny van Kooten.

Perfil de Github de Danny van Kooten
Perfil de Github de Danny van Kooten.

Según su página personal:

«He estado creando, manteniendo y brindando soporte para software de código abierto como mi principal fuente de ingresos durante más de una década.

 Todo comenzó en el verano de 2013 cuando estuve hospitalizado en Vietnam debido a una apendicitis aguda y tuve algo de tiempo libre mientras practicaba reposo en cama. Ese tiempo se aprovechó para crear MC4WP, un complemento de WordPress que ahora se utiliza activamente en más de 2 millones de sitios web.»

Gracias Danny van Kooten.

Fin.


/ Súmate al boletín. No es gran cosa, pero es gratis 👇 /