DEV Community

miccho27
miccho27

Posted on

I Published 12 VS Code Extensions — Here's What Each One Does and What I Learned

After shipping 10 Chrome extensions, I turned to VS Code. Same strategy: build tools I actually want to use, publish them, learn the ecosystem.

12 extensions later, here's the breakdown.

The Full List

All published under miccho27-dev on the VS Code Marketplace.

Paste & Transform

Paste clipboard content with automatic transformations: camelCase, snake_case, UPPER_CASE, kebab-case, Title Case. Saves the constant manual reformatting when copying code between contexts.

Debug Log Cleaner

One command to remove all console.log, console.debug, and print() statements from the current file or entire workspace. Stops you from shipping debug logs to production.

Env File Lens

Shows inline annotations next to .env variable references in your code, displaying the actual value (masked for secrets). No more hunting through .env files to remember what DB_HOST is set to.

Commit Crafter

Generates conventional commit messages from your staged diff using templates. Enforces feat:, fix:, refactor: etc. consistently across your team without remembering the format.

File Sticky Notes

Attach persistent notes to any file in your workspace. The note appears in a sidebar panel when you open that file. Useful for "TODO: refactor this after X ships" type reminders that live with the code.

Markdown Table Pro

A table editor for Markdown files. Click to edit cells, auto-aligns columns, supports sorting. Better than hand-typing pipe characters.

API Response Viewer

Paste a JSON or XML API response directly into a panel for syntax highlighting, collapsible tree view, and quick path copying. No context-switching to Postman just to inspect a response.

i18n Helper

For internationalization workflows — highlights untranslated strings, shows translation previews inline, and generates translation key templates. Useful for any project with t('key') style i18n.

Smart Folding

Custom fold regions beyond VS Code's default. Define project-specific fold markers in settings so you can collapse boilerplate sections consistently.

Doc Snapshot

Captures a "snapshot" of your documentation comments at a point in time. Useful for tracking what changed in API docs between versions without a separate doc system.

File Header Generator

Auto-inserts file headers with filename, author, creation date, and a copyright template. Configurable per project via settings.json.

Line Counter Dashboard

A sidebar dashboard showing line counts per file and directory in your workspace, sorted by size. Useful for spotting files that need to be split.

What I Learned About the VS Code Extension Ecosystem

Discovery is different from Chrome:
The VS Code Marketplace has a search algorithm that weighs installs heavily. New extensions with zero installs are hard to surface. The first few organic installs matter a lot.

The VSIX workflow is solid:

npm install -g @vscode/vsce
vsce package                    # creates extension.vsix
vsce publish --pat YOUR_PAT     # publishes to marketplace
Enter fullscreen mode Exit fullscreen mode

Publishing is genuinely easy once you have a Personal Access Token from Azure DevOps. The review process is faster than Chrome Web Store (typically hours, not days).

What actually gets installs:
The extensions with the clearest, most specific value proposition get installs fastest. "Debug Log Cleaner" — people immediately understand what it does. "Smart Folding" — requires explanation.

Rate limits on new publishers:
I hit publish rate limits when trying to publish all 10 at once. The solution: use two publisher accounts (miccho27 and miccho27-dev) and stagger publications.

The Code Pattern

Most of these extensions follow the same structure:

// extension.ts
export function activate(context: vscode.ExtensionContext) {
  const command = vscode.commands.registerCommand(
    'extension.myCommand',
    async () => {
      const editor = vscode.window.activeTextEditor;
      if (!editor) return;

      // Do the thing
      await editor.edit(editBuilder => {
        // transform text
      });
    }
  );

  context.subscriptions.push(command);
}

export function deactivate() {}
Enter fullscreen mode Exit fullscreen mode

Simple, event-driven, no external dependencies for most of them.

Monetization Plan

Currently free. The plan:

  1. Establish installs and usage baseline
  2. Add premium features gated behind a license key (validated via a Cloudflare Worker)
  3. Sell license keys via Gumroad

The licensing infrastructure is already built on the Cloudflare Workers side — I just need to flip the switch once usage justifies it.

Try Them

Search "miccho27" in the VS Code Extensions Marketplace, or install any specific one:

ext install miccho27-dev.debug-log-cleaner
ext install miccho27-dev.paste-transform
ext install miccho27-dev.env-file-lens
Enter fullscreen mode Exit fullscreen mode

Building and publishing developer tools is genuinely satisfying — you're scratching your own itch and potentially helping thousands of other developers at zero marginal cost.

What VS Code workflow frustration do you have that doesn't have a good extension yet? Might build it.

Top comments (0)