Skip to main content

APIMatic Portal Skill

The apimatic-portal skill turns your AI coding assistant into a guided portal builder. Describe what you want, and the agent runs the APIMatic CLI, scaffolds your project, edits configuration files, and starts a local development server, all from within Claude Code, Cursor, or Codex.

Think of it as an AI architect for your developer portal: one conversation from OpenAPI spec to running portal.

What the skill does

Once active, the skill walks the agent through every part of building an APIMatic Docs as Code portal:

AreaWhat the skill covers
AuthenticationBrowser-based login, API key fallback, CI-friendly auth with environment variables
Project scaffoldingFirst-time setup wizard, subsequent local development, build directory structure
Local developmentStarting the development server, checking server status, stopping a running server, port conflict handling
ThemingColors, fonts, logo, favicon, header and footer customization
NavigationSite structure, nav groups, versioned portals
API CopilotConfiguring the in-portal AI assistant, tuning its behavior
LLMs.txt and SEOGenerating llms.txt files and configuring SEO metadata
Custom pages and recipesAdding guides, custom landing pages, and API recipes (Arazzo workflows)
Context pluginsWiring up context plugins for Cursor and other coding assistants
Dynamic configurationsEnvironment-aware portal configurations
CI/CD buildsapimatic portal generate for production builds in pipelines

When the agent invokes this skill

The agent automatically activates apimatic-portal when you ask about:

  • Creating, serving, or deploying an APIMatic developer portal
  • Configuring portal theme, navigation, or branding
  • Setting up API Copilot, LLMs.txt, or SEO
  • Adding custom pages, guides, or API recipes
  • Configuring context plugins, header/footer, or dynamic configurations
  • Working with an existing src/APIMATIC-BUILD.json file

The skill covers only the Docs as Code portals built with the @apimatic/cli toolchain.

Use the skill

Once installed, open your project in Claude Code, Cursor, or Codex, and describe what you want. The agent picks up the skill automatically.

Example prompts

Starting from scratch:

"I have an OpenAPI spec at ./spec.yaml. Set up an APIMatic developer portal for it and start a local development server."

Customizing theme:

"Change my portal's primary color to #1E40AF and set the header logo to ./logo.svg."

Adding API Copilot:

"Configure API Copilot in my APIMatic portal so developers can ask questions in natural language."

Configuring recipes:

"Add an API recipe called 'Create and Pay an Invoice' that walks through the three-step payment workflow."

Setting up CI:

"Generate a GitHub Actions workflow that builds my APIMatic portal on every push and deploys the output to GitHub Pages."

What happens under the hood

For a typical first-time setup, the agent:

  1. Verifies you have the APIMatic CLI installed.
  2. Runs browser-based authentication (with an API key fallback).
  3. Asks for your API spec location.
  4. Scaffolds the project with apimatic portal quickstart.
  5. Starts the local development server with live output.
  6. Surfaces the local URL (for example, http://localhost:3000).

After the initial setup, follow-up requests (theming, navigation changes, adding recipes) edit the right configuration files and restart the server when needed.

Troubleshooting

Authentication fails

Check that your APIMatic account is active and your API key is correct. If browser login doesn't work, ask the agent to use the API key fallback:

export APIMATIC_API_KEY=YOUR_API_KEY

Port conflict when starting the server

The skill retries on the next port up to three times (3000 → 3001 → 3002). If all three are taken, free a port or ask the agent to retry with --port=NNNN.