Studio
Discover the @nullix/zod-mongoose-studio for visualizing transformations.
Studio
@nullix/zod-mongoose-studio is a powerful, Monaco-powered TypeScript playground for testing and visualizing Zod-to-Mongoose transformations. It provides a real-time editor experience where you can define your Zod schemas and instantly see the resulting Mongoose schema definition.
Installation
The Studio is available as a separate package that you can add to your development environment.
pnpm add @nullix/zod-mongoose-studio
Usage
You can use the Studio as a standalone component or integrate it into your own Nuxt or Vue applications.
Standalone Development
If you're working within the zod-mongoose monorepo, you can start the Studio by running:
pnpm run dev
This will launch the playground environment which includes the Studio component.
Features
- Monaco Editor: A full-featured editor experience with TypeScript support, including auto-completion and syntax highlighting for Zod.
- Real-time Conversion: As you type your Zod schema, the Studio automatically calls
extractMongooseDefand displays the resulting POJO. - Type Exploration: Hover over Zod methods to see documentation and inferred types.
- Validation Testing: Verify that your Zod schemas correctly translate complex validations like
.regex(),.min(), or.transform().
Why use Studio?
The Studio is ideal for:
- Designing complex schemas: Visualize how nested objects, arrays, and unions are mapped to Mongoose.
- Debugging transformations: If a Mongoose schema doesn't behave as expected, test the Zod conversion in isolation.
- Learning the API: Discover how different Zod types and
withMongoosemetadata options affect the final Mongoose definition.