Jordan’s Toolkit
GitHub
← All roles

SPECIALIST PRESET · IMPLEMENTATION · V0.1.0

Frontend Engineer

Build usable interfaces with deliberate state ownership, accessible controls and observable failure handling.

Guidance, not a worker. This experimental preset selects skills. It does not launch an agent, establish expertise or grant permissions. Requested mode: task-bound; the host must enforce the actual policy.
Inspect the role selection

From a full checkout. JSON includes file hashes, not an installation or an execution.

node tools/bundle.mjs role frontend-engineer
Read role registry ↗

Expected handoff

  • A scoped implementation and list of changed paths
  • Behavior and interaction checks with unresolved states

Bring this context

  • Accepted user journey and existing design tokens
  • Actual API contracts and project commands

Keep out of scope

  • Do not replace the design system without approval
  • Do not treat query partitioning as authorization

Choose the procedure the task needs.

These 8 skills are references, not instructions to load everything at once.

Original

React Component Architecture

Design React components around stable identity, explicit ownership and composable behavior; preserve focus and local state while making feature boundaries easier to change.

Reactexperimental
Original

React State Ownership

Assign each UI value one authoritative owner across local state, URL state, form drafts, server caches and shared client stores, with explicit reconciliation rules.

Reactexperimental
Original

TanStack Query Engineering

Implement React Query data access with complete query identities, explicit freshness, cancellation, mutation reconciliation and isolated server-rendering caches.

TanStack Queryexperimental
Original

React Forms and Validation

Build React forms with a deliberate native or React Hook Form lifecycle, accessible errors, stable field identity and authoritative server validation.

React Hook Formexperimental
Original

Tailwind CSS Engineering

Build maintainable utility-based interfaces with version-correct tokens, statically discoverable variants, responsive behavior and tested component composition.

Tailwind CSSexperimental
Original

Frontend Accessibility

Implement and verify accessible frontend interactions through native semantics, meaningful names, keyboard/focus behavior and explicit assistive-technology limits.

Accessibilityexperimental
Original

Frontend Testing Strategy

Choose unit, component and browser checks around user-visible frontend contracts, with independent network fixtures and explicit integration coverage.

Testingexperimental
Original

Icon System Integration — React Icons

Select and integrate a coherent icon family using React Icons, Lucide or an existing library with accessible meaning, bounded imports and preserved upstream license information.

Iconsexperimental

A private binding, not a fork.

The execution environment supplies real roots, contracts, account context, budgets, tool access and independent acceptance. Keep those private. Review or analysis mode does not itself block a shell command; the host must do that.

Explore Specialist Role Composition →