JSON Schema Studio

A powerful VS Code extension for converting JSON to TypeScript interfaces and generating JSON schemas with advanced format detection and flexible output options.

✨ Features

🔄 JSON Schema Generation

• Smart Format Detection: Automatically detects and formats emails, URLs, and date-time strings
• Nested Object Support: Handles complex nested structures with proper schema generation
• Null Value Handling: Correctly processes null values and optional fields

🎯 TypeScript Interface Generation

• Clean Interface Generation: Creates well-structured TypeScript interfaces
• Nested Interface Support: Automatically generates separate interfaces for nested objects
• Array Type Detection: Intelligently handles arrays with proper type inference

📋 Multiple Access Methods

• Command Palette: Traditional VS Code command access
• Right-Click Context Menu: Convenient access when text is selected
• Flexible Output Options: Choose where to display generated content

🖥️ Output Flexibility

• New Column: Opens generated content in a new editor column (default)
• Current Tab: Replaces current tab with generated content
• Save to File: Directly saves JSON schema to a file of your choice

🚀 Usage

Method 1: Right-Click Context Menu (Recommended)

1. Select JSON text in any editor
2. Right-click on the selection
3. Choose from the JSON Schema Studio options:
   • Generate JSON Schema from Selection (New Column)
   • Generate TypeScript Interface from Selection (New Column)
   • Generate JSON Schema from Selection (Current Tab)
   • Generate TypeScript Interface from Selection (Current Tab)
   • Save JSON Schema to File

Method 2: Command Palette

1. Select JSON text in the editor
2. Open Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
3. Type "JSON Schema Studio" and select your desired command

📝 Example

Input JSON:

{
  "name": "John Doe",
  "age": 30,
  "active": true,
  "email": "john.doe@example.com",
  "website": "https://johndoe.com",
  "hobbies": ["reading", "coding", "hiking"],
  "address": {
    "street": "123 Main St",
    "city": "Anytown",
    "zipCode": "12345"
  },
  "metadata": {
    "created": "2024-01-01T00:00:00Z",
    "lastUpdated": "2024-07-04T18:30:00Z"
  }
}

Generated JSON Schema:

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "type": "object",
  "properties": {
    "name": { "type": "string" },
    "age": { "type": "integer" },
    "active": { "type": "boolean" },
    "email": { "type": "string", "format": "email" },
    "website": { "type": "string", "format": "uri" },
    "hobbies": {
      "type": "array",
      "items": { "type": "string" }
    },
    "address": {
      "type": "object",
      "properties": {
        "street": { "type": "string" },
        "city": { "type": "string" },
        "zipCode": { "type": "string" }
      },
      "required": ["street", "city", "zipCode"]
    },
    "metadata": {
      "type": "object",
      "properties": {
        "created": { "type": "string", "format": "date-time" },
        "lastUpdated": { "type": "string", "format": "date-time" }
      },
      "required": ["created", "lastUpdated"]
    }
  },
  "required": ["name", "age", "active", "email", "website", "hobbies", "address", "metadata"]
}

Generated TypeScript Interface:

export interface RootObject {
  name: string;
  age: number;
  active: boolean;
  email: string;
  website: string;
  hobbies: string[];
  address: Address;
  metadata: Metadata;
}

export interface Address {
  street: string;
  city: string;
  zipCode: string;
}

export interface Metadata {
  created: string;
  lastUpdated: string;
}

🎛️ Available Commands

🔧 Smart Format Detection

The extension automatically detects and applies appropriate JSON Schema formats:

• Email addresses: john@example.com → { "type": "string", "format": "email" }
• URLs: https://example.com → { "type": "string", "format": "uri" }
• Date-time strings: 2024-01-01T00:00:00Z → { "type": "string", "format": "date-time" }
• Numbers: Distinguishes between integers and floats
• Arrays: Infers item types from first element

💡 Tips

• Select the entire JSON object for best results
• Use the right-click context menu for quickest access
• Choose "New Column" to compare original JSON with generated output
• Use "Save to File" when you need to persist the schema for later use

🔧 Requirements

• VS Code: 1.99.3 or higher
• File types: Works with any file type containing JSON text

🐛 Known Issues

None currently known. If you encounter any issues, please report them on the GitHub repository.

📄 License

This extension is released under the MIT License.

🤝 Contributing

Contributions are welcome! Please feel free to submit issues and pull requests on the GitHub repository.

Enjoy using JSON Schema Studio! 🎉