- A simple gallery app using Firebase hosting and Firebase snapshots
-
Practicing the Next JS framework
-
Better understand firebase
-
Practice Bootstrap
-
Learning how to make custom hooks
- Check out the demo here: https://forest-firegram.web.app/
-
Fork this repo: https://github.com/foresthpark/firebase_gallery
-
Head over to https://firebase.google.com/ and create a project
-
Follow instructions to create a Firebase config file at "~/firebase/config.js" and add the following:
import * as firebase from 'firebase/app'
import 'firebase/storage'
import 'firebase/firestore'
// Your web app's Firebase configuration
let firebaseConfig = {
apiKey: "YOUR_API_KEY",
authDomain: "YOUR_AUTH_DOMAIN",
databaseURL: "YOUR_DATABASE_URL",
projectId: "YOUR_PROJECTID",
storageBucket: "YOUR_STORAGE_BUCKET",
messagingSenderId: "YOUR_MESSAGE_SENDER_ID",
appId: "YOUR_APP_ID"
};
// Initialize Firebase
if (!firebase.apps.length) {
firebase.initializeApp(firebaseConfig);
}
const projectStorage = firebase.storage();
const projectFireStore = firebase.firestore();
const timeStamp = firebase.firestore.FieldValue.serverTimestamp();
export { projectFireStore, projectStorage, timeStamp };
- Install npm packages
npm i
npm run dev