Filter/Tag
12 entries
Package and upload to the Chrome Web Store, pass review, version and auto-update, port to Firefox and Edge, and build a capstone "Reading Ruler" extension that ties the whole series together. With an interactive ship checklist.
Why plain files stop scaling, and how to set up a modern extension project with Vite, CRXJS, TypeScript and React — HMR, bundling, npm packages, and a typed manifest. With an interactive build-pipeline visualizer.
tabs, scripting, contextMenus, commands (keyboard shortcuts) and notifications — the toolkit that turns a toy into a real product. With an interactive API explorer.
The permission model: activeTab, optional permissions and runtime requests, host permissions, the content security policy, and how to write an extension that users install and reviewers trust. With an interactive permissions inspector.
The popup, options page, side panel, and the toolbar action (badge, icon, title): choosing the right surface, wiring each to storage, and the action API for ambient status. With an interactive mock browser.
chrome.storage in depth: local vs sync vs session, quotas and item limits, the onChanged event for reactive UIs, storage as the single source of truth, and migrating data shapes between versions. With an interactive storage explorer.
How isolated pieces talk: one-shot sendMessage, long-lived connect ports, the return-true async trap, broadcasting to tabs, and externally_connectable. With an interactive messaging playground.
The event-driven heart of MV3: the lifecycle (install, wake, idle, terminate), why there is no persistent state, alarms vs setTimeout, and registering listeners correctly. With a live lifecycle simulator.
Inject JavaScript and CSS into web pages: match patterns, run_at timing, the isolated world, injecting your own UI, and the gotchas of touching someone else’s DOM. With an interactive injection lab.
How the popup, content script, service worker and options page relate — what each one can and cannot do, why they are isolated, and the data-flow that ties them together. With an interactive context map.
Every manifest.json key that matters: action, permissions vs host_permissions, content_scripts, background, icons, web_accessible_resources, commands and side_panel — with an interactive manifest builder.
Start from zero: what a browser extension really is, the four moving parts, the Manifest V3 model, and shipping a working "Hello World" extension you load unpacked in under 10 minutes. With a live anatomy explorer.