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

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

3:21 min

Leveraging robust extension APIs for developer ecosystems

Chris Heilmann +2 · LIVE

More from WeAreDevelopers LIVE

Aliens in Quarantine, Python Deprecates Loops, and AI Buys Old Books - Zbyszek Tenerowicz thumbnail
5:43
5 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
5 days ago

WeAreDevelopers LIVE - Node and Package Security

Chris Heilmann, Daniel Cranney, Zbyszek Tenerowicz

WeAreDevelopers LIVE - Streaming HTML thumbnail
1:10:26
12 days ago

WeAreDevelopers LIVE - Streaming HTML

Chris Heilmann, Daniel Cranney, Jad Joubran

WeAreDevelopers LIVE - CODE100 at WeAreDevelopers Europe thumbnail
1:02:34
19 days ago

WeAreDevelopers LIVE - CODE100 at WeAreDevelopers Europe

Chris Heilmann, Daniel Cranney, Justin Halsall, Werner Jeschko, Nicole Jeschko, Mirco Tomić

WeAreDevelopers LIVE - Web Performance in an AI World thumbnail
1:07:59
26 days ago

WeAreDevelopers LIVE - Web Performance in an AI World

Chris Heilmann, Daniel Cranney

FIFA Hack, Midjourney Does Ultrasounds, and Trampoline Traffic Lights - Nicole Jeschko and Werner Jeschko thumbnail
5:55
about 2 months ago

FIFA Hack, Midjourney Does Ultrasounds, and Trampoline Traffic Lights - Nicole Jeschko and Werner Jeschko

Chris Heilmann, Daniel Cranney

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

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

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

Proactive AI That Doesn’t Annoy Users: Building Context-Aware Notification Systems

Raju Dandigam Dandigam

Engineering Manager at Navan

Raju Dandigam Dandigam
Open session

World Congress 2026 North America

Context Engineering Kung Fu

Carl Lapierre

Tech Lead and AI Engineer at Osedea

Carl Lapierre
Open session

World Congress 2026 North America

On the Public Clock: Open-Source Defense When You're Not in the Club

Nicholas Muy

VP Engineering Platform and Security at Scrut.io

Nicholas Muy

Related videos

WeAreDevelopers LIVE - Demo Time, Live Coding, End-to-End Testing and more thumbnail
1:02:27
LIVE • 11 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 • 9 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 • about 1 month 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.