Vue Firebase setup
Presentación
Firebase Auth
Cloud Firestore
Cloud Storage
Cloud Functions
Curso Firebase para Web se encuentra en desarrollo. Vuelve pronto para encontrar nuevas lecciones.
- Si examinas el código de inicio (accesible en la lección anterior) verás que es poco más que una instalación de VueCLI con algunos ajustes para eliminar componentes y recursos que no necesitamos.
- Aunque no soy muy fan de los frameworks CSS, sí que lo soy de Bulma, por su sencillez y modularidad. Si nunca lo has utilizado no te preocupes, te explicaré lo esencial a medida que lo vayamos utilizando.
- He instalado Bulma a través de su módulo de Node, importado a través nuestro propio documento SASS y luego requerido en
main.js
. Desde aquí lo tenemos disponible de forma global. - Ahora tenemos que añadir Firebase a nuestro proyecto Vue. Lo primero es debes hacer es acceder a la consola de Firebase con tu cuenta Google, para crear un proyecto, tal como se indica en la documentación
- Ahora, tenemos que añadir el SDK JavaScript de Firebase a nuestro proyecto, a través de NPM con
npm install --save firebase
. - Una vez listo crearemos
firebase.js
para inicializar sólo lo que nos interesa (generando un bundle más pequeño). En nuestro caso y en este momento será Firestore, Auth y Storage, utilizando los datos de configuración de nuestro proyecto. - Para comprobar que todo funciona, vamos a hacer una prueba requiriendo
firebase.js
desde nuestro punto de entradamain.js
. - Ya tenemos Firebase listo para utilizar 🔥.
Código inicial
¿Tienes alguna pregunta sobre esta lección de Curso Firebase para Web?
Resuelve todas tus dudas sobre Firebase en la Comunidad de Escuela Vue: un lugar donde participar, aprender y ayudar. ¡Te esperamos!.
Tras el registro (si no lo has hecho ya) serás redirigido/a al canal adecuado en la Comunidad.