Cloud Firestore

Projeto Firebase

$ npm install firebase
$ npm install firebase
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
 
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "...",
  authDomain: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "...",
  measurementId: "...",
};
 
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
 
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "...",
  authDomain: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "...",
  measurementId: "...",
};
 
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

Invest-app (CRUD)

Código Fonte

Arquivos
invest-app
├── css
│   └── style.css
├── index.html
├── js
│   ├── components
│   │   ├── InvestmentCard.js
│   │   ├── InvestmentForm.js
│   │   └── Modal.js
│   ├── lib
│   │   ├── dom.js
│   │   ├── format.js
│   │   └── investments.js
│   ├── main.js
│   └── services
│       ├── api.js
│       └── storage.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
│   └── vite.svg
└── tailwind.config.js
Arquivos
invest-app
├── css
│   └── style.css
├── index.html
├── js
│   ├── components
│   │   ├── InvestmentCard.js
│   │   ├── InvestmentForm.js
│   │   └── Modal.js
│   ├── lib
│   │   ├── dom.js
│   │   ├── format.js
│   │   └── investments.js
│   ├── main.js
│   └── services
│       ├── api.js
│       └── storage.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
│   └── vite.svg
└── tailwind.config.js

Firebase - Firestore - Initialize Cloud Firestore

/codes/package/firebase-firestore/invest-app/.env.example
VITE_APP_APIKEY=
VITE_APP_AUTHDOAMIN=
VITE_APP_PROJECTID=
VITE_APP_STORAGEBUCKET=
VITE_APP_MESSAGINGSENDERID=
VITE_APP_APPID=
VITE_APP_MEASUREMENTID=
/codes/package/firebase-firestore/invest-app/.env.example
VITE_APP_APIKEY=
VITE_APP_AUTHDOAMIN=
VITE_APP_PROJECTID=
VITE_APP_STORAGEBUCKET=
VITE_APP_MESSAGINGSENDERID=
VITE_APP_APPID=
VITE_APP_MEASUREMENTID=
/codes/package/firebase-firestore/invest-app/js/services/api.js
import { initializeApp } from 'firebase/app';
import { getFirestore } from 'firebase/firestore';
 
const firebaseConfig = {
  apiKey: import.meta.env.VITE_APP_APIKEY,
  authDomain: import.meta.env.VITE_APP_AUTHDOAMIN,
  projectId: import.meta.env.VITE_APP_PROJECTID,
  storageBucket: import.meta.env.VITE_APP_STORAGEBUCKET,
  messagingSenderId: import.meta.env.VITE_APP_MESSAGINGSENDERID,
  appId: import.meta.env.VITE_APP_APPID,
  measurementId: import.meta.env.VITE_APP_MEASUREMENTID,
};
 
const app = initializeApp(firebaseConfig);
 
export const db = getFirestore(app);
/codes/package/firebase-firestore/invest-app/js/services/api.js
import { initializeApp } from 'firebase/app';
import { getFirestore } from 'firebase/firestore';
 
const firebaseConfig = {
  apiKey: import.meta.env.VITE_APP_APIKEY,
  authDomain: import.meta.env.VITE_APP_AUTHDOAMIN,
  projectId: import.meta.env.VITE_APP_PROJECTID,
  storageBucket: import.meta.env.VITE_APP_STORAGEBUCKET,
  messagingSenderId: import.meta.env.VITE_APP_MESSAGINGSENDERID,
  appId: import.meta.env.VITE_APP_APPID,
  measurementId: import.meta.env.VITE_APP_MEASUREMENTID,
};
 
const app = initializeApp(firebaseConfig);
 
export const db = getFirestore(app);
/codes/package/firebase-firestore/invest-app/js/services/storage.js
import {
  addDoc,
  collection,
  deleteDoc,
  doc,
  getDocs,
  query,
  updateDoc,
  where,
} from 'firebase/firestore';
import { db } from './api.js';
 
