As described in the Required Packages page, a schema object is a powerful mechanism for creating object-like structures.

By creating schemas, we have more control of the data structures that extensions can use.

To help provide an example, here is how to convert an object to a schema:

// Our object example
interface CustomObject {
  name: string;
  age: number;
  hobbies: Array<string>;
}

Once you run the code, here is the schema:

const customObject = Schema.object({
  name: Schema.string(),
  age: Schema.number(),
  hobbies: Schema.array()
});

To dive deeper into a more complex example, let’s create a schema for a calendar-like extension. We’ll start with the following properties:

interface CustomCalendar {
  title: string;
  description: string;
  holidays: { title: string; descrition: string; day: number, isCustom: boolean }[];
  country: string;
  configuration: {
    view: string;
    isPopup: boolean;
  }
}

Once we’ve defined the structure, we move forward with the schema.

Here’s the result:

const customCalendarSchema = Schema.object({
  title: Schema.string(),
  description: Schema.string(),
  holidays: Schema.array({
    title: Schema.string(),
    description: Schema.string(),
    day: Schema.number(),
    isCustom: Schema.boolean()
  }),
  country: Schema.string(),
  configuration: Schema.object({
    view: Schema.string(),
    isPopup: Schema.boolean()
  })
});

Then, we can use the resulting schema in the component({}) method explained in Creating and Registering your App.

Schema Methods

Schema objects provide you with a breadth of other methods. Learn more about the different Schema methods in our documentation: Schema Methods/Types.