Propuesta de web del hackmeeting implementada con hugo
Go to file
Ales (Shagi) Zabala Alava c0d460de1d
continuous-integration/drone/push Build is passing Details
Añadir asistencia al archetype para nuevo hm
2021-11-20 10:36:39 +01:00
archetypes Añadir asistencia al archetype para nuevo hm 2021-11-20 10:36:39 +01:00
bin Convertir asistencia a csv, scripts auxiliares para facilitar la web 2021-11-20 10:33:42 +01:00
content Convertir asistencia a csv, scripts auxiliares para facilitar la web 2021-11-20 10:33:42 +01:00
layouts Convertir asistencia a csv, scripts auxiliares para facilitar la web 2021-11-20 10:33:42 +01:00
static Corregir urls de ficheros estáticos para poder publicar la web en una carpeta en vez de en la raíz 2021-09-17 12:39:22 +02:00
utils Convertir asistencia a csv, scripts auxiliares para facilitar la web 2021-11-20 10:33:42 +01:00
.drone.yml Publicar la web automáticamente al hacer push a master 2021-09-19 11:53:40 +02:00
.gitignore Maquetación básica, pasamos de la theme, empezar a plantear la estructura del contenido 2021-09-16 13:28:31 +02:00
README.md Convertir asistencia a csv, scripts auxiliares para facilitar la web 2021-11-20 10:33:42 +01:00
config.toml Maquetación básica, pasamos de la theme, empezar a plantear la estructura del contenido 2021-09-16 13:28:31 +02:00

README.md

Página web del hackmeeting

La principal ventaja de esta web con respecto a la que hay actualmente es que no necesita mantenimiento, mantiene la posibilidad de editar contenido por varias personas y simplifica el backup.

El flujo de trabajo típico para añadir contenido a la web sería este:

  1. Crear o editar un fichero en la carpeta content
  2. Comprobar en local que la modificación es correcta
  3. Hacer un commit con las modificaciones
  4. Subir el commit al repositorio de git
  5. Compilar la web
  6. Enviar los ficheros al servidor web.

Los pasos 5 y 6 se pueden automatizar con alguna herramienta de integración continua. En este ejemplo se usa drone.io. Para simplificar el resto de los pasos la idea es preparar scripts u otro tipo de programas, que ayuden a generar el contenido de manera más interactiva.

Este proceso puede ser demasiado complicado para personas sin experiencia en git o markdown, sobre todo las integrantes del grupo local, que además no conocen el funcionamiento de esta herramienta. Propongo instaurar el rol de "madrina(s) de grupo local", gente que se encargue de asistir al grupo local y en caso necesario de encargarse de subir los contenidos a la web.

Los datos que son más útiles para el grupo local se guardan en ficheros csv, que es fácil de modificar en una hoja de cálculo, y permite un postpropceso sencillo para obtener datos interesantes. Por ejemplo la cantidad de asistentes que hay apuntados para cenar el sábado.

Crear contenido

Hay una serie de comandos auxiliares para gestionar el contenido de la web de manera sencilla.

Todos estos comandos aceptan un parámetro opcional: el año en el que estamos trabajando. Si no se indica año se asume el actual.

Para crear un nodo:

bin/nuevo_nodo

Para gestionar la asistencia:

bin/asistencia

Para gestionar las necesidades:

bin/necesidades

Para crear una página corriente:

bin/nueva_pagina

Para empezar un nuevo hackmeeting:

bin/nuevo_hackmeeting

Mini intro a Hugo

Para probar la web en local hay que instalarse hugo: https://gohugo.io/getting-started/installing/

Para poner en marcha la web en modo desarrollo:

hugo server -D

Para compilar la web ejecutar el comando hugo sin parámetros, luego basta con copiar el contenido de la carpeta public al servidor web.

Todo el contenido de la web está en la carpeta content.

Las plantillas para renderizar el contenido están en la carpeta layouts.

Las plantillas para generar contenido están en la carpeta archetypes.

Los ficheros estáticos están en la carpeta static, se copian tal cual a la carpeta public.

Más información: https://gohugo.io/documentation/

Estructura básica del contenido

Cada año creamos una carpeta nueva dentro de content, usando el archetypes hm. Esta carpeta tiene la página inicial, el manifiesto, el listado de nodos y la página de asistencia.

Shortcodes

Estos son los shortcodes definidos para el hackmeeting:

rawHTML

Renderiza el contenido del shortcode sin procesar, por lo que se puede meter html arbitrario.

Ejemplo:

{{< rawHTML >}}
<table>
    <tr><td>Una tabla</td></tr>
</table>
{{< /rawHTML >}}

csvTable

Renderiza un csv como una tabla HTML. Hay que pasarle dos parámetros, el path del csv relativo a la raíz del proyecto y la clase css que se le asignará a la tabla.

Hay que generar un fichero csv separado por comas.

Ejemplo, para un fichero `content/2019/nodos/parrilla_viernes.csv':

{{< csvTable file="/content/2019/nodos/parrilla_viernes.csv" class="parrilla" >}}