Como Publicar una Página Web en Firebase Hosting – Parte 2 (Final)

6 minuto(s)

Demo

En el capitulo anterior Como Publicar una Página Web en Firebase Hosting – Parte 1 hicimos una introducción sobre que es Firebase Hosting, creamos un proyecto nuevo en Firebase y realizamos los primeros pasos para publicar la página web en Firebase Hosting, en esta Parte 2 y última terminaremos de configurar Firebase Hosting y publicaremos la página web. 

Partes

Antes de continuar te invito a escuchar el Podcast: “Dominio del trabajo con Varios Lenguajes de Programación”:

Spotify SoundCloud

Bien ahora continuemos con el Post: Como Publicar una Página Web en Firebase Hosting – Parte 2 (Final). 

Luego que en la Parte 1 iniciamos sesión con la cuenta de gmail con la cual creamos el proyecto en Firebase, ahora vamos a ejecutar el siguiente comando para comenzar a publicar la página web en Firebase Hosting, me preguntará si deseo continuar y le digo que yes (si).


Me pregunta que servicio de Firebase es el que voy a usar, me muevo con la fecha del teclado hacia abajo y selecciono con la barra espaciadora (spacebar) la opción Hosting: Configure and deploy Firebase Hosting sites y preiono la tecla ENTER para confirmar la selección.


Luego elijo la opción que dice Use an existing project (Usar un proyecto existente) y presiono ENTER


Selecciono el nombre de mi proyecto, el proyecto que yo he creado se llama mi Proyecto, entonces lo selecciono y pulso ENTER para continuar.


Para mantener un orden, Firebase Hosting nos menciona que podemos hacer uso de un directorio llamado public para subir los archivos de la página web, no muevo nada, solo presiono ENTER para continuar y luego me pregunta si quiero reescribir todas las urls para que apunten al archivo index.html, le digo que yes (si) y presiono ENTER para continuar.


Firebase CLI nos dice que la inicialización ha sido completada.


Con estos pasos que he realizado, Firebase CLI me ha creado en la ubicación en donde ejecute los comandos anteriores, un directorio public y unos archivos indispensables para poder subir mi página web a Firebase Hosting.


Para verificar que la carpeta publica ha sido configurada como la carpeta para alojar los archivos de mi página web, abro el archivo firebase.json y debería tener la siguiente estructura.


Ahora voy publicar mi página web en el directorio public, yo usaré los archivos del tutorial Diseña Tu  Primera Página Web con Bootstrap 4, me bajo el código del repositorio GitHub y lo coloco en la carpeta public.


Entonces con esto debemos recordar que todos los archivos de una página web se deben de colocar en la carpeta public, para que el Hosting de Firebase pueda publicarlos sin problemas.

Antes de subir los archivos a Firebase Hosting, puedo ver una vista previa del sitio web en mi computadora, ejecutando el siguiente comando.


Voy al navegador y escribo localhost:5000 y puedo ver una vista previa de mi página web, si hay algo que corregir, es un buen momento para hacerlo, pero no te preocupes, igual podemos actualizar los cambios en Firebase Hosting más adelante.

Bien mi sitio web esta ok, entonces voy a pasar a publicarlo en Firebase Hosting, para esto ejecuto el siguiente comando.


Y me sale que el Deploy o Despliegue ha sido completado, ahora para ver el resultado de mi página web, accedemos al Hosting URL que Firebase Hosting nos crea automáticamente, puedes ver al final en la consola que me aparece el Hosting URL, solo lo copia y lo pego en el navegador y debería de ver mi página web publicada en Firebase Hosting.

Eso es todo, al inicio de este tutorial he colocado una Demo para ver la página web alojada en Firebase Hosting.

Conclusión

Hemos aprendido a publicar un sitio web en Firebase Hosting, personalmente pienso que es un buen hosting, pertenece a Google y es una garantía importante para pensar que nuestro proyecto alojado en este servicio va ir muy bien. 

Nota

  • Los pasos mencionadas en este Post pueden ser modificados, eliminados o continuar en el futuro, esto no depende de mi, si no de los Desarrolladores que dan soporte a Firebase.
  • No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo. 

 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.