frontend-delivery

Phase 8: deliver the accessible frontend journey against the agreed server contract and complete state model.

SKILL.md

GitHub
<!-- Generated by mstack from Misbah's Build Like This workflow. Regenerate instead of editing. -->

frontend-delivery

This skill is part of Misbah Khursheed's Build Like This workflow. Thinking, evidence, and explicit trade-offs come before generated output.

Project identity and sources of truth

The repository where this skill is installed is the host project being built. Build Like This is the method used to build it; mstack only installs and reconciles method resources. Do not assume mstack or Build Like This is the product unless project-owned sources explicitly identify this repository as mstack itself.

Use project-owned docs/, decisions, executable code, and tests as sources of truth. .mstack/templates/ are reference scaffolds to copy and adapt into project-owned documents, not product requirements and not a replacement for docs/.

Purpose

Implement the designed user journey after backend contracts are stable or faithfully mocked. This owns browser behavior and integration; it does not redefine server-owned policy or generic cross-stack scope.

Required inputs

  • Approved journey/prototype, content, state model, accessibility target, responsive/device requirements, and acceptance criteria.
  • Typed backend contract or faithful mock with authentication, authorization, validation, errors, pagination, and degraded behavior.
  • Existing design system, frontend architecture, browser support, performance budgets, tests, and rollout constraints.

If a missing input would materially change the result, state the gap and obtain or discover it before proceeding. Otherwise label the assumption and continue.

Process

  1. Have the frontend engineer lead; delegate design/accessibility, independent journey testing, and performance review as bounded lanes.
  2. Trace the complete journey and separate server state, form state, URL state, and local presentation state before components.
  3. Implement semantic, keyboard-accessible, responsive behavior for loading, empty, success, validation, denial, degraded, failure, and recovery states.
  4. Integrate only against the agreed contract; surface contract conflicts rather than duplicating server policy or silently reshaping payloads.
  5. Verify focus, screen-reader semantics, contrast, reduced motion, slow/offline/dependency behavior, performance, and critical cross-browser journeys.
  6. Run focused and package-level type, lint, test, and production-build checks; record contract assumptions and release handoff.

Output contract

  • A complete accessible frontend journey with deliberate state ownership and faithful server integration.
  • Component/integration/end-to-end, accessibility, degraded-network, and performance verification evidence.
  • Contract discrepancies, browser/device limitations, rollout implications, and residual risks.

Guardrails

  • Do not make client code the source of truth for permissions, critical state, pricing, or business invariants.
  • Do not omit non-happy-path states or replace semantic platform behavior with inaccessible custom controls.
  • Do not add animation unless it improves comprehension and respects reduced-motion preferences.

Delegation and parallel safety

  • Material lifecycle work must delegate at least one bounded specialist lane when subagents are available. Prefer two or more concurrent lanes only for independent evidence gathering, analysis, or non-overlapping file ownership.
  • The active lead owns integration and acceptance. Supporting agents do not recursively delegate unless explicitly promoted to lead a named lane.
  • Assign distinct outputs and ownership. Serialize shared docs, contracts, schemas, migrations, deployments, external writes, and overlapping file edits.
  • When subagents are unavailable, perform the same named specialist passes sequentially and state that constraint instead of implying parallel verification.
  • Delegation never grants permission for outreach, consequential external actions, destructive changes, paid resources, or production operations.

End with the evidence gathered, verification performed, and any residual risk or unresolved decision.