Overview
/ Scope
- VS Code extension API integration
- Strict tree schema & parser
- Preview webview before filesystem write
- Conflict-aware file system writer
- Marketplace release & version management
Highlights
01
Preview-first file tree generation — see before you write
02
Conflict-aware writes — existing files never silently overwritten
03
33,000+ downloads, 5.0 rating on VS Code Marketplace
04
Strict schema validation with clear, actionable error messages
/ Tracks
- Product
- Open source
Media
External preview
Open linkmarketplace.visualstudio.com
FileTree Pro on VS Code Marketplace — 29k+ downloads, 5.0 rating
The Problem
New projects repeat the same folder patterns — components, hooks, tests — and it's easy to miss a convention or accidentally clobber an existing file. I wanted a small tool that lets you design the tree first, preview it, then apply it carefully.
Approach
The extension works from a strict, parseable tree format: describe the shape you want, see it in a preview webview, and only then write to disk. Parsing rejects malformed trees with a clear error — no half-written directories. The file writer skips existing files by default, with an explicit opt-in rename when the user wants to overwrite.
Key Decisions
- 01
Strict tree schema — fail loudly
Output must match a known structure. If validation fails, the user gets a clear error message — not a half-written directory tree. This is more useful than guessing intent.
- 02
Preview before write
A webview renders the tree before any filesystem change happens. Eliminates 'oops I just overwrote my components/' moments in real repos.
- 03
Minimal command surface
Shipped with a small set of commands and settings. A smaller surface area means fewer support issues, faster updates, and a listing that's easy to understand in 10 seconds.
Challenges & How I Solved Them
Robust parsing of noisy input
/ Problem
Early builds had to tolerate noisy input — markdown code fences, indentation drift, mixed spacing — while still producing a single validated tree structure.
/ Solution
Strip and normalize first, then run a strict structure check. Bad input fails loudly with a specific error. Good input always produces the same deterministic result.
Preserving existing workspace files
/ Problem
Re-running the flow after initial scaffold could silently overwrite files the user had already edited — a trust-destroying experience.
/ Solution
Default behavior skips any file that already exists. Users who want to replace can opt-in explicitly with a rename suffix. Existing work is safe by default.
Outcomes
- 33,000+ downloads on the VS Code Marketplace
- 5.0 rating across all active reviews
- Steady organic adoption — no promotion, just the listing
- Zero reported 'silent overwrite' incidents since conflict-awareness shipped
What I Learned
- 01
Utilities that respect the user's existing work build more trust than utilities with more features.
- 02
Strict validation is a feature, not a limitation, when anything can write to the workspace.
- 03
Marketplace success tracks directly to clarity in the listing — title, screenshots, and a one-line description of what it does.
Tech Stack
Next Steps
- Reusable project-shape presets (save and recall a tree layout)
- Stack-aware defaults (e.g. Next.js vs NestJS layout hints)