In previous version of manifest which was manifest version 2, it was allowed to pull scripts from external sources which is we could make use of CDN links but now in manifest version 3 we can no longer do that for security reasons. Since firebase provides us an SDK CDN to use, we can’t make use of it in chrome extension MV3. I found out 2 ways to do it, one is to download older version of SDK or to make and API.
In this video, I have shown you how to create an API, host it, and then use it in our chrome extension to integrate firestore database. Hope you will like this video.
This is part 6 of my chrome extensions playlist.
šChrome extension docs: https://developer.chrome.com/docs/extensions/mv3/intro/
šFirebase API docs: https://firebase.google.com/docs/reference/admin/node
šHeroku CLI: https://devcenter.heroku.com/articles/heroku-cli
šChrome extensions Playlist: https://www.youtube.com/watch?v=DtCUq9_Uyj4&list=PLXT4oy8Eb6MoOmOEcFyvbbJ-DHeduDdwl
šAdvanced concepts of chrome extension: https://youtu.be/tOHpufRbsJc
š Timestamps: š
00:00 Introduction.
01:59 Setting up API & Firebase.
06:56 Completing & testing API.
09:53 Deploying API on Heroku.
15:29 Creating chrome extension.
19:37 Final testing.
ā Topics covered: ā
1) Node.js API development using firebase-admin module.
2) Node.js API deployment on heroku.
3) Using Heroku CLI.
4) Fetching data from API in extension.
ā Commands : ā
1) To create API:
ā¢ npm init -y
ā¢ npm i express cors firebase-admin
ā¢ create index.js
2) Host API on heroku:
ā¢ heroku -v
ā¢ heroku login
ā¢ git init
ā¢ create .gitignore & Procfile
ā¢ heroku create
ā¢ git add.
ā¢ git commit -m “Adding files”
ā¢ git push heroku master
For any queries, Feel free to connect with me on
āŗE-mail id – atharvvarshney07@gmail.com
āŗLinked in – https://www.linkedin.com/in/atharv-varshney/
āŗTwitter – https://twitter.com/Atharvvarshney7
Music used in this video :
Pixel Pig by Di Young: https://youtu.be/TiC7_167hQ0
source
