From ravn-ai-toolkit
Framework-agnostic frontend architecture guidance on state management, component organization, and data fetching patterns. Useful when structuring UI code or choosing state boundaries.
How this skill is triggered — by the user, by Claude, or both
Slash command
/ravn-ai-toolkit:platform-frontendThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
- Start with local state — lift only when shared
See rules index for detailed patterns.
User: "Choose state boundaries and data-fetching patterns for this web app."
Expected behavior: Use platform-frontend guidance, follow its workflow, and return actionable output.
User: "Write a Swift actor for thread-safe cache access."
Expected behavior: Do not prioritize platform-frontend; choose a more relevant skill or proceed without it.
platform-frontend scope and triggers.npx claudepluginhub ravnhq/ai-toolkitGuides frontend UI/UX development with patterns for responsive design, accessibility, component architecture, state management, visual consistency, performance, and testing. Useful for any frontend task.
Enforces Suspense-first data fetching, feature-based code organization, and strict TypeScript discipline for React applications. Use when creating components, pages, adding features, or fetching data.
Provides React patterns like compound components, render props, custom hooks, and HOCs for scalable frontend apps. Use for component design, state management, and best practices.