Links

📚 La documentation WebExtensions

🐙 WebExtension polyfill

🚀 WebExtension Starter & ViteJS

🎅 WebExtension Examples

📗 Les slides du Tools in Action

Build the extension

• npm i
• npm run dev (Watch mode, One min = One sec)
• npm run build(Prod build, One min = One min)

Goal of this TIA

• Discover Dev Experience when creating an extension
• Discover the joy of X-Browser spec.
• Discover the browser API, exposed by WebExtensions.
• Create a tiny Pomodoro App.

First step - Hello world

• Minimal extension structure
• Discover Manifest
• Discover first API : Browser action (We add a handler when we click on the button).
• Hello World in the console !
• Installation in Chrome / Firefox / Edge ...
• Demo of how we manage dev and tests in the Browser.