How to create a chrome extension

Step: Use a great boilerplate template

  • this react vite one has been incredible! (github)

Step: Copy the repo, change the details and you are set up!

Step: Learn the different parts files in the “pages” directory

  • content: stuff you want to add to the dom
  • devtools: devtools tab
  • newtab: command+n new tab screen
  • options: right click menu has options
  • panel: the actual devtools panel
  • popup: This is clicking on the extension bar icon

content: stuff you want to add to the dom

devtools: devtools tab AND panel: the actual devtools panel

newtab: command+n new tab screen

options: right click menu has options

popup: This is clicking on the extension bar icon