Cómo hostear tu sitio de Jekyll en Apache2

Agosto 31, 2023

Pues finalmente tengo un blog personal justo como lo quiero. No diría que fue tardado (me tomó un par de días) o que mejor hubiera usado alguna alternativa más compleja, como WordPress. Pero he de reconocer que no fue tan sencillo cómo lo esperaba. Fuera de las personalizaciones que hice al tema que utilizo, creo que el mayor responsable de mi sufrimiento fue apache.

Así que creo que una guía de qué hacer para hostear un sitio estático hecho con jekyll en un VPS con apache2 es buena idea para un primer post, así que vamos para allá. Nota, ya asumo que tienes tu sitio en jekyll y sólo buscas desplegarlo a tu servidor, así que omitiré el cómo generarlo.

Requisitos

  • Un VPS, ya sea con un proveedor de hosting como vultr o una computadora prendida 24/7 en tu casa. Sólo cerciórate de que sea accesible al internet (que tenga una IP pública fija), que es lo importante.
  • Alguna distribución linux instalada como sistema operativo en tu servidor. Yo uso Debian pero las instrucciones que aquí mostraré son independientes de la distribución.
  • Apache2
  • Ruby; recomiendo usar rbenv

Apache2

Si deseas tener tu sitio en el directorio principal de apache (en debian es /var/www/html/) y por ende, en tu dominio principal (no subdominio) entonces no hay más configuración extra que la que mostraré. Si en cambio hostearás tu blog en un subdominio, ten en cuenta que hay algunas cosas que tendrás que tomar a consideración, como el nombre del servidor y el directorio donde residirá tu blog.

Buscamos, o bueno, yo buscaba dos cosas: internacionalización y URLs bonitos. La configuración que mostraré a continuación toma en cuenta estos dos puntos, y los logra mediante mod_rewrite.

<VirtualHost _default_:443>
	ServerName example.com

	DocumentRoot /var/www/html/
	DirectoryIndex index.html	
		
	RewriteEngine On
	RewriteRule ^/(page[1-9]+)$ %{DOCUMENT_ROOT}/$1/index.html
	RewriteRule ^/en/(page[1-9]+)$ %{DOCUMENT_ROOT}/en/$1/index.html
	RewriteRule ^/en/$ %{DOCUMENT_ROOT}/en/index.html
	RewriteCond %{REQUEST_FILENAME} !-f
	RewriteCond %{REQUEST_FILENAME} !-d	
	RewriteRule ^([^\.]+)$ $1.html [NC,L]
	
	ErrorDocument 404 "/not-found"

	ErrorLog ${APACHE_LOG_DIR}/error.log
	CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Las dos primeras reglas son para paginación, utilizando la rubygem jekyll-paginate. Si no utilizarás paginación puedes omitirla, aunque recomiendo que si hagas uso de ella.

La segunda es un caso, por ahora sólo tendré el blog en español e inglés, aunque si deseo, en el futuro, agregar un tercer idioma, podría cambiar la expresión regular a:

^/(en|fr)/(page[1-9]+)$

Lo mismo para la siguiente expresión regular, que se ocupa de servir el índice en cada idioma. Las otras tres que le siguen son para tener URLs bonitos (sin la extensión de los archivos).

La última configuración es la página que mostrará el servidor web siempre que haya un 404, lo más probable es que el tema que estés utilizando tenga una, y si no, vale la pena crearla pues la que muestra apache no es particularmente bonita.

Permisos de usuario

El directorio /var/www/html suele pertenecer al grupo y usuario www-data, pero si gustas puedes añadirte a este grupo o mejor, convertirte en el dueño:

sudo chown -R $(whoami) /var/www/html

Esto es útil si deseas hacer uso de hooks en tu repositorio de git, para que con cada cambio la página se actualice automáticamente, así no le tendrías nada que envidiar a un blog en wordpress.

Deploy hook

Si usas un usuario especial como dueño de tus repositorios de git como yo, (mi usuario git en mi VPS no tiene acceso a una terminal por ejemplo) entonces puedes crear otro repositorio remoto y apuntar hacia él:

Servidor

git --bare init tu_blog.git
cd tu_blog.git
touch hooks/post-receive

Cliente (donde escribas tus entradas)

git remote add deploy tu_usuario@example.com:/home/tu_usuario/tu_blog.git
git push deploy

Script post-receive

Ahora, el script que se ejecutará cada que hagas git push es el siguiente, cortesía de la documentación de jekyll. Lo modifiqué pues yo uso rbenv, será tu caso si también lo utilizas, pero si instalaste ruby y bundler con, por ejemplo, tu gestor de paquetes, entonces no necesitarás añadir el directorio de tus rubygems a tu PATH, pero si instalaste ruby de otra forma, si es necesario.

#!/bin/bash -l

export GEM_HOME=$HOME/.rbenv/shims/
export PATH=$GEM_HOME:$PATH

GIT_DIR=$HOME/blog.git
TMP_GIT_CLONE=$HOME/tmp
GEMFILE=$TMP_GIT_CLONE/Gemfile
PUBLIC_WWW=/var/www/html # Usa el directorio desde donde sirvas tu blog.

git clone $GIT_DIR $TMP_GIT_CLONE
BUNDLE_GEMFILE=$GEMFILE bundle install
BUNDLE_GEMFILE=$GEMFILE bundle exec jekyll build -s $TMP_GIT_CLONE -d $PUBLIC_WWW
rm -Rf $TMP_GIT_CLONE
exit

Conclusiones

Pues ese fue el setup de mi página web. Personalmente pienso que si hay cierta barrera técnica, y es una lástima porque jekyll cubre con creces muchos casos de uso, pero a los usuarios técnicos a veces se nos olvida que lo que es fácil para nosotros, como un git push, es magia negra para otros, ya no hablemos del tocho de configuración que usa nuestro servidor apache o haber tenido que escribir un hook de git. Aún así, disfruto de jekyll, y disfruté de este proceso, y espero que tú también lo hagas.