Introduction
"I just want to peek inside this zip file without actually extracting it." — Every developer has been there. But VS Code's default behavior is either showing raw binary or launching an external app. Unzip, check, delete the folder — that friction adds up. I built this extension to eliminate it.
The entire project was developed through conversation with Claude Code, starting from zero. I also wired in an ad-based monetization model. Then I published it to the VS Code Marketplace without any promotion whatsoever — and watched 10+ downloads roll in within the first hour.
Here's the full story.
What Is "Zip & Archive Viewer"?
Zip & Archive Viewer (publisher: Takeshi-Fuchi) is a VS Code extension that lets you browse and preview the contents of archive files directly in the editor — no extraction required.
Select a zip file and it immediately renders as a file tree. Mouse down on any filename in the list to preview its contents inline; release to close. No temp folders, no cleanup. For the job of "just checking what's inside," this is the shortest possible path.
Supported Formats
.zip / .7z / .tar / .tar.gz / .tgz / .tar.xz / .tar.bz2 / .tar.zst — 17 compression formats in total, including modern ones like Zstandard.
Key Features
File Tree View
Selecting an archive displays filenames, sizes, and timestamps in a collapsible tree.
Instant File Preview (No Extraction)
Hold the mouse button down on any filename to preview its content; release to dismiss. Shows the first N lines of text (configurable, default 20). Nothing is extracted to disk.
Image Preview (No Extraction)
JPG / PNG / GIF / WebP / BMP / SVG / ICO / TIFF / AVIF render inline inside the viewer. See exactly what's in the archive without touching your filesystem.
Markdown Preview (No Extraction)
Rendered Markdown is displayed directly from within the archive. Images referenced inside the archive are automatically resolved and embedded. Great for checking documentation in a release package.
Nested Archive Browsing
A zip inside a tar.gz? Click through and browse it. Still no extraction needed.
Password-Protected Archives
ZIP and 7Z password-protected archives are fully supported. Passwords are remembered for the session.
Selective Extraction
Once you've confirmed what you need, right-click to extract individual files or entire folders. Multi-select with checkboxes for batch extraction. Extraction is an intentional step — not the default.
Building It from Scratch with Claude Code
How It Started
One day I received a zip file, needed to quickly verify its contents, and found myself going through the whole unzip → check → delete cycle just for a 30-second confirmation. "This should just work inside VS Code," I thought.
I looked for existing extensions. Some were unmaintained, some only supported zip, some had clunky UIs. Close enough didn't cut it, so I decided to build one. The catch: I had never built a VS Code extension before. The Webview API, CustomEditorProvider, extension context lifecycle — unfamiliar territory. That's where Claude Code came in.
How Development Progressed
The workflow was straightforward. I described what I wanted — "show a tree view when a zip file is selected in VS Code, without extracting it" — and Claude Code generated the scaffolding. From there I layered in features: "add 7z support," "handle password-protected archives," "render Markdown from inside the archive."
The main file, src/extension.ts, is about 2,000 lines. Stream-based reading for each archive format, HTML generation for the Webview, preview logic, password dialogs, batch extraction — all in one file.
I wrote tests too: unit tests, integration tests against real archive files, and end-to-end tests with Playwright. When something broke, I'd pass the failure back — "this test is failing, find out why" — and get a precise fix. The debug cycle was noticeably faster than working alone.
Looking at the git history: from Initial commit through feature additions, bug fixes, and version bumps, the entire arc from zero to published was one developer in conversation with an AI.
What I Took Away from the Experience
The biggest win with Claude Code was not having to look up unfamiliar APIs. Things like using vscode.window.showInputBox() for a password prompt, or retainContextWhenHidden to preserve Webview state across tab switches — I could just describe what I wanted and get working code, without context-switching to docs.
Not everything worked on the first try. Images broke due to a Content Security Policy misconfiguration. The tar tree hierarchy got mangled at one point. Small bugs, real bugs. But the pattern of "here's the failing test, fix it" reliably produced accurate fixes. The time I spent debugging dropped significantly.
Monetizing a VS Code Extension with Ads
Before publishing, I added something unusual: designated ad space within the extension UI.
The README states it plainly:
This extension may display advertisements in designated advertising spaces within the interface. Revenue from advertisements is used for the development, maintenance, and improvement of the extension.
In-app advertising is standard in mobile apps and web services, but it's rare in developer tooling. The VS Code extension ecosystem is almost entirely donation-ware or subscription-based. I wanted to test whether an ad model could work here.
Some pushback is expected — developers tend to have low tolerance for ads in their tools. The constraints I set for myself:
- Non-intrusive: Ads sit at the edge of the UI and don't interfere with archive browsing
- Fully local: No file data is sent externally, stated explicitly in the privacy policy
- Transparent: The README discloses ad presence before anyone installs
Whether the developer community accepts this or not is the experiment. The results will tell me something either way.
10+ Downloads in the First Hour — Without Any Promotion
I had zero expectations at launch. No tweets, no Reddit posts, no Product Hunt submission. I published to the VS Code Marketplace and that was it.
Within an hour, downloads had crossed 10.
I was genuinely surprised.
In hindsight, it makes sense. The VS Code Marketplace has a massive, active user base searching for extensions every day. When you search "zip viewer" or "archive viewer" as a new listing, you surface at the top. No SEO work, no ad spend — the marketplace's own search index does the distribution.
Launching a web service from scratch is a cold start problem. You need SEO, social posts, community engagement, and paid acquisition just to get visible. A marketplace is different. The audience is already there. The infrastructure connecting supply and demand already exists.
The App Store and Google Play have the same structure, but the VS Code Marketplace is narrower: everyone visiting is a developer looking for a tool. The match rate between "I want to preview zip contents in VS Code" and this extension is near-perfect. A real solution to a real need gets found automatically.
Where It Is Now
Current version: 2.1.2. It started at 1.0.0 with preview support for 5 ZIP/TAR formats, expanded to 17 formats with a major UI overhaul in 2.0.0, and added Markdown preview, image preview, and batch extraction in 2.1.0. The scope has grown considerably from what I originally had in mind.
How the ad model performs, how downloads trend, how the developer community responds — I'll write a follow-up when there's something worth reporting.
If you've ever caught yourself unzipping just to check a file and immediately deleting the folder, give it a try.
Search "Zip & Archive Viewer" by Takeshi-Fuchi on the VS Code Marketplace
Source code is available at https://github.com/t-fuchi/zip-viewer
