CMS-Free Websites, descubriendo Jekyll

  • Cosas Tekis
  • Proyectos
por

¿Harto de mantener infraestructuras complejas para portales que no son tan complejos? ¿Harto de parchear CMSs, servidores de base de datos, servidores web…? ¿Harto de buscar soluciones de cacheo complejas para soportar los picos de tráfico de tus portales? ¿Harto de que para pintar un post de un blog haya que ser doctorado por el MIT?

Nosotros en algunos casos sí, estamos hartos. En Biko siempre hemos sido una empresa que ha apostado por soluciones de gestión de contenidos para desplegar todos nuestros proyectos, es más, en nuestro haber tenemos la construcción de varios CMS propios.

Sin embargo, muchos proyectos no requieren de la implantación de soluciones tecnológicas complejas para ser un éxito, en otros no merece la pena invertir la mitad del presupuesto en componer una solución tecnológica basada en un CMS (sea Drupal, WordPress o la solución propietaria que se os ocurra). Por estos motivos (y otros), últimamente estamos apostando en algunos de nuestros proyectos por una serie de soluciones más sencillas, algo así como “back-to-the-basics” o “keep it simple stupid” del desarrollo web. Nuestra pila tecnológica: HTML, CSS y Javascript.

Y os preguntareis: ¿HTML, CSS y JS? ¿eso no son sitios estáticos? ¿y en que programáis… PHP, Ruby, NET…?. La respuesta: sí son sitios estáticos, programados en nada. ¿Mande? hombre una cosa es “back-to-the-basics” y otra es “back-to-the-pleistoceno”.

¡La generación dinámica de sitios estáticos al rescate!

Vamos a meter otra pieza en la arquitectura tecnológica sin complicarla demasiado, para que nos facilite la vida a nivel de desarrollo, y así volvemos del pleistoceno al presente. Esta pieza es Jekyll. Jekyll es un sistema de plantillas y un generador de sitios estáticos que usando unas reglas muy sencillas permite generar bajo demanda todo un site. Con jekyll disponemos de:

  • Un sistema que nos permite tener includes y plantillas (layouts). No vamos a repetir en todas nuestras páginas el esqueleto del documento HTML…
  • Dispone de un lenguaje muy básico para darle algo de lógica a las plantillas.
  • Concretamente usamos Liquid lo que nos permite estructuras de control (if, case, for), definición de variables, filtros de tratamiento de texto, etc…
  • Podremos hacer listados de contenidos fácilmente, paginarlos, taggear contenidos, clasificarlos, etc…
  • Es extensible programando plugins en ruby.

¿Como funciona Jekyll?

Jekyll es un software de consola escrito en ruby que toma como entrada un directorio con una estructura concreta de carpetas y ficheros de configuración y siguiendo unas reglas muy básicas genera una versión estática del site (al final tendremos únicamente HTML, CSS y JS en nuestro site final).

Funcionalidades avanzadas a través de servicios externos

Ummm… ¿y si tengo que hacer cosas complejas en el site?, lease publicar comentarios, fotos, videos… En el pasado esto hubiera sido un problema ahora ya no. Existen multitud de servicios de calidad que ofrecen APIs REST o widgets con los que embeber sus contenidos. Usamos Disqus para comentarios, Vimeo o Youtube para integrar video, Flickr para gestionar galerías de fotos, etc…

Ya, ¿y si lo que necesito no existe? Hombre entonces sí que hay que programarlo, pero en lugar de hacerlo para el portal que estamos montando, ¿porque no lo creamos como un servicio y exponemos la funcionalidad como lo hacen estos grandes servicios online?. Esto nos permitirá construir nuestros sites usando exclusivamente tecnologías de cliente y embeber servicios externos para funcionalidades complejas. Si un servicio falla el resto del site no se verá afectado, esto mejora en gran medida la tolerancia a fallos del sistema en su globalidad.

Alojamiento gratuito y generación al vuelo en GITHub

No está de más decir que Jekyll es un sistema creado por la gente de GitHub para su servicio de Github pages y totalmente integrado con este sistema de alojamiento. Gracias a ello es posible alojar en una cuenta de GitHub un site construido usando Jekyll y que la infraestructura de GitHub se encargue de autogenerar el site y servir las páginas, y todo ello gratis. Sí, he dicho gratis.

Más información:
http://jekyllrb.com: Toda la información sobre jekyll.
http://pages.github.com: Servicio de alojamiento gratuito.
https://help.github.com/articles/using-jekyll-with-pages: Información del uso de Jekyll en Github
http://developmentseed.org/blog/2012/07/27/build-cms-free-websites/ (esta gente nos abrió los ojos a esta tecnología, algunos de los mensajes de este post están extraidos de las ideas expuestas por Development Seed en este post).

Algunos sites que hemos construido últimamente usando esta tecnología:
http://restaurantes.baztan-bidasoa.com
http://www.dontknowschool.com/
http://reporte2012.alicorp.com.pe/

Comentarios

  1. edipotrebol

    10 Octubre 2013

    Muy buena entrada en español siguiendo la línea de lo que empezaron a introducir lxs compañerxs de DevelopmentSeed [1] y como no lxs grandes de Github.
    Me encanta este paradigma noCMS y lo veo aplicable tanto para sites pequeños como para algunos sites de más tamaño. Yo lo aplico en mi blog personal y estoy muy contento con administración y velocidad de carga de páginas. En mi Github tenéis el código del template que implementé (basado en PureCSS de Yahoo).

    [1] Recordemos, líderes de Drupal hace 2 ó 3 años.

    • Abimael

      10 Diciembre 2013

      Hola, realmente esto del Jekyll es muy interesante y me gustaria compartir experiencias de aprendizaje y seguir por el camino de las paginas con jekyll.

Deja tu comentario