Como digo en el Hola mundo uno de los motivos de crear este blog es compartir lo aprendido. Así que, que mejor que empezar en lo que he aprendido para crear este blog.

compartir lo aprendido. Así que, que mejor que empezar en lo que he aprendido para crear este blog.

Como sabrás, existen multitud de software para crear blogs. Muchos de ellos muy potentes y con una gran cantidad de plugins, temas, etc. Durante un tiempo estuve jugando con WordPress para crear este blog, pero no me terminaba de convencer. Entonces, me enteré de la existencia de Jekyll. Jekyll es un software de creación de blogs estáticos escrito en Ruby por Tom Preston-Werner, uno de los creadores de Github, por lo que está perfectamente integrado con este. Por mi parte no lo he integrado en mi github, pero no descarto hacerlo en un futuro.

Lo que más me gusta es su sencillez. Sólo tengo que centrarme en escribir. Wordpress apenas lo usaba, pero cada vez que entraba en la consola de administración tenia que actualizar algún plugin o el propio WordPress. Con Jekyll al final consigues un sitio web estático y solo te tienes que preocupar de subir ese contenido cada vez que lo cambias. Cada nueva entrada es un nuevo fichero en formato markdown que Jekyll se encarga de transformar en HTML.

Jekyll lo ejecuto en un contenedor de Docker. Me parece de los más cómodo para probar o usar un software. Te bajas una imagen del software que necesitas y pocos minutos tienes un contenedor funcionando. En el caso de jekyll uso un script de Docker Compose que es lo que uso para elaborar este blog. Doy por hecho que sabes o conoces Docker y Docker Compose. Sino es el caso lo siento y te recomiendo mucho que empieces a aprender de que va Docker y como usarlo. Para mi es una herramienta que me ha ayudado mucho en lo profesional y en lo personal.

Configurando nuestro blog

En Jekyll puedes empezar de cero, crear un sitio en blanco y hacer tu propio tema de Jekyll. Yo he ido a lo fácil y he usado un tema ya creado por otra persona y que me ha gustado. En concreto se trata de un tema que se llama beautiful-jekyll. En Jekyll themes hay un motón de temas donde elegir.

En este caso, he obtenido el tema del repositorio de gibhub del autor. Una vez obtenido lo he dejado en una carpeta que se llama site. A la altura de este directorio he creado el fichero de Docker Compose (docker-compose.yml) con este contenido

Ahora vamos a ver que tenemos en site:

  • css Muchos como este son obvios. Aquí están las hojas de estilo.
  • img Aquí las imágenes.
  • js Otro de los obvios.
  • _layouts Este directorio contiene ficheros html que definen los layouts de los distintos tipos de páginas que formaran el blog.
  • _includes Este directorio incluye varios ficheros html que se incluirán dentro de los layouts.
  • _plugins Si el tema que usemos tiene algún plugin, aquí se guardaran sus ficheros. Estos plugiuns se realizan en Ruby.
  • _posts Aquí iremos creando las entradas del blog. Son ficheros Markdown. Los temas suelen llevar alguno de ejemplo.
  • _site Aquí se generará todo los ficheros del blog. Yo es el directorio que subo al servidor.

El script de Docker compose que uso es este:

version: '2'

services:
  jekyll:
    image: bretfisher/jekyll-serve
    volumes:
      - ./site:/site
    ports:
      - '4000:4000'

Como se ve, el directorio site se usa como volumen para que jekyll lo use como fuentes de nuestro sitio. Una vez termine de arrancar el contenedor de Docker saldrá un texto igual o similar a este:

jekyll_1  | Configuration file: /site/_config.yml
jekyll_1  |             Source: /site
jekyll_1  |        Destination: /site/_site
jekyll_1  |  Incremental build: disabled. Enable with --incremental
jekyll_1  |       Generating... 
jekyll_1  |                     done in 3.357 seconds.
jekyll_1  |  Auto-regeneration: enabled for '/site'
jekyll_1  |     Server address: http://0.0.0.0:4000/
jekyll_1  |   Server running... press ctrl-c to stop.

Ahora accedemos al blog que ha generado. Por defecto el contenedor esucha en el puerto 4000, así que abro la url http://0.0.0.0:4000

Home

Lo siguiente será configurar el tema. Para ello los temas de Jekyll sulen tener un fichero denominado _config.yml. Según el tema el contenido de este fichero variará, pero se suelen poder configurar cosas como nombre y descripción del sitio, url, configurar analytics, comentarios en los post, etc. Depende de las características del tema, de las funcionalidades que ofrezca y de cuanta personalización permita el tema habrá un contenido u otro en este fichero. En el tema que yo elegido se pueden configurar muchas cosas. Por ejemplo, me permite elegir si se pueden compartir o no los posts y en que redes sociales, si se permiten comentarios o no, e integrarlos con Disqus. Os voy a poner un ejemplo concreto: La barra de navegación superior. Para configurarlo tengo esta sección:

# List of links in the navigation bar
navbar-links:
  Sobre mí: "aboutme"
  Juegos: "juegos"

Como se ve, la sección es navbar-links y tiene dos claves. La parte de la izquierda de la clave es el texto que aparecerá en la barra y la parte derecha es la pagina a la que se navega al hacer click. Por lo que tendré que crear los ficheros aboutme.md y juegos.md cuyo formato deberá ser markdown. Los cambios que haga en fichero md los coge en caliente, pero los cambios en el fichero _config.yml los coge al reiniciar el servidor de Jekyll.

Una vez tengamos la configuración ya podemos ponernos a crear entradas para el blog. Los post también son fichero markdown. Hay que crearlos en en la carpeta _posts y la nomenclatura debe tener este formato:

YYYY-MM-DD-title-post.md

Osea que sería año, mes y día separado por guiones y un titulo que identifique el post, también separado por guiones. La fecha la tomará como la fecha de publicación del post, lo que servirá para ordenarlas en la página principal y el titulo también sirve para generar el fichero html, así que mejor poner algo descriptivo de verdad, ya que algo ayudará para el SEO.

Hay gente que usa el servidor que ejecuta Jekyll para servir la página. Seguramente con un nginx como proxy inverso se pueda hacer fácilmente. Yo prefiero servir la página en apache o nginx directamente. Todo el trabajo lo hago en local y luego subo la carpeta _site a mi servidor. También se puede usar Github pages para alojar el blog. Directamente haces push en tu repositorio de GitHub y se actualiza en tu Github pages. Una muy buena opción.

Para empezar a usar Jekyll creo que con esto puede valer. A lo mejor me animo algún día a hacer un theme y lo documento, aunque el diseño y el front no son mis especialidades.