{
  "schemaVersion": "1.0",
  "item": {
    "slug": "full-stack-feature",
    "name": "Full Stack Feature",
    "source": "tencent",
    "type": "skill",
    "category": "开发工具",
    "sourceUrl": "https://clawhub.ai/wpank/full-stack-feature",
    "canonicalUrl": "https://clawhub.ai/wpank/full-stack-feature",
    "targetPlatform": "OpenClaw"
  },
  "install": {
    "downloadMode": "redirect",
    "downloadUrl": "/downloads/full-stack-feature",
    "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=full-stack-feature",
    "sourcePlatform": "tencent",
    "targetPlatform": "OpenClaw",
    "installMethod": "Manual import",
    "extraction": "Extract archive",
    "prerequisites": [
      "OpenClaw"
    ],
    "packageFormat": "ZIP package",
    "includedAssets": [
      "README.md",
      "SKILL.md"
    ],
    "primaryDoc": "SKILL.md",
    "quickSetup": [
      "Download the package from Yavira.",
      "Extract the archive and review SKILL.md first.",
      "Import or place the package into your OpenClaw setup."
    ],
    "agentAssist": {
      "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
      "steps": [
        "Download the package from Yavira.",
        "Extract it into a folder your agent can access.",
        "Paste one of the prompts below and point your agent at the extracted folder."
      ],
      "prompts": [
        {
          "label": "New install",
          "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Then review README.md for any prerequisites, environment setup, or post-install checks. Tell me what you changed and call out any manual steps you could not complete."
        },
        {
          "label": "Upgrade existing",
          "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Then review README.md for any prerequisites, environment setup, or post-install checks. Summarize what changed and any follow-up checks I should run."
        }
      ]
    },
    "sourceHealth": {
      "source": "tencent",
      "slug": "full-stack-feature",
      "status": "healthy",
      "reason": "direct_download_ok",
      "recommendedAction": "download",
      "checkedAt": "2026-05-03T11:42:29.014Z",
      "expiresAt": "2026-05-10T11:42:29.014Z",
      "httpStatus": 200,
      "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=full-stack-feature",
      "contentType": "application/zip",
      "probeMethod": "head",
      "details": {
        "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=full-stack-feature",
        "contentDisposition": "attachment; filename=\"full-stack-feature-1.0.0.zip\"",
        "redirectLocation": null,
        "bodySnippet": null,
        "slug": "full-stack-feature"
      },
      "scope": "item",
      "summary": "Item download looks usable.",
      "detail": "Yavira can redirect you to the upstream package for this item.",
      "primaryActionLabel": "Download for OpenClaw",
      "primaryActionHref": "/downloads/full-stack-feature"
    },
    "validation": {
      "installChecklist": [
        "Use the Yavira download entry.",
        "Review SKILL.md after the package is downloaded.",
        "Confirm the extracted package contains the expected setup assets."
      ],
      "postInstallChecks": [
        "Confirm the extracted package includes the expected docs or setup files.",
        "Validate the skill or prompts are available in your target agent workspace.",
        "Capture any manual follow-up steps the agent could not complete."
      ]
    },
    "downloadPageUrl": "https://openagent3.xyz/downloads/full-stack-feature",
    "agentPageUrl": "https://openagent3.xyz/skills/full-stack-feature/agent",
    "manifestUrl": "https://openagent3.xyz/skills/full-stack-feature/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/full-stack-feature/agent.md"
  },
  "agentAssist": {
    "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
    "steps": [
      "Download the package from Yavira.",
      "Extract it into a folder your agent can access.",
      "Paste one of the prompts below and point your agent at the extracted folder."
    ],
    "prompts": [
      {
        "label": "New install",
        "body": "I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Then review README.md for any prerequisites, environment setup, or post-install checks. Tell me what you changed and call out any manual steps you could not complete."
      },
      {
        "label": "Upgrade existing",
        "body": "I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Then review README.md for any prerequisites, environment setup, or post-install checks. Summarize what changed and any follow-up checks I should run."
      }
    ]
  },
  "documentation": {
    "source": "clawhub",
    "primaryDoc": "SKILL.md",
    "sections": [
      {
        "title": "Full-Stack Feature Orchestration (Meta-Skill)",
        "body": "Coordinate the entire lifecycle of a feature — from understanding who it's for, through design, implementation, testing, and documentation. This meta-skill routes to the right skill, command, or agent at each stage and enforces stage gates so nothing ships half-baked."
      },
      {
        "title": "OpenClaw / Moltbot / Clawbot",
        "body": "npx clawhub@latest install full-stack-feature"
      },
      {
        "title": "When to Use",
        "body": "Building a new feature end-to-end — you need the full pipeline from research to production\nFrontend + backend work together — the feature spans UI, API, and data layers\nUser research should inform implementation — you want personas and specs before writing code\nCoordinating multiple skills — you're unsure which skill or command to invoke at each step\nOnboarding a new feature area — you need a structured approach, not ad hoc implementation\nTeaching a junior developer — walk through the complete feature development process"
      },
      {
        "title": "Orchestration Flow",
        "body": "Every feature moves through eight stages. Small features skip stages (see Complexity Assessment below); large features complete all of them.\n\n1. Persona Research\n        ↓\n 2. Feature Specification\n        ↓\n 3. UX/UI Design\n        ↓\n 4. API Design\n        ↓\n 5. Frontend Implementation\n        ↓\n 6. Backend Implementation\n        ↓\n 7. Testing\n        ↓\n 8. Documentation"
      },
      {
        "title": "Stage 1 — Persona Research",
        "body": "Understand who the feature is for before designing anything. Define the target user, their goals, pain points, and the journey this feature supports.\n\nInvoke: /create-persona command → ai/commands/docs/create-persona.md\nSkill: persona-docs → ai/skills/writing/persona-docs/SKILL.md\n\nOutput: Persona document describing the target user, their context, and success criteria for this feature."
      },
      {
        "title": "Stage 2 — Feature Specification",
        "body": "Translate persona insights into a concrete feature spec — scope, acceptance criteria, edge cases, and technical constraints.\n\nInvoke: feature-specification skill → ai/skills/meta/feature-specification/SKILL.md\n\nOutput: Feature spec with user stories, acceptance criteria, out-of-scope items, and technical notes."
      },
      {
        "title": "Stage 3 — UX/UI Design",
        "body": "Design the interface informed by the persona and spec. Choose the right visual style, layout, and interaction patterns.\n\nOutput: Component hierarchy, layout decisions, style selections, and responsive behavior plan."
      },
      {
        "title": "Stage 4 — API Design",
        "body": "Define the contract between frontend and backend. Design endpoints, request/response shapes, error codes, and authentication requirements.\n\nCommand: /create-api-route → ai/commands/development/create-api-route.md\n\nOutput: API contract (OpenAPI spec or typed route definitions) with validation rules and error handling."
      },
      {
        "title": "Stage 5 — Frontend Implementation",
        "body": "Build the UI components, pages, and client-side logic. Use the appropriate framework skill for the project's stack.\n\nCommand: /create-component → ai/commands/development/create-component.md\n\nOutput: Working UI components wired to the API contract, with loading/error states and responsive layout."
      },
      {
        "title": "Stage 6 — Backend Implementation",
        "body": "Build the API routes, business logic, data access layer, and background jobs.\n\nCommand: /new-feature → ai/commands/development/new-feature.md\n\nOutput: Implemented API routes, data models, migrations, and business logic passing unit tests."
      },
      {
        "title": "Stage 7 — Testing",
        "body": "Validate the feature across unit, integration, and end-to-end layers. Verify acceptance criteria from Stage 2.\n\nCommand: /test-feature → ai/commands/development/test-feature.md\n\nOutput: Passing test suite covering happy paths, edge cases, and error scenarios from the spec."
      },
      {
        "title": "Stage 8 — Documentation",
        "body": "Generate user-facing docs, API references, and internal technical documentation.\n\nCommand: /generate-docs → ai/commands/documentation/generate-docs.md\n\nOutput: Updated README, API docs, component storybook entries, and changelog."
      },
      {
        "title": "Skill Routing Table",
        "body": "StagePrimary SkillCommandAgent1. Persona Researchpersona-docs/create-persona—2. Feature Specfeature-specification——3. UX/UI DesignUI/UX skill——4. API Designapi-design-principles/create-api-routeai/agents/api/5. FrontendFramework skill (Next.js, React, etc.)/create-component—6. Backendapi-development, database-migration-patterns/new-featureai/agents/migration/7. Testingtesting-workflow, e2e-testing-patterns/test-featureai/agents/testing/8. Documentation—/generate-docs—"
      },
      {
        "title": "Stage Gate Checks",
        "body": "Each stage must pass its gate before proceeding. Gates prevent wasted work by catching gaps early.\n\nGateRequired BeforeCriteriaBlocking?Persona definedStage 2Target user identified with goals and pain pointsYesSpec approvedStage 3Acceptance criteria written, scope defined, edge cases listedYesDesign reviewedStage 4Component hierarchy defined, responsive plan in placeYesAPI contract lockedStage 5 + 6Endpoints defined, request/response types agreed, error codes setYesFrontend rendersStage 6UI components display with mock data, loading/error states workNo (parallel OK)Backend passes testsStage 7All API routes return expected responses, validations enforcedYesTests passStage 8Unit + integration + E2E tests green, acceptance criteria verifiedYesDocs completeDeployAPI documented, user-facing docs updated, changelog entry addedYes"
      },
      {
        "title": "Vertical Slice Strategy",
        "body": "Start with the thinnest possible end-to-end slice, then widen.\n\nPhase 1 — Thin Slice\nBuild one happy path through all layers: a single user action from UI click to database write and back. This proves the architecture works and gives stakeholders something to demo.\n\nExample: \"User can create a new project\"\n  UI:      One form with a name field and submit button\n  API:     POST /api/projects { name: string }\n  DB:      INSERT INTO projects (name) VALUES ($1)\n  Test:    E2E test: fill form → submit → see project in list\n\nPhase 2 — Widen\nAdd validation, error handling, edge cases, and secondary flows. Each addition follows the same vertical path — never build an entire layer in isolation.\n\nPhase 3 — Polish\nLoading states, optimistic updates, animations, accessibility, performance optimization, and comprehensive error messages."
      },
      {
        "title": "Complexity Assessment",
        "body": "Not every feature needs all eight stages. Use this table to determine which stages to include.\n\nFeature SizeExamplesStages to IncludeEstimated TimeTrivialRename a label, fix copy, adjust spacing5 only< 1 hourSmallAdd a filter, new form field, simple toggle4 → 5 → 6 → 72-4 hoursMediumNew CRUD entity, dashboard widget, search feature2 → 3 → 4 → 5 → 6 → 71-3 daysLargeNew user-facing feature area, multi-page flowAll 8 stages1-2 weeksEpicNew product vertical, major redesign, platform migrationAll 8 + ADR + phased rollout2-6 weeks"
      },
      {
        "title": "How to Assess Complexity",
        "body": "Count the layers touched — UI only (trivial), UI + API (small), UI + API + DB (medium+)\nCount the user flows — one path (small), 2-3 paths (medium), many paths with branching (large)\nCheck for unknowns — known patterns (smaller), new integrations or unfamiliar tech (bump up one size)\nConsider blast radius — isolated change (smaller), cross-cutting concern (bump up one size)"
      },
      {
        "title": "Frontend and Backend in Parallel",
        "body": "Once the API contract is locked (Stage 4 gate), frontend and backend can proceed simultaneously:\n\nFrontend uses mock data matching the API contract types\nBackend implements against the same contract with unit tests\nIntegration happens when both sides are ready — contract guarantees compatibility"
      },
      {
        "title": "Handoff Points",
        "body": "Use the /handoff-and-resume command when:\n\nSwitching between frontend and backend work\nPausing mid-feature and resuming later\nPassing work to another developer or agent"
      },
      {
        "title": "Progress Tracking",
        "body": "Use the /progress command to check which stage you're in and what remains."
      },
      {
        "title": "NEVER Do",
        "body": "NEVER skip persona research for user-facing features — building without understanding the user leads to features nobody wants\nNEVER start coding before the API contract is defined — frontend and backend will diverge, causing costly rework at integration\nNEVER build an entire layer before connecting it end-to-end — always use vertical slices to prove the architecture first\nNEVER skip stage gates to move faster — gates exist to catch problems when they're cheap to fix, not after they've compounded\nNEVER treat testing as a separate phase you can cut — tests are part of implementation, not an afterthought bolted on at the end\nNEVER ship without documentation — undocumented features become maintenance burdens that slow down every future change"
      }
    ],
    "body": "Full-Stack Feature Orchestration (Meta-Skill)\n\nCoordinate the entire lifecycle of a feature — from understanding who it's for, through design, implementation, testing, and documentation. This meta-skill routes to the right skill, command, or agent at each stage and enforces stage gates so nothing ships half-baked.\n\nInstallation\nOpenClaw / Moltbot / Clawbot\nnpx clawhub@latest install full-stack-feature\n\nWhen to Use\nBuilding a new feature end-to-end — you need the full pipeline from research to production\nFrontend + backend work together — the feature spans UI, API, and data layers\nUser research should inform implementation — you want personas and specs before writing code\nCoordinating multiple skills — you're unsure which skill or command to invoke at each step\nOnboarding a new feature area — you need a structured approach, not ad hoc implementation\nTeaching a junior developer — walk through the complete feature development process\nOrchestration Flow\n\nEvery feature moves through eight stages. Small features skip stages (see Complexity Assessment below); large features complete all of them.\n\n 1. Persona Research\n        ↓\n 2. Feature Specification\n        ↓\n 3. UX/UI Design\n        ↓\n 4. API Design\n        ↓\n 5. Frontend Implementation\n        ↓\n 6. Backend Implementation\n        ↓\n 7. Testing\n        ↓\n 8. Documentation\n\nStage Details\nStage 1 — Persona Research\n\nUnderstand who the feature is for before designing anything. Define the target user, their goals, pain points, and the journey this feature supports.\n\nInvoke: /create-persona command → ai/commands/docs/create-persona.md Skill: persona-docs → ai/skills/writing/persona-docs/SKILL.md\n\nOutput: Persona document describing the target user, their context, and success criteria for this feature.\n\nStage 2 — Feature Specification\n\nTranslate persona insights into a concrete feature spec — scope, acceptance criteria, edge cases, and technical constraints.\n\nInvoke: feature-specification skill → ai/skills/meta/feature-specification/SKILL.md\n\nOutput: Feature spec with user stories, acceptance criteria, out-of-scope items, and technical notes.\n\nStage 3 — UX/UI Design\n\nDesign the interface informed by the persona and spec. Choose the right visual style, layout, and interaction patterns.\n\nOutput: Component hierarchy, layout decisions, style selections, and responsive behavior plan.\n\nStage 4 — API Design\n\nDefine the contract between frontend and backend. Design endpoints, request/response shapes, error codes, and authentication requirements.\n\nCommand: /create-api-route → ai/commands/development/create-api-route.md\n\nOutput: API contract (OpenAPI spec or typed route definitions) with validation rules and error handling.\n\nStage 5 — Frontend Implementation\n\nBuild the UI components, pages, and client-side logic. Use the appropriate framework skill for the project's stack.\n\nCommand: /create-component → ai/commands/development/create-component.md\n\nOutput: Working UI components wired to the API contract, with loading/error states and responsive layout.\n\nStage 6 — Backend Implementation\n\nBuild the API routes, business logic, data access layer, and background jobs.\n\nCommand: /new-feature → ai/commands/development/new-feature.md\n\nOutput: Implemented API routes, data models, migrations, and business logic passing unit tests.\n\nStage 7 — Testing\n\nValidate the feature across unit, integration, and end-to-end layers. Verify acceptance criteria from Stage 2.\n\nCommand: /test-feature → ai/commands/development/test-feature.md\n\nOutput: Passing test suite covering happy paths, edge cases, and error scenarios from the spec.\n\nStage 8 — Documentation\n\nGenerate user-facing docs, API references, and internal technical documentation.\n\nCommand: /generate-docs → ai/commands/documentation/generate-docs.md\n\nOutput: Updated README, API docs, component storybook entries, and changelog.\n\nSkill Routing Table\nStage\tPrimary Skill\tCommand\tAgent\n1. Persona Research\tpersona-docs\t/create-persona\t—\n2. Feature Spec\tfeature-specification\t—\t—\n3. UX/UI Design\tUI/UX skill\t—\t—\n4. API Design\tapi-design-principles\t/create-api-route\tai/agents/api/\n5. Frontend\tFramework skill (Next.js, React, etc.)\t/create-component\t—\n6. Backend\tapi-development, database-migration-patterns\t/new-feature\tai/agents/migration/\n7. Testing\ttesting-workflow, e2e-testing-patterns\t/test-feature\tai/agents/testing/\n8. Documentation\t—\t/generate-docs\t—\nStage Gate Checks\n\nEach stage must pass its gate before proceeding. Gates prevent wasted work by catching gaps early.\n\nGate\tRequired Before\tCriteria\tBlocking?\nPersona defined\tStage 2\tTarget user identified with goals and pain points\tYes\nSpec approved\tStage 3\tAcceptance criteria written, scope defined, edge cases listed\tYes\nDesign reviewed\tStage 4\tComponent hierarchy defined, responsive plan in place\tYes\nAPI contract locked\tStage 5 + 6\tEndpoints defined, request/response types agreed, error codes set\tYes\nFrontend renders\tStage 6\tUI components display with mock data, loading/error states work\tNo (parallel OK)\nBackend passes tests\tStage 7\tAll API routes return expected responses, validations enforced\tYes\nTests pass\tStage 8\tUnit + integration + E2E tests green, acceptance criteria verified\tYes\nDocs complete\tDeploy\tAPI documented, user-facing docs updated, changelog entry added\tYes\nVertical Slice Strategy\n\nStart with the thinnest possible end-to-end slice, then widen.\n\nPhase 1 — Thin Slice Build one happy path through all layers: a single user action from UI click to database write and back. This proves the architecture works and gives stakeholders something to demo.\n\nExample: \"User can create a new project\"\n  UI:      One form with a name field and submit button\n  API:     POST /api/projects { name: string }\n  DB:      INSERT INTO projects (name) VALUES ($1)\n  Test:    E2E test: fill form → submit → see project in list\n\n\nPhase 2 — Widen Add validation, error handling, edge cases, and secondary flows. Each addition follows the same vertical path — never build an entire layer in isolation.\n\nPhase 3 — Polish Loading states, optimistic updates, animations, accessibility, performance optimization, and comprehensive error messages.\n\nComplexity Assessment\n\nNot every feature needs all eight stages. Use this table to determine which stages to include.\n\nFeature Size\tExamples\tStages to Include\tEstimated Time\nTrivial\tRename a label, fix copy, adjust spacing\t5 only\t< 1 hour\nSmall\tAdd a filter, new form field, simple toggle\t4 → 5 → 6 → 7\t2-4 hours\nMedium\tNew CRUD entity, dashboard widget, search feature\t2 → 3 → 4 → 5 → 6 → 7\t1-3 days\nLarge\tNew user-facing feature area, multi-page flow\tAll 8 stages\t1-2 weeks\nEpic\tNew product vertical, major redesign, platform migration\tAll 8 + ADR + phased rollout\t2-6 weeks\nHow to Assess Complexity\nCount the layers touched — UI only (trivial), UI + API (small), UI + API + DB (medium+)\nCount the user flows — one path (small), 2-3 paths (medium), many paths with branching (large)\nCheck for unknowns — known patterns (smaller), new integrations or unfamiliar tech (bump up one size)\nConsider blast radius — isolated change (smaller), cross-cutting concern (bump up one size)\nCoordination Patterns\nFrontend and Backend in Parallel\n\nOnce the API contract is locked (Stage 4 gate), frontend and backend can proceed simultaneously:\n\nFrontend uses mock data matching the API contract types\nBackend implements against the same contract with unit tests\nIntegration happens when both sides are ready — contract guarantees compatibility\nHandoff Points\n\nUse the /handoff-and-resume command when:\n\nSwitching between frontend and backend work\nPausing mid-feature and resuming later\nPassing work to another developer or agent\nProgress Tracking\n\nUse the /progress command to check which stage you're in and what remains.\n\nNEVER Do\nNEVER skip persona research for user-facing features — building without understanding the user leads to features nobody wants\nNEVER start coding before the API contract is defined — frontend and backend will diverge, causing costly rework at integration\nNEVER build an entire layer before connecting it end-to-end — always use vertical slices to prove the architecture first\nNEVER skip stage gates to move faster — gates exist to catch problems when they're cheap to fix, not after they've compounded\nNEVER treat testing as a separate phase you can cut — tests are part of implementation, not an afterthought bolted on at the end\nNEVER ship without documentation — undocumented features become maintenance burdens that slow down every future change"
  },
  "trust": {
    "sourceLabel": "tencent",
    "provenanceUrl": "https://clawhub.ai/wpank/full-stack-feature",
    "publisherUrl": "https://clawhub.ai/wpank/full-stack-feature",
    "owner": "wpank",
    "version": "1.0.0",
    "license": null,
    "verificationStatus": "Indexed source record"
  },
  "links": {
    "detailUrl": "https://openagent3.xyz/skills/full-stack-feature",
    "downloadUrl": "https://openagent3.xyz/downloads/full-stack-feature",
    "agentUrl": "https://openagent3.xyz/skills/full-stack-feature/agent",
    "manifestUrl": "https://openagent3.xyz/skills/full-stack-feature/agent.json",
    "briefUrl": "https://openagent3.xyz/skills/full-stack-feature/agent.md"
  }
}