Cuando empecé con la idea feliz de migrar todo lo que tenía en el servidor y pasar a una vida nueva sin él, una de las cosas que me preocupaba era qué iba a pasar con mis presentaciones. En el servidor, monté en su día un directorio /talks en el que iba colocando cada una de las presentaciones de las charlas que daba en eventos. Era una forma fácil de tenerlas localizadas y accesibles para compartir si lo necesitaba.
Las presentaciones estaban hechas con Reveal JS, sí, en código. Me resultaba cómodo hacerlas y tampoco me complicaba mucho más. Se ejecutaban desde el navegador y SIEMPRE funcionaban/funcionan bien.
Llegó la pandemia, las charlas se paralizaron y las presentaciones se quedaron ahí.
Después de mucho tiempo, decidí moverlo todo a una solución mejor, sin servidor y las presentaciones las he tenido que migrar también, aunque más tarde. Este post, es para explicar el proceso de migración, de servir las presentaciones desde un subdominio propio dentro de tu servidor, a servirlas desde el plan gratuito de Firebase.
Partiendo de que ya conocemos Reveal JS, entiendo también que tenemos node instalado en nuestro equipo (para ejecutar localmente las presentaciones). El tutorial va a ser de cómo ejecutar una versión propia de Reveal JS en Firebase, una vez terminado, solamente tendréis que mover físicamente vuestras presentaciones a la ubicación correcta y re-desplegar.
- Descargar / Clonar Reveal JS desde su repositorio oficial:
git clone https://github.com/hakimel/reveal.js.git - Nos colocamos dentro e instalamos las dependencias:
cd reveal.js && npm install - Lanzamos nuestra aplicación:
npm start - Abrimos el navegador en http://localhost:3000/ y podremos ver Reveal JS corriendo localmente.
Con estos sencillos pasos, ya tenemos una copia de Reveal JS corriendo en nuestro equipo, pero estas presentaciones, no están disponibles para el resto de usuarios, para eso tenemos que publicarlas. Veamos cómo hacerlo:
- Instalamos en nuestro equipo Firebase CLI para poder jugar con Firebase desde la consola:
npm install -g firebase-tools - El siguiente paso es ir a la consola de Firebase y crear un nuevo proyecto siguiendo los pasos del propio Firebase. En uno de los pasos, nos ofrecerá habilitar la opción de GA, personalmente no lo he activado, pero en vuestra mano queda.
- Volvemos a la consola y debemos mover todo el contenido de nuestro repositorio dentro de una carpeta que tendremos que crear con el nombre
/Publicen la raíz de nuestro proyecto. - Iniciamos Firebase desde nuestra consola:
firebase init - Seleccionamos la opción de Hosting.
- Elegimos el proyecto creado anteriormente.
(podríamos crearlo desde aquí) - Aceptamos que use el directorio público (de ahí viene la creación de la carpeta Public).
- Respondemos NO a todas las preguntas.
Ya tenemos la configuración creada, ahora solo nos queda realizar el despliegue que se realiza con el siguiente comando firebase deploy
Si todo ha ido bien, podremos visitar ya online nuestra presentación usando la URL que os habrá generado automáticamente Firebase (se puede consultar desde la consola de Firebase).
Con esta migración, tendremos nuestras presentaciones disponibles de la misma manera, gratuitamente y seguiremos sin tener un servidor para ello.
Y hasta aquí llega mi post sobre cómo montar una versión de Reveal JS en Firebase. Espero que os haya resultado interesante, si es así, compartidlo, si tenéis alguna duda dejadme un comentario y os responderé lo antes posible. Recordad también que podéis suscribiros y recibir en vuestro correo electrónico cada post para no perderos nada.
Un saludo,