Pandoc - Reveal.js by JallProfesor

Pandoc + reveal.js + Gulp

@JallProfesor

25/11/2020

Pandoc

Multiconversor de archivos.

  • una auténtica navaja suiza.
  • sorprende por su potencia y versatilidad.
  • es código abierto.
  • creado por el profesor de filosofía John MacFarlane
  • con una amplia comunidad de usuarios y desarrolladores.
  • fácilmente extensible con filtros que aumentan su potencia.
  • una extensa documentación la encontrará en Pandoc website.

Una gráfica mejor que mil palabras.

  • Las conversiones más utilizadas:
    • markdown a LaTeX\LaTeX o pdf.
    • markdown a html.
    • markdown a docx.
    • markdown a epub.
  • pero no son las únicas…

Markdowwn a Html

Es más fácil escribir markdown que html (o LaTeX\LaTeX ).

  • es un hecho comprobable.
  • si no vas a dedicarte a la programación web no te compensa
    el esfuerzo de aprender html y tecnologías asociadas.
  • en cambio aprender markdown es bastante fácil
  • escribes texto plano siguiendo una serie de pautas o convenciones.
  • Pandoc se encargará de convertir tus textos markdown(texto plano)
    a html(página web) utilizando una plantilla.
  • El proceso se puede automatizar de tal manera que
    puedas tener una web completa con unos cuantos markdown.
    Se conocen como generadores de sitios estáticos.

Por ejemplo, esta web está escrita en markdown y
utiliza un generador de sitio estático:

Extensiones

Hay infinidad de filtros de Pandoc que permiten ampliar las capacidades de markdown.
En esta presentación usamos dos filtros de Pandoc a modo de ejemplo:

  1. Pandoc static KaTeX\KaTeX que nos permite escribir cualquier fórmula matemática;
    por ejemplo, eiπ+1=0e^{iπ} + 1 = 0

  2. Pandoc Imagine que nos permite convertir bloques de código en imágenes;
    por ejemplo, la siguiente imagen está generada por el filtro usando gnuplot

reveal.js

Pandoc y presentaciones

Uno de los formatos de salida de Pandoc es la presentación.
Estas pueden ser en pdf o html. Entre estas últimas hay varias posibilidades:

¿Por qué reveal.js?

  • conjuga html, css y javascript.
  • presentaciones elegantes.
  • código abierto y gratuito.
  • múltiples posibilidades de configuración.
  • altamente personalizable.
  • extensible mediante plugins.

Plugins

Mencionaré solamente los utilizados en esta presentación.

  1. Propios de reveal.js (listado completo y documentación aquí)

    • zoom (pulse repetidamente Ctl+Click)
    • search (control + mayúsculas + f)
  2. Plugins desarrollados por terceros (un listado aquí)

    • Chalkboard (pizarra)
      Permite anotar la presentación o abre una pizarra.
      Se maneja usando iconos (abajo, izquierda) o atajos de teclado (Menú/Ayuda)
    • Menú [pulse repetidamente ‘m’]
    • Verticator
      agrega indicadores para mostrar la cantidad de diapositivas en una pila vertical.
    • Reveal.js Title Footer
      incluye un pie de página en todas las diapositivas de una presentación que mostrará el título de la presentación.

Gulp

Facilitando el trabajo.

Es automatizador de tareas. Se utiliza para crear flujos de trabajo eficientes.

  • es flexible, adaptable.
  • es capaz de realizar tareas complejas a partir de tareas simples.
  • es muy eficiente.
  • nos permite centrarnos en lo importante.

Si quieres saber cómo lo utilizamos échale un vistazo al
archivo gulpfile.js del repositorio de GitHub.

Combinado con npm podemos lanzar dos tipos de tarea:

  • desarrollo: conversión de pandoc, movimiento de assets y servidor web
  • producción: conversión de pandoc, optimización de archivos y push en GitHub.

Gracias por su atención

Me encontrarás en