Defining Content Structure
Pass a Structure
object to createStudio(structure)
to define the schema.
Use the helpers:
import { defineBlock, defineField, defineStructure, defineBlockField } from '@alstar/studio'
... to get automatic Typescript typings when creating blocks and fields.
Example: Schema Definition
import { defineBlock, defineField, defineStructure, defineBlockField } from '@alstar/studio'
const titleField = defineField({
label: 'Title',
type: 'text' | 'image' | 'markdown' | 'slug',
description: 'Page title'
})
const pageBuilder = defineBlockField({
label: 'Sections',
type: 'blocks',
children: {
hero: defineBlock({
label: 'Hero',
type: 'hero',
fields: { /* fields */ },
}),
gallery: defineBlock({
label: 'Gallery',
type: 'gallery',
fields: { /* fields */ },
}),
},
})
const entryBlock = defineBlock({
label: 'Entry',
type: 'entry',
fields: {
title: titleField,
builder: pageBuilder
}
})
export default defineStructure({
entry: entryBlock
})
Concepts
- Blocks contain fields.
- Block fields (
type: 'blocks'
) can nest multiple block types underchildren
. - This enables page builders and reusable structures.
All content is stored in a SQLite database (studio.db
) and can be queried in the templates with the query
module.