DEV Community

Cover image for Oops, I Made a VS Code Extension
Johnny Fekete
Johnny Fekete

Posted on

Oops, I Made a VS Code Extension

Ever had one of those "how did I get here?" moments in coding? Well, buckle up, because I've got a story for you.

It all started with localization. I was working on my mobile app - Social AIde (an AI powered social-media response generator app built in Swift, thanks to AI because I never touched Swift before).

I wanted to add a bunch of new languages, but everything was hardcoded. Yikes ๐Ÿ˜ฌ

The problem wasn't finding the hardcoded strings, but replacing them with keys for a key-value pair JSON file. Fun times, right?

Copy-pasting 200+ strings manually? No thanks.

There had to be a better way.

Spoiler: There wasn't.

At least, not in the VS Code marketplace. I looked for plugins, I tried to search online, but I was stuck with manually copying the string, then copying back the key.

I'm too lazy to that.
So I turned to my trusty sidekick, good friend, Claude AI.
Described my problem:


Please help me creating a visual studio code macro/extension, whatever fits my use case. Here's what it should do:

You select a hardcoded text in the editor, and initiate the plugin (maybe as a command, called "replace with localized string key". It would ask for what should be the key (in a prompt?)

Then it replaces the selected text with that key in this format: String(localized: "my_key")

Then add/modify a JSON file in the project's root folder to add the key and the original hardcoded string in a key-value pair.
Enter fullscreen mode Exit fullscreen mode

In 4 seconds it laid out everything: how to start a VS Code extension, what code to add:

Claude's first response

Mind. Blown ๐Ÿคฏ.

No Googling required โ€“ just follow the instructions.

But why stop there? I figured, "Hey, let's make this available to everyone!"

So I asked Claude to add configuration options. Boom. Done.

Then came the publishing process: API keys, descriptions, licenses โ€“ Claude had me covered.

Of course, every cool extension needs a logo.

So I quickly jumped to recraft.ai and asked for a vector image of a "magnifying glass zooming in on an arrow pointing up".

So the only manual thing left was to take a screen recording (because all cool VSCode plugins have a nice gif animation) - of course Claude helped me how to insert it into the readme (which was also written by Claude btw).

Claude's first response

Just like that, in less than an hour, I had a Hardcoded String Replacer VS Code extension live.

Zero prior experience required.

It's wild how AI is making our jobs faster.

Sure, you still need a basic understanding, but those entry barriers? They're crumbling.

So here's to AI, our new coding buddy. Making the impossible possible, one accidental project at a time.

Who knows? Your next "oops, I made a thing" moment might be just around the corner.

Top comments (3)

Collapse
 
softwaredeveloping profile image
FrontEndWebDeveloping

Yikes!

Collapse
 
actitrend profile image
actitrend

cool!
congrats! :)

Collapse
 
johnnyfekete profile image
Johnny Fekete

thanks ๐Ÿ˜Š