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' | 'reference',
  description: 'Page title'
})

const pageBuilder = defineBlockField({
  label: 'Sections',
  blocks: {
    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 can nest multiple block types under blocks.
• 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.