Pre-Course Setup: Connect the Artifact

Duration
15 min
Last verified
2026-06-12
Source outline section
Pre-Course Setup
Exit criterion
Your agent session has @runsnative/mcp-server connected, list_exercises and list_components both return live data, and you have completed the vibe-with-runsnative smoke exercise.

This is not a pre-read. It is the first lesson. A student who finishes this setup has performed a real MCP integration — connected an MCP server to an agent, verified its tool surface, and run a live exercise — before they know the vocabulary for any of it. Module 0 gives them the vocabulary; this setup gives them the concrete thing the vocabulary names.

Do not start Module 0 on a dead stack. The rule is explicit: if list_exercises or list_components fails, surface the failure and stop. The course is built around a live artifact, and every module’s learning depends on it.

Stack components

Two things need to be in place before Module 0:

@runsnative/mcp-server (runsnative/packages/mcp-server/) — the queryable MCP server that is this course’s single live artifact. It exposes 12 tools covering RunsNative component docs, design exercises, theme inference, and more. The content is fetched from the cloud API automatically — no repository clone is required for a standard install. The server is published to npm and installable with one npx block. (If you are working inside the RunsNative repository itself, use the project-scoped .mcp.json at the repo root instead — it points at a local build and sets RUNSNATIVE_CONTENT_ROOT to your working tree.)

The RunsNative authoring skill — served at https://runsnative.org/ai/authoring-skill. Used lightly in Part 1 and more actively in Part 2. Its posture — query the server, don’t memorize — is the discipline both parts teach. Load it in your agent host via the “Add custom skill” dialog or as a system prompt reference alongside the MCP server.

Setup steps

Step 1 — Add the server to your MCP client config

Add the following block to your agent’s MCP configuration. The location depends on your host:

{
  "mcpServers": {
    "runsnative": {
      "command": "npx",
      "args": ["-y", "@runsnative/mcp-server"]
    }
  }
}

This block is lifted from runsnative/packages/mcp-server/README.md §Quick install. Omitting RUNSNATIVE_CONTENT_ROOT is correct for the standard (cloud-content) install — the server detects that no local content root is set and falls back to the cloud API automatically (runsnative/packages/mcp-server/src/index.ts, createProvider() fallback).

After editing, restart your agent session so the host picks up the new configuration.

Step 2 — Verify the stack

Ask your agent to run both of these tools:

If either returns an error or empty result, do not proceed. Surface the failure and resolve it before starting Module 0. Every module in Part 1 builds on a connected, responsive server; a dead stack turns the labs into read-only exercises and eliminates the verification discipline that makes the learning stick.

The operational runbook at mukadra/docs/operations/mcp-server-build-and-install-runbook.md covers every class of connection failure: wrong config file, clobber race with the desktop app, env not inlined, and more. Read §0 (“A working MCP server and a registered MCP server are two different problems”) first.

Step 3 — Run the smoke exercise

Ask your agent to call start_exercise with the name vibe-with-runsnative. This is the 5-minute beginner exercise: install the MCP, watch the agent compose RunsNative components from your first open-ended prompt. The exercise is guided and step-gated — the server tracks your progress; you follow its steps.

You know the stack is ready when: the exercise returns a step list and you complete the first step without error. You are now running the same npm-published, cloud-content-backed server that production RunsNative authoring sessions use. The course never drops you into a toy echo server.

Production posture

The course artifact is a production server from minute one. “Your agent talks to a published production server” is not aspirational framing — @runsnative/mcp-server is the server RunsNative authors use in real sessions. Every lab in Part 1 runs against it. This means:

The authoring skill at https://runsnative.org/ai/authoring-skill is also production — it is the live skill that advises agent sessions on RunsNative authoring. Load it now, but you will lean on it more heavily once Part 2 begins.

What’s next

Once list_exercises and list_components are both returning live data and you have completed vibe-with-runsnative, you are ready for Module 0. That module will name every layer you just crossed — you already did the integration; Module 0 gives you the vocabulary to describe it.