MernFlow

Never write boilerplate again. Instantly generate secure, type-safe MERN pipelines, and let MernFlow proactively protect your codebase from breaking changes.

🚀 Features

1. One-Click Pipeline Generation

Right-click any Mongoose model and select Generate MernFlow Pipeline. Instantly generate:

• 🛡️ Zod Validators: Perfect schema validation.
• ⚙️ Express Controllers & Routes: Full CRUD operations ready to deploy.
• ⚛️ React Custom Hooks: Typed, out-of-the-box data fetching hooks for your frontend.

2. Deep Validation Translation

MernFlow isn't just generating boilerplate; it intelligently parses your Mongoose Abstract Syntax Tree (AST). It perfectly translates complex constraints (minlength, maxlength, enum, match, required) and their custom error messages directly into enterprise-grade Zod schemas.

3. Non-Destructive "Smart Merging"

Evolving your database schema? No problem. If you add a new field to your database model, run the generation command again. MernFlow uses AST mapping to surgically inject the new fields into your existing Zod validators and React Hooks. It never overwrites your custom Express controllers or business logic. Your custom code is 100% safe.

4. Workspace-Wide Breaking Change Radar

The ultimate frontend-backend sync tool. If a backend engineer renames or deletes a field in your Mongoose model, MernFlow instantly scans your frontend React components. If a component tries to fetch the missing field, you'll immediately see a red squiggle warning you of the breaking change, complete with Levenshtein-distance suggestions (e.g., "Did you mean 'fullName'?").

⚠️ Requirements & Constraints

To get the most out of MernFlow, your workspace must adhere to the following standard patterns:

1. TypeScript Only: MernFlow heavily relies on AST parsing and is designed strictly for TypeScript projects (.ts, .tsx).
2. Standard src/ Directory Structure: MernFlow expects a standard src/ based monorepo or standard folder structure to locate files effectively. Ensure your files are structured similarly to:
   • src/models/ (Mongoose models)
   • src/components/ (React components)
   • src/hooks/ (React hooks)
   • src/controllers/ (Express controllers)
   • src/routes/ (Express routes)
   • src/validators/ (Zod schemas)
3. Mongoose Models: MernFlow currently parses mongoose.Schema. Ensure your models are properly defined using Mongoose.

🛠️ Usage

1. Open a workspace that meets the requirements above.
2. Create a Mongoose model in src/models/User.ts.
3. Open the file, open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P), and type MernFlow: Generate Pipeline.
4. Watch as MernFlow generates the entire type-safe stack.
5. Create a React component in src/components/ and fetch() your API. Change a field in your model, and watch the Breaking Change Radar catch it instantly.

📝 License

This extension is licensed under the MIT License.