Skip to content
Agent Orchestration
Skill

/development

Required context for all frontend work. Loads frontend standards (conventions, React Query patterns, adapter testing requirements) before any code changes. Use when modifying anything under components/frontend/. Triggers on: any frontend code change, UI component work, React

BOOST
From plugin
platform
13121 skills6 agents11 commands3 MCP
Install
$ npx -y skills add ambient-code/platform --skill development --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/development

Context preview

The summary Claude sees to decide when to auto-load this skill.

Required context for all frontend work. Loads frontend standards (conventions, React Query patterns, adapter testing requirements) before any code changes. Use when modifying anything under components/frontend/. Triggers on: any frontend code change, UI component work, React

SKILL.md

development.SKILL.md
name: frontend-development
description: >
  Required context for all frontend work. Loads frontend standards
  (conventions, React Query patterns, adapter testing requirements)
  before any code changes. Use when modifying anything under
  components/frontend/. Triggers on: any frontend code change,
  UI component work, React Query hooks, API adapter work, frontend
  bug fix, frontend refactor.

Frontend Development

Before writing or changing any frontend code, load the project's frontend standards. These are non-negotiable constraints — not suggestions.

User Input

$ARGUMENTS

Required Reading

Read all files in `specs/standards/frontend/` before proceeding:

ls specs/standards/frontend/

At minimum, this includes:

1. `specs/standards/frontend/conventions.spec.md` — zero-tolerance rules (no `any`, Shadcn only, React Query for all data, `type` over `interface`, colocated components, feature flags) 2. `specs/standards/frontend/react-query.spec.md` — file structure (ports/adapters/queries), data fetching patterns, testing requirements, validation checklist

Also read the API adapter spec if working on the services layer:

3. `specs/frontend/api-adapter.spec.md` — port interface contract, canonical types, 30 API domains, testability requirements

Key Constraints

These apply to every frontend change, no exceptions:

  • **Zero `any` types.** Use proper types or `unknown`.
  • **Shadcn UI components only.** No custom buttons, inputs, dialogs.
  • **React Query for all data fetching.** No manual `fetch()` in components.
  • **`type` over `interface`.** Always.
  • **All adapters must be tested.** No adapter merged without unit tests using recorded responses.
  • **All hooks must be tested.** Hook tests use mock adapters, not real backends.
  • **Port interfaces, not raw API calls.** React Query hooks consume ports, not `services/api/` directly.

After Reading

Confirm you have loaded the standards, then proceed with the task. If any of your changes would violate these constraints, stop and discuss with the user before writing code.

Read more
Ships withplatform

Kubernetes-native AI automation platform for intelligent agentic sessions

Get the whole plugin

Other skills on platform.