Have a personal browser extension

Guilherme Rossato, December 2025
TLDR; Creating a personal browser extension can transform your web experience by automating repetitive tasks, customizing sites, and adding features tailored to your workflow. In this post, I describe how I built my own extension, the technology behind it, and the impact it had on my daily browsing.

Motivation

Modern browsers are powerful, but they can't anticipate every user's needs. I often found myself repeating the same actions: cleaning up cluttered pages, saving snippets, or automating logins. While there are many extensions available, most are generic or come with privacy concerns. Building a personal extension means I can solve my own problems, keep my data private, and experiment with new ideas.

Getting Started

Browser extensions are essentially small web apps that run in the browser context. I started by reading the Chrome Extension documentation and bootstrapped my project using the official template:
npx create-chrome-extension my-extension
I chose to keep my extension code in a private git repository, similar to my blog setup. This allows me to iterate quickly and deploy updates to my browser with a single command. I use SSH to clone and push changes, and a simple build script to package the extension for installation.

Features and Use Cases

My extension started simple: a button to copy the current page's title and URL. Over time, I added more features:
  • Custom site tweaks: Hide ads, rearrange layouts, or inject helpful links on sites I use daily.
  • Quick actions: Autofill forms, save selected text to notes, or open multiple tabs with a single click.
  • Automation: Automatically log in to certain sites, dismiss popups, or extract data for later use.
Here's a snippet of my manifest file:
{
  "manifest_version": 3,
  "name": "Personal Extension",
  "version": "1.0",
  "permissions": ["activeTab", "storage"],
  "background": { "service_worker": "background.js" },
  "action": { "default_popup": "popup.html" }
}

Privacy and Security

Since the extension is personal, I avoid sending any data to external servers. All settings and data are stored locally using the browser's storage API. This keeps my browsing private and secure.

Development Workflow

Whenever I want a new feature, I add it to my extension and reload it in the browser. Debugging is straightforward with the browser's developer tools. I use runtime logs to track actions and outcomes:
console.log('Action taken:', action, 'on', location.href.substring(0, 16), 'length:', location.href.length);
If an operation fails, I catch the error and log it for debugging:
try {
  // ...operation...
} catch (err) {
  console.error('Error:', err.message, 'on', location.href.substring(0, 16), 'length:', location.href.length);
}

Closing Thoughts

Having a personal browser extension is a game changer. It saves time, reduces friction, and lets me experiment with new ideas instantly. The process of building and maintaining it is straightforward, and the benefits are immediate. If you have recurring tasks or want to customize your browsing experience, I highly recommend building your own extension.
Anyways, thanks for reading! If you have questions or want to see examples, feel free to reach out.