async function create(resource, data) {}
async function read(resource, filter, value) {}
async function update(resource, data) {}
async function remove(resource, id) {}
 
export default { create, read, update, remove };
/codes/package/firebase-firestore/invest-app/js/services/storage.js
import {
  addDoc,
  collection,
  deleteDoc,
  doc,
  getDocs,
  query,
  updateDoc,
  where,
} from 'firebase/firestore';
import { db } from './api.js';
 
async function create(resource, data) {}
async function read(resource, filter, value) {}
async function update(resource, data) {}
async function remove(resource, id) {}
 
export default { create, read, update, remove };

Create a investment

Firebase - Firestore - Add a document

/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function create(resource, data) {
  data.created_at = new Date(data.created_at);
 
  const colRef = collection(db, resource);
 
  const docRef = await addDoc(colRef, data);
 
  return { ...data, id: docRef.id };
}
/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function create(resource, data) {
  data.created_at = new Date(data.created_at);
 
  const colRef = collection(db, resource);
 
  const docRef = await addDoc(colRef, data);
 
  return { ...data, id: docRef.id };
}
import API from './services/storage.js';
 
const investment = {
  name: "Tesouro Selic 2029",
  value: 10000,
  origin: "Tesouro Direto",
  category: "Pós",
  interest: "100% Selic",
  created_at: "2021-09-10T00:00:00-03:00",
};
 
API.create('investments', investment);
import API from './services/storage.js';
 
const investment = {
  name: "Tesouro Selic 2029",
  value: 10000,
  origin: "Tesouro Direto",
  category: "Pós",
  interest: "100% Selic",
  created_at: "2021-09-10T00:00:00-03:00",
};
 
API.create('investments', investment);

Read investments

Firebase - Firestore - Get a document

/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function read(resource, filter, value) {
  const data = [];
 
  const colRef = collection(db, resource);
 
  let docs;
 
  if (filter && value) {
    const q = query(colRef, where(filter, '==', value));
 
    docs = await getDocs(q);
  } else {
    docs = await getDocs(colRef);
  }
 
  docs.forEach((docRef) => data.push({ ...docRef.data(), id: docRef.id }));
 
  return data;
}
/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function read(resource, filter, value) {
  const data = [];
 
  const colRef = collection(db, resource);
 
  let docs;
 
  if (filter && value) {
    const q = query(colRef, where(filter, '==', value));
 
    docs = await getDocs(q);
  } else {
    docs = await getDocs(colRef);
  }
 
  docs.forEach((docRef) => data.push({ ...docRef.data(), id: docRef.id }));
 
  return data;
}
import API from './services/storage.js';
 
API.read('investments');
API.read('investments', 'id', 1);
import API from './services/storage.js';
 
API.read('investments');
API.read('investments', 'id', 1);

Update a investment

Firebase - Firestore - Update a document

/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function update(resource, data) {
  data.created_at = new Date(data.created_at);
 
  const docRef = doc(db, resource, data.id);
 
  await updateDoc(docRef, data);
 
  return data;
}
/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function update(resource, data) {
  data.created_at = new Date(data.created_at);
 
  const docRef = doc(db, resource, data.id);
 
  await updateDoc(docRef, data);
 
  return data;
}
import API from './services/storage.js';
 
API.update('investments', { id: 1, value: 15000 });
import API from './services/storage.js';
 
API.update('investments', { id: 1, value: 15000 });

Delete a investment

Firebase - Firestore - Delete a document

/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function remove(resource, id) {
  const docRef = doc(db, resource, id);
 
  return await deleteDoc(docRef);
}
/codes/package/firebase-firestore/invest-app/js/services/storage.js
async function remove(resource, id) {
  const docRef = doc(db, resource, id);
 
  return await deleteDoc(docRef);
}
import API from './services/storage.js';
 
API.remove('investments', 1);
import API from './services/storage.js';
 
API.remove('investments', 1);

Editar esta página