WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
WeAreDevelopers LIVE • Mar 23, 2021

Extensionator - Rise of the Chromium

Keren Kenzi

Turn basic HTML and JS skills into powerful browser tools. Learn to build custom Chrome extensions that intercept network requests, block distractions, and enforce healthy work-life boundaries.

Pause
Mute Enter Fullscreen
#1 about 2 min

Core components of a Chrome extension architecture

Building an extension requires configuring background scripts, content scripts, UI elements, and optional configuration pages.

#2 about 6 min

Setting up a distraction blocking Chrome extension project

Initializing a new extension requires a manifest configuration file to dictate name, version, and security settings.

#3 about 5 min

Redirecting specific web requests using a background script

Intercepting network traffic with the web request API allows the extension to automatically redirect distracting websites.

#4 about 3 min

Troubleshooting and resolving Chrome extension permission errors

Diagnosing undefined errors involves explicitly requesting the required host and web request permissions in the manifest.

#5 about 4 min

Initializing a work-life balance reminder extension project

Establishing a new repository and manifest configuration prepares the foundation for a time-based reminder extension.

#6 about 5 min

Designing an extension popup interface with HTML and CSS

Configuring browser actions allows developers to render an interactive HTML popup directly from the extension toolbar.

#7 about 4 min

Scheduling browser events with the Chrome alarms API

Attaching click event listeners to custom popup buttons provides the logic needed to create or cancel scheduled browser alarms.

#8 about 4 min

Triggering background notifications and text badge updates

Listening for triggered alarms from the background script allows the extension to deploy interactive desktop notifications.

#9 about 4 min

Testing the notification extension and reviewing publishing steps

Resolving specific file path errors ensures notification assets load correctly before uploading to the extension web store.

Matching moments

1:54 min

Testing the imperative API in Chrome with an extension

Andre Cipriani Bandarra +1 · Coffee With Developers

3:08 min

Addressing the impact of browser extensions on performance

Thomas Steiner · Coffee With Developers

3:14 min

Developing visual studio code extensions for personal productivity

Chris Heilmann +2 · LIVE

2:51 min

Managing browser memory usage across Chromium environments

Chris Heilmann +2 · LIVE

3:42 min

Expanding browser capabilities with external accessibility testing extensions

Julia Undeutsch Julia Undeutsch · Europe 2026 Virtual

6:27 min

Examining privacy risks posed by browser extensions and tracking

Chris Heilmann +2 · LIVE

More from WeAreDevelopers LIVE

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas thumbnail
5:46
6 days ago

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas

Chris Heilmann, Daniel Cranney, Marc Plogas

WeAreDevelopers - Of Agents and Robots thumbnail
1:04:42
7 days ago

WeAreDevelopers - Of Agents and Robots

Chris Heilmann, Daniel Cranney, Marc Plogas

WeAreDevelopers LIVE - How DevRel Makes Tech More Human thumbnail
48:06
14 days ago

WeAreDevelopers LIVE - How DevRel Makes Tech More Human

Chris Heilmann, Daniel Cranney

Fake or News: Smart Glasses in Court, Medical Advice Watches & Mushroom Electonics - Jason Torres thumbnail
7:41
15 days ago

Fake or News: Smart Glasses in Court, Medical Advice Watches & Mushroom Electonics - Jason Torres

Chris Heilmann, Daniel Cranney

Aliens in Quarantine, Python Deprecates Loops, and AI Buys Old Books - Zbyszek Tenerowicz thumbnail
5:43
27 days ago

Aliens in Quarantine, Python Deprecates Loops, and AI Buys Old Books - Zbyszek Tenerowicz

Chris Heilmann, Daniel Cranney

WeAreDevelopers LIVE - Node and Package Security thumbnail
1:08:30
28 days ago

WeAreDevelopers LIVE - Node and Package Security

Chris Heilmann, Daniel Cranney, Zbyszek Tenerowicz

Upcoming sessions on this topic

Open session

World Congress 2026 North America

Small LLM in your Browser: Huge Opportunities for Web Applications

Daniel Ostrovsky

UI/UX Architect at Payoneer | AI Architect | Full Cycle Development Expert | Public Speaker | Open Source Contributor |

Daniel Ostrovsky
Open session

World Congress 2026 North America

The Browser Is Becoming an AI Runtime

Ajit Varma, Will Bryk

Ajit Varma
Will Bryk
Open session

World Congress 2026 North America

Architecting AI in Angular: WebMCP, A2UI, and the Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

Accelerating development and managing agents with the GitHub Copilot app

Christopher Harrison

Senior Developer Advocate, GitHub

Christopher Harrison
Open session

World Congress 2026 North America

GitHub’s Team X-Ray: Your Repository Knows More About Your Team Than Your Team Does

Andrea Griffiths

Senior Developer Advocate

Andrea Griffiths
Open session

World Congress 2026 North America

Going beyond the code through the GitHub Copilot App: how to unlock you and your team’s superpower

Jenny Hwang

Director of User Research, GitHub

Jenny Hwang

Related videos

WeAreDevelopers LIVE - Demo Time, Live Coding, End-to-End Testing and more thumbnail
1:02:27
LIVE • 12 months ago

WeAreDevelopers LIVE - Demo Time, Live Coding, End-to-End Testing and more

Chris Heilmann, Daniel Cranney, Elio Struyf

WeAreDevelopers LIVE: Scammer Payback with Python, Grok Goes Unhinged, The Future of Chromium and mo thumbnail
1:01:44
LIVE • over 1 year ago

WeAreDevelopers LIVE: Scammer Payback with Python, Grok Goes Unhinged, The Future of Chromium and mo

Dan Cranney, Chris Heilmann, Brian Rountree

WeAreDevelopers LIVE – Inclusion, Accessibility & Automation thumbnail
1:09:45
LIVE • 10 months ago

WeAreDevelopers LIVE – Inclusion, Accessibility & Automation

Chris Heilmann, Daniel Cranney, Daniela Kubesch

WeAreDevelopers LIVE - Chrome for Sale? Comet - the upcoming perplexity browser Stealing and leaking thumbnail
56:03
LIVE • over 1 year ago

WeAreDevelopers LIVE - Chrome for Sale? Comet - the upcoming perplexity browser Stealing and leaking

Chris Heilmann, Daniel Cranney, Ramona Schwering

WeAreDevelopers LIVE – Spicy Vanilla Web, CSS Magic & More thumbnail
59:40
LIVE • 10 months ago

WeAreDevelopers LIVE – Spicy Vanilla Web, CSS Magic & More

Chris Heilmann, Daniel Cranney, Peter Kröner

Accessibility Features in Chrome DevTools and beyond thumbnail
30:17
Europe 2026 Virtual • 2 months ago

Accessibility Features in Chrome DevTools and beyond

Julia Undeutsch

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.