# I built my first Chrome extension because editing localStorage was annoying

> Source: <https://dev.to/rodrigocnascimento/i-built-my-first-chrome-extension-because-editing-localstorage-was-annoying-1ji1>
> Published: 2026-05-22 22:27:03+00:00

I finally published my first Chrome extension.

It is called **DataSidekick**, and I built it because I got tired of fighting DevTools every time I needed to inspect or edit `localStorage`

and `sessionStorage`

.

Also, yes, I paid the legendary **$5 Chrome Web Store developer fee**, so emotionally I had to ship something. Otherwise, it would have been the worst investment portfolio of my life.

## What is DataSidekick?

DataSidekick is a Chrome extension that opens as a side panel and helps developers work with browser storage in a cleaner way.

Instead of digging through DevTools and editing raw strings, you get a focused interface for:

- viewing
`localStorage`

- viewing
`sessionStorage`

- searching by key or value
- editing simple values inline
- editing JSON visually
- importing data from JSON
- exporting data to JSON
- hiding noisy keys
- requesting access per site/origin

You can check it out here:

## Why I built it

Browser storage is simple until it is not.

A lot of apps store useful state in `localStorage`

, but the default developer experience is still pretty rough:

```
{"user":{"name":"Rodrigo","settings":{"theme":"dark"}}}
```

Technically readable? Sure.

Pleasant to edit? Absolutely not.

I wanted something closer to a small developer cockpit: open the panel, find the key, inspect the value, edit it safely, and move on.

## The feature I cared about most: visual JSON editing

The main idea was simple:

If a value is valid JSON, don't treat it like a random string.

So instead of this:

```
{"a":"b","settings":{"theme":"dark"}}
```

DataSidekick displays structured JSON in a more readable way, so it becomes easier to inspect and edit nested values.

That was the first “okay, this is actually useful” moment.

## Chrome permissions were the real boss fight

The extension needs to read and edit storage from the current page. That means permissions matter.

At first, I had an unnecessary permission in the manifest and the Chrome Web Store rejected the extension.

Fair enough. My bad.

The final approach is more intentional:

- no unnecessary
`downloads`

permission - site access is requested when needed
- the user sees when access is required
- data stays local in the browser

For a tool that touches browser storage, I think this transparency is important.

## Exporting without the downloads permission

One small lesson: exporting a JSON file does not necessarily require the Chrome `downloads`

permission.

This is enough for my use case:

``` js
const blob = new Blob([JSON.stringify(payload, null, 2)], {
  type: "application/json"
});

const url = URL.createObjectURL(blob);

const a = document.createElement("a");
a.href = url;
a.download = "datasidekick-export.json";
a.click();

URL.revokeObjectURL(url);
```

Since I was not using `chrome.downloads.download()`

, the permission was unnecessary.

Chrome Web Store noticed. Chrome Web Store was right.

Painful, but useful.

## Current features

The first public version includes:

- Chrome Side Panel UI
-
`localStorage`

and`sessionStorage`

support - visual JSON editor
- key/value search
- import/export JSON
- per-site access flow
- hidden keys
- noisy key filtering
- favorites
- dark/light mode
- font size controls
- playground on the website

## The playground

I also added a playground to the site so people can understand the idea before installing anything.

That was important because browser storage tools can feel a bit sensitive. I wanted people to see what the extension does before giving it access to a page.

Try it here:

## What I learned

A few things I took away from this first release:

- Small dev tools are still worth building.
- Chrome extension permissions deserve real attention.
- A simple UX decision can matter more than a complex feature.
- Shipping to a store is very different from “it works locally”.
- Paying $5 makes you emotionally committed.

## What's next?

This is my first Chrome extension, but definitely not the last.

Some ideas for future versions:

- IndexedDB support
- better diff view
- undo/redo
- schema validation
- storage history
- better JSON editing interactions

For now, I am happy it is live.

If you work with `localStorage`

or `sessionStorage`

often, I would love your feedback:

Or plugin link: [DataSideKick](https://chromewebstore.google.com/detail/datasidekick/mjeonoddcckacjbeeaplmlnppacofgjb)

Built by a developer who just wanted to stop editing JSON like a caveman.