{"id":28294886,"url":"https://github.com/adonyssantos/firebase-basics","last_synced_at":"2026-04-05T23:32:18.719Z","repository":{"id":128718593,"uuid":"366254253","full_name":"adonyssantos/firebase-basics","owner":"adonyssantos","description":"🗂️ Mi primer proyecto con Firebase","archived":false,"fork":false,"pushed_at":"2021-06-07T19:26:13.000Z","size":284,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-01-03T18:45:45.836Z","etag":null,"topics":["babel","firebase","firebase-database","nodejs","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/adonyssantos.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2021-05-11T04:25:48.000Z","updated_at":"2024-06-02T03:01:53.000Z","dependencies_parsed_at":"2023-06-05T03:45:28.542Z","dependency_job_id":null,"html_url":"https://github.com/adonyssantos/firebase-basics","commit_stats":null,"previous_names":["adonyssantos/firebase-basics"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/adonyssantos/firebase-basics","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adonyssantos%2Ffirebase-basics","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adonyssantos%2Ffirebase-basics/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adonyssantos%2Ffirebase-basics/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adonyssantos%2Ffirebase-basics/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/adonyssantos","download_url":"https://codeload.github.com/adonyssantos/firebase-basics/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adonyssantos%2Ffirebase-basics/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31454197,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-05T21:22:52.476Z","status":"ssl_error","status_checked_at":"2026-04-05T21:22:51.943Z","response_time":75,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["babel","firebase","firebase-database","nodejs","webpack"],"created_at":"2025-05-22T11:18:38.205Z","updated_at":"2026-04-05T23:32:18.675Z","avatar_url":"https://github.com/adonyssantos.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Firestore para SQL Developers\n\nEste proyecto es del curso en [YouTube](https://www.youtube.com/playlist?list=PLCKuOXG0bPi29EkcAuVCln9ISbExcQk66) de Fernado Herrera.\n\n**API Documentation** [https://googleapis.dev/nodejs/firestore/latest/CollectionReference.html](https://googleapis.dev/nodejs/firestore/latest/CollectionReference.html)\n\n## Scripts:\n\nRecuerden reconstruir los módulos de Node\n\n```\nnpm install\n```\n\nY para construir el build, recueren:\n\n```\nnpm run build\n```\n\n# Resumen\n\n## Conexión a Firebase\n\nPara conectar Firebase con nuestra Aplicación Web debemos de crear una App en la configuración de proyecto de Firebase.\n\nHay varias formas de conectar nuestro proyecto con Firebase, la que usamos en este caso fue con un archivo `/config/firebase.ts` para almacenar la configuracion de Firebase.\n\n```ts\nimport firebase from \"firebase/app\";\nimport \"firebase/firestore\";\n\nconst firebaseConfig = {\n  apiKey: \"AIzaSyCELZUvvnBQsxYfCb9Bl-p8QB3uQKuUWJc\",\n  authDomain: \"first-firebase-4cd37.firebaseapp.com\",\n  projectId: \"first-firebase-4cd37\",\n  storageBucket: \"first-firebase-4cd37.appspot.com\",\n  messagingSenderId: \"116369059692\",\n  appId: \"1:116369059692:web:adb10ff3f756c51a520d49\",\n  measurementId: \"G-6D5B5Q5L10\",\n};\n\nfirebase.initializeApp(firebaseConfig);\n\nexport default firebase.firestore();\n```\n\n_En este caso las variables estan publica porque eliminare este proyecto una vez termiine el curso, pero la forma correcta de hacer esto es utilizando Variables de entorno, ya que estos datos son muy sensibles y cualquier persona con esto datos podria modificar nuestra BD._\n\nAhora debemops importar nuestra configuracion a nuestro archivo principal:\n\n```ts\nimport \"./config/firebase\";\n```\n\nEn este caso agregamos `firebase.firestore()` dentro de una variable para poderla reutilizar.\n\n```ts\nconst db = firebase.firestore();\n\nexport default db;\n```\n\n## Insertar datos en una colección\n\nPodemos relacionar **colección** de Firebase con una Tabla de SQL. Esto no es correcto pero para entenderlo mejor.\n\n**Nota:** _Para insertar datos debemos enviarle un objecto literal/sencillo. No podemos pasarle funciones, por ejemplo._\n\n```ts\nimport db from \"./config/firebase\";\n\nconst user = {\n  name: \"Adonys\",\n  age: 17,\n  title: \"Frontend Developer\",\n  student: true,\n};\n\n// Insertar datos en una colección\ndb.collection(\"users\")\n  .add(user)\n  .then((docRef) =\u003e {\n    console.log(docRef);\n  })\n  .catch((error) =\u003e console.log(\"error\", error));\n```\n\n## Actualizar datos de una colección\n\n### Referencia a una colección\n\nSi vamos a reutilizar una colección podemos almacenarla en una variable:\n\n```ts\n// Referencia a la colección users\nconst usersRef = db.collection(\"users\");\n```\n\nDe esta forma no tenemos que llamar la misma colección varias veces.\n\n```ts\nusersRef.add({...})\n```\n\nNo existen un metodo `update` para la referencia de una colección, por lo que hay que llamarla por el `id`.\n\n```ts\n// Referencia a la colección users\nconst usersRef = db.collection(\"users\");\n\n// Actualizar datos de una colección\nusersRef.doc(\"SdFvvlTZsiHs9KrNnEre\").update({ student: true });\n\n// También podemos utilizar .set, pero es una forma destructiva, lo que quiere decir que borrara los otros datos\nusersRef.doc(\"SdFvvlTZsiHs9KrNnEre\").set({ student: true });\n```\n\n_Se recomienda utilizar `then` y `catch` para evitar errores._\n\n## Borrar datos de una colección\n\nPara borrar datos de una colección se hace de la misma forma que con [update](#actualizar-datos-de-una-colección), se le pasa la referencia a la colección, el id del cocumento que se desea borrar y el metodo `.delete()`.\n\n```ts\n// Borrar datos de una colección\nusersRef\n  .doc(\"SdFvvlTZsiHs9KrNnEre\")\n  .delete()\n  .then(() =\u003e console.log(\"Borrado\"))\n  .catch((error) =\u003e console.log(error));\n```\n\n_Utilizar `then` y `catch` no es necesario pero ayuda a evitar errores._\n\n## Obtener datos de una colección\n\n### Utilizando `onSnapshot`\n\n**onSnapshot** es un callback que se va a ejecutar cada vez que la informacion cambie dentro de la Base de Datos.\n\n```ts\n// Obtener datos de una colección\nusersRef.onSnapshot((snap) =\u003e {\n  const users: any[] = [];\n\n  snap.forEach((childSnap) =\u003e {\n    users.push({\n      id: childSnap.id,\n      ...childSnap.data(),\n    });\n  });\n  console.log(users);\n});\n```\n\n### Optimizando el código\n\nComo el bloque de código para obtener los datos de una colección lo vamos a utilizar varias veces, podemos separarlo como una `función/helpers` así solo tenemos que hacer referencia a esa función para obtener los datos.\n\n### Utilizando `get`\n\n**get** obtiene la información una sola vez cuando se ejecuta el código.\n\n```ts\n// Obtener datos de una colección con get\nusersRef.get().then(showDocs);\n```\n\n### Indices y clausula `where`\n\nPodemos utilizar el metodo `where` para crear condicionales en nuestras consultas. Tanto para consultas `simple` como para consultas `compuestas`.\n\n**Consulta simple:** son todas aquellas que utilizan un solo campo para realizar la consulta.\n\n**Consulta compuestas:** son todas aquellas que utilizan dos o más campos para realizar la consulta.\n\n#### Consultas simple\n\n```ts\n// Obtener datos de una colección con condicionales\n\n// Obtiene la data if student === true\nusersRef.where(\"student\", \"==\", true).get().then(showDocs);\n\n// Obtiene la data if salary \u003e= 1800\nusersRef.where(\"salary\", \"\u003e=\", 1800).get().then(showDocs);\n\n// Obtiene la data if salary \u003e= 1800 \u0026\u0026 salary \u003c= 2800\nusersRef\n  .where(\"salary\", \"\u003e=\", 1800)\n  .where(\"salary\", \"\u003c=\", 2800)\n  .get()\n  .then(showDocs);\n```\n\n#### Consulta compuestas\n\n```ts\n// Obtiene la data if salary \u003e= 500 \u0026\u0026 student == true\nusersRef\n  .where(\"salary\", \"\u003e=\", 500)\n  .where(\"student\", \"==\", true)\n  .get()\n  .then(showDocs); // Esto es un query compuesto por lo que hay que crear un índice\n```\n\nPara crear el índice existen dos formas:\n\n**Manual:** dentro de `Cloud Firestore` vamos a `Index` y podemos agregar el nombre y cada uno de los campos que necesitamos para nuestra consulta.\n\n**Automatica:** al ejecutar nuestro código nos muetra un error por la consola donde hay un link. Solo tenemos que darle click al link y darle a `Create Index`.\n\n\n## orderBy\n\n```ts\n// Obtener datos de una colección con orderBy\n\n// Ordena por nombre por defecto de forma ascendente\nusersRef.orderBy(\"name\").get().then(showDocs);\n\n// Ordena por salario por defecto de forma ascendente\nusersRef.orderBy(\"salary\").get().then(showDocs); // orderBy aplica un where de forma interna por lo que si algun documento en la BD no tiene el campo salary no saldra en la consulta\n\n// Ordena por salario de forma descendente\nusersRef.orderBy(\"salary\", \"desc\").get().then(showDocs); // orderBy aplica un where de forma interna por lo que si algun documento en la BD no tiene el campo salary no saldra en la consulta\n\n// Ordena por salario de forma descendente y despues por nombre\nusersRef\n  .orderBy(\"salary\", \"desc\")\n  .orderBy('name')\n  .get()\n  .then(showDocs); //En este caso tambien hay que crear un índice\n\n```\n\n## Limit y Paginación\n\n### Limit\n\n```ts\n// Limit \n\n// Obtiene los 2 primeros documentos de la colección users\nusersRef.limit(2).get().then(showDocs);\n\n// Obtiene los 5 primeros documentos de la colección users\nusersRef.limit(5).get().then(showDocs);\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadonyssantos%2Ffirebase-basics","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadonyssantos%2Ffirebase-basics","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadonyssantos%2Ffirebase-basics/lists"}