Para poder suportar dados dinâmicos em seu site, adicionamos suporte para integrar o Firebase. Isso permitirá que você use o recurso de visualizações em listas e posts.
- Vá para o site do Firebase e crie uma conta gratuitamente
- Crie um novo projeto
- Selecione a localização do analytics
- Configure o Firebase no Blowfish obtendo as variáveis do seu projeto e configurando-as no arquivo
params.toml. Mais detalhes podem ser encontrados nesta página. Você pode encontrar um exemplo do arquivo que o Firebase fornecerá abaixo, observe os parâmetros dentro do objeto FirebaseConfig.
// 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: "AIzaSyB5tqlqDky77Vb4Tc4apiHV4hRZI18KGiY",
authDomain: "blowfish-21fff.firebaseapp.com",
projectId: "blowfish-21fff",
storageBucket: "blowfish-21fff.appspot.com",
messagingSenderId: "60108104191",
appId: "1:60108104191:web:039842ebe1370698b487ca",
measurementId: "G-PEDMYR1V0K"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);- Configurar Firestore - Selecione Build e abra Firestore. Crie um novo banco de dados e escolha iniciar no modo produção. Selecione a localização do servidor e aguarde. Uma vez iniciado, você precisa configurar as regras. Basta copiar e colar o arquivo abaixo e pressionar publicar. Essas regras garantem que as visualizações só podem ser incrementadas em 1, e as curtidas só podem ser alteradas em +1 ou -1 (e nunca abaixo de 0).
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
// Views - read anyone, only increment by 1
match /views/{document} {
allow read: if request.auth != null;
allow create: if request.auth != null
&& request.resource.data.keys().hasOnly(['views'])
&& request.resource.data.views == 1;
allow update: if request.auth != null
&& request.resource.data.diff(resource.data).affectedKeys().hasOnly(['views'])
&& request.resource.data.views == resource.data.views + 1;
}
// Likes - read anyone, only +1 or -1
match /likes/{document} {
allow read: if request.auth != null;
allow create: if request.auth != null
&& request.resource.data.keys().hasOnly(['likes'])
&& request.resource.data.likes == 1;
allow update: if request.auth != null
&& request.resource.data.diff(resource.data).affectedKeys().hasOnly(['likes'])
&& (request.resource.data.likes == resource.data.likes + 1
|| request.resource.data.likes == resource.data.likes - 1)
&& request.resource.data.likes >= 0;
}
// Deny everything else
match /{document=**} {
allow read, write: if false;
}
}
}- Habilitar autorização anônima - Selecione Build e abra Authentication. Selecione começar, clique em Anônimo e ative, salve.
- Aproveite - agora você pode ativar visualizações e curtidas no Blowfish para todos (ou específicos) artigos.
