MCP setup

Connect this tutorial site to Cursor, Claude Code, Codex, Claude Desktop, or any other MCP-aware editor. Your agent can start tutorials from a blank workspace, browse steps, mark checkpoints, record quiz results, and send help requests to the in-browser tutor.

How it works

Create a scoped personal access token for this site.
Install the site's MCP server in your editor.
Ask your agent to use the Handzon MCP server while you work through a tutorial.

Tokens are scoped. A token with progress:write can make the same progress updates your browser session can make, so treat it like a password.

2. Connect your editor

Choose your editor to get the right install command or config block. If you already have a token, replace hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx in the snippet with that value. If you lost the raw token value, create a fresh token above.

Install in

Cursor

One click — opens Cursor's MCP install prompt with the server and token already filled in.

Mint a token below to enable one-click install.

Or paste into your Cursor MCP config:

{
  "mcpServers": {
    "render-tutorials": {
      "url": "https://render.com/tutorials/api/mcp",
      "headers": {
        "Authorization": "Bearer hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"
      }
    }
  }
}

VS Code

One click — opens VS Code's MCP install prompt.

Mint a token below to enable one-click install.

Or run in your terminal (uses the code CLI):

code --add-mcp '{"name":"render-tutorials","type":"http","url":"https://render.com/tutorials/api/mcp","headers":{"Authorization":"Bearer hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"}}'

VS Code Insiders

Mint a token below to enable one-click install.

Claude Code (CLI)

Run in your terminal:

claude mcp add --transport http render-tutorials https://render.com/tutorials/api/mcp --header "Authorization: Bearer hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"

Codex (CLI)

1. Register the server in your Codex config:

codex mcp add render-tutorials --url https://render.com/tutorials/api/mcp --bearer-token-env-var HANDZON_PAT

2. Export the token where your shell can find it (add to ~/.zshrc or ~/.bashrc). Codex stores only the env var name in its config file, never the token itself — so the secret stays out of files you might commit.

export HANDZON_PAT="hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"

Claude Desktop

Paste into Claude Desktop's config. Uses the handzon-mcp npx wrapper since Claude Desktop has no native remote-MCP support yet.

{
  "mcpServers": {
    "render-tutorials": {
      "command": "npx",
      "args": [
        "-y",
        "handzon-mcp@latest",
        "--site",
        "https://render.com",
        "--token",
        "hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"
      ]
    }
  }
}

Other / raw mcp.json

Generic remote MCP config for any client that supports the standard mcp.json shape (HTTP transport + bearer auth).

{
  "mcpServers": {
    "render-tutorials": {
      "url": "https://render.com/tutorials/api/mcp",
      "headers": {
        "Authorization": "Bearer hzn_pat_xxxxxxxxxxxxxxxxxxxxxxxx"
      }
    }
  }
}

What the agent can do

Reads (any token, or no token): list_tutorials, get_tutorial, start_tutorial, get_step, get_progress.
Writes (need progress:write): complete_checkpoint, uncheck_checkpoint, complete_step, mark_step_incomplete, record_quiz, set_last_visited, set_preference, request_help, submit_verification.

request_help is the bridge. The editor agent can say "the learner is stuck on X" and the message lands in the in-browser tutor's inbox the next time you open the tab.