Skip to main content

Getting Started with DemoScript

Create beautiful API demos in minutes

1. Install the CLI

DemoScript is available as an npm package. Install it globally:

npm install -g @demoscript/cli

2. Create Your Demo File

Create a file called demo.yaml in your project directory:

# demo.yaml
title: "My API Demo"
description: "A quick tour of my API"

settings:
  base_url: "https://api.example.com"
  # Optional: auto-generate forms from OpenAPI
  openapi: "https://api.example.com/openapi.json"

steps:
  # Welcome slide with markdown
  - slide: |
      # Welcome to the API
      This demo shows how to create and manage users.

  # API call with form
  - rest: POST /users
    title: "Create a User"
    defaults:
      name: "John Doe"
      email: "john@example.com"
    save:
      userId: id

  # Use saved variable
  - rest: GET /users/$userId
    title: "Fetch the User"

3. Run Your Demo

Start the demo server to preview locally:

demoscript serve

Open http://localhost:3000 to see your demo.

4. Use the Visual Editor

Prefer a visual interface? Use the Visual Editor in your cloud dashboard:

The visual builder lets you:

  • Add and reorder steps with drag-and-drop
  • Execute API calls and see responses live
  • Configure settings and themes visually
  • Save directly to your cloud account
Visual Editor in action

Build demos visually - configure, execute, and save to cloud

5. Share Your Demo

Push your demo to DemoScript Cloud for easy sharing:

# Login first
demoscript login

# Push to cloud
demoscript push --slug my-api-demo

Your demo will be available at demoscript.app/d/your-username/my-api-demo

Step Types Reference

Type Purpose Example
slide Markdown content slides slide: "# Hello World"
rest HTTP API calls rest: POST /users
shell Command-line commands shell: npm test

Useful Features

  • Variable substitution - Use $varName to reference saved values
  • OpenAPI integration - Auto-generate forms from your API spec
  • Visual effects - Confetti, sounds, and animations
  • Themes - Choose from purple, blue, green, teal, orange, or rose
  • Export options - Export as MP4 video or animated GIF
  • Password protection - Secure demos with authentication

More Resources