- Initialize with package.json
npm init -y
- Install webpack and webpack cli
npm i webpack webpack-cli -D
- Configure webpack in webpack.config.js at root
- Run webpack to do bundling (Create custom script in package.json for build)
- Run using
npm run build
(it runswebpack
on backend) - Connect index.html with bundle.js
- Preview in the browser for the output of the index.js
- Create firebase project on firebase console
- Get config and paste in index.js
- Install firebase
npm i firebase
- Initialize firebase app using the config
- Setup database
- Add collection and documents to database
- Fetch data from database into the console
-
Create form in index.html for adding doc
-
Add database adding logic
-
Add documents
-
Create form in index.html for deleting doc
-
Add database delete logic
-
Delete Docs
- Change function from getDocs to onSnapshot
- Write the logic
- Change collection ref to query ref
- order data by some field
- Create timestamps
- order by timestamp
- Make doc ref
- get doc
- Subscribing to a document
- Get Reference
- Update doc
-
Go to firebase-console then Authentication
-
Click Get Started
-
Click email/password
-
Click enable switch
-
Click save
-
setup auth
- Create signup form
- Attack event listener
- Create login form and logout button
- Setup event listeners
- Call logout function
- Call login function
- onAuthStateChanged setup
- unsub