# Schema

To improve development with autocomplete and validation in your IDE, Blockstudio introduces its own schema:

[View Blockstudio schema](https://blockstudio.dev/schema/block)

The Blockstudio schema is an (always up-to-date) copy of the WordPress core block.json schema with an additional `blockstudio` property that houses all plugin features like field schemas without interfering with potential future core properties.

## Add to JSON

Simply add a `$schema` key with a value of **https://blockstudio.dev/schema/block** to your block.json and your IDE should start to give you hints about Blockstudio specific properties.

```json title="block.json"
{
  "$schema": "https://blockstudio.dev/schema/block",
  "name": "blockstudio/native",
  "title": "Native Block",
  "category": "text",
  "icon": "star-filled",
  "description": "Native Blockstudio block.",
  "blockstudio": true
}
```

## IDE Support

### VS Code

VS Code automatically picks up the schema from the `$schema` property.

For workspace-wide settings, add to `.vscode/settings.json`:

```json title=".vscode/settings.json"
{
  "json.schemas": [
    {
      "fileMatch": ["**/block.json"],
      "url": "https://blockstudio.dev/schema/block"
    }
  ]
}
```

### JetBrains IDEs

PhpStorm and other JetBrains IDEs support JSON Schema via the `$schema` property automatically.

## Available Schemas

| Schema | URL |
|--------|-----|
| Block Schema | `https://blockstudio.dev/schema/block` |
| Extension Schema | `https://blockstudio.dev/schema/extend` |

## Benefits

- **Autocomplete**: Get suggestions for all available properties
- **Validation**: Catch errors before runtime
- **Documentation**: Hover over properties for inline documentation
- **Type Safety**: Ensure correct value types