docs(examples): update firebase example to use .env

examples/firebase/.env

@@ -0,0 +1,14 @@
+## ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+# Firebase Config.
+#
+# 1. Create firestore database.
+# 2. Set the `firebaseConfig` variable.
+#
+# @see https://firebase.google.com/docs/firestore/quickstart#create
+## ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+VITE_FIREBASE_API_KEY=
+VITE_FIREBASE_AUTH_DOMAIN=
+VITE_FIREBASE_PROJECT_ID=
+VITE_FIREBASE_STORAGE_BUCKET=
+VITE_FIREBASE_MESSAGING_SENDER_ID=
+VITE_FIREBASE_APP_ID=

examples/firebase/README.md

@@ -1,6 +1,24 @@
 # Example
 
-```
-npm install --ignore-scripts
-npm run dev
-```
+1. Create firestore database as per [docs](https://firebase.google.com/docs/firestore/quickstart#create).
+1. Set environment variables:
+
+   ```sh
+   # Copy the template .env file to local .env file
+   cp .env .env.local
+   # Edit .env.local with firebase config.
+   ```
+
+1. Install dependencies (ideally in project root):
+
+   ```sh
+   npm install
+   ```
+
+   > If you are running the command directly in the `examples/firebase` directory, use ` --ignore-scripts`.
+
+1. Run local dev server:
+
+   ```sh
+   npm run dev
+   ```

examples/firebase/package.json

@@ -1,6 +1,9 @@
 {
   "name": "react-query-subscription-firebase-example",
   "private": true,
+  "engines": {
+    "npm": ">=8"
+  },
   "version": "0.0.0",
   "scripts": {
     "dev": "vite",

examples/firebase/src/firebase.ts

@@ -11,10 +11,15 @@ import { getFirestore } from 'firebase/firestore';
  * @see https://firebase.google.com/docs/firestore/quickstart#create
  */
 const firebaseConfig = {
-  // add config here
+  apiKey: import.meta.env.VITE_FIREBASE_API_KEY,
+  authDomain: import.meta.env.VITE_FIREBASE_AUTH_DOMAIN,
+  projectId: import.meta.env.VITE_FIREBASE_PROJECT_ID,
+  storageBucket: import.meta.env.VITE_FIREBASE_STORAGE_BUCKET,
+  messagingSenderId: import.meta.env.VITE_FIREBASE_MESSAGING_SENDER_ID,
+  appId: import.meta.env.VITE_FIREBASE_APP_ID,
 };
-if (Object.keys(firebaseConfig).length === 0) {
-  throw new Error('Configure firebase in `src/firebase.ts`');
+if (Object.values(firebaseConfig).filter(Boolean).length === 0) {
+  throw new Error('Configure env variables in .env.local`');
 }
 
 export const firebaseApp = initializeApp(firebaseConfig);