Web & Frontend

fandhe-ai-agent-reference-skil Bundle

Storybook (UI コンポーネントカタログ・テストツール) リファレンス。 story, CSF (Component Story Format)、args, argTypes, decorators、 play function、interaction tests、autodocs、 main.ts / preview.ts 設定、アドオン (a11y, controls, viewport, themes)。

fandhe-ai-agent-reference-skil Bundle

Theatre.js アニメーションツールキットリファレンス。 @theatre/core / @theatre/studio / @theatre/r3f / @theatre/dataverse。 getProject, Sheet, Sequence, Object, val, onChange, prop-types（number / rgba / compound / image）。 studio initialize / extend / transaction / scrub / createPane。 SheetProvider, editable, useCurrentSheet, useVal, usePrism, useAtom。 keyframe アニメーション、audio sync、state JSON、React Three Fiber 統合。

fandhe-ai-agent-reference-skil Bundle

Next.js App Router 専用 API リファレンス（Pages Router / getStaticProps 等は非対応）。 Server Components, Server Actions, layout/page/loading/error ファイル規約, dynamic routes, parallel/intercepting routes, Metadata API (generateMetadata), use cache, revalidatePath/revalidateTag, next/image・next/font・next/link, cookies/headers, useRouter, next.config.js, proxy（旧 middleware）。 プラットフォーム実行基盤・CDN・ISR インフラは vercel スキル参照。

fandhe-ai-agent-reference-skil Bundle

React Flow (ノードベース UI / フロー図ライブラリ for React) リファレンス。 ReactFlow コンポーネント、Node, Edge, Handle, Viewport、 カスタムノード / エッジ、Controls / MiniMap / Background、 レイアウトアルゴリズム (dagre, elkjs)、ドラッグ&ドロップ、エッジ接続。

fandhe-ai-agent-reference-skil Bundle

Better Auth (TypeScript 認証フレームワーク) リファレンス。 認証・認可、サインアップ・サインイン、セッション管理、OAuth、パスキー、 二要素認証 (TOTP)、プラグイン (organization, admin, magic-link, anonymous 等)。 betterAuth, createAuthClient, signUp, signIn, getSession。 フレームワーク統合 (Next.js, Nuxt, SvelteKit, Hono, Express, Expo, TanStack 等)。

fandhe-ai-agent-reference-skil Bundle

React Router v8 (Framework Mode、旧 Remix) の RR8 リファレンス。 loader, action, middleware, routes.ts、hooks (useLoaderData, useActionData, useFetcher, useNavigate, useNavigation, useParams, useSearchParams)、 コンポーネント (Form, Link, NavLink, Outlet, Route, Routes, Await)、SSR / SPA / Static、 ErrorBoundary, redirect, defer, session, matchPath, matchRoutes, type-safe routing。 TanStack Router (@tanstack/react-router) とは別ライブラリ。

fandhe-ai-agent-reference-skil Bundle

visionOS / iOS 空間コンピューティングリファレンス。RealityKit、ARKit、visionOS SwiftUI API。 Entity, ModelEntity, AnchorEntity, Component, RealityView, MeshResource, Material, System, EntityAction, GaussianSplatComponent, ComputeGraphComponent, PhysicsJointsComponent, ForceEffectComponent, ClothBodyComponent, NavigationComponent, NavigationMeshComponent, NavigationController, ImmersiveSpace, ImmersionStyle, Model3D, WindowGroup, VolumetricWindowStyle, ObjectTrackingProvider, RoomTrackingProvider, ARSession, ARWorldTrackingConfiguration, ARKitSession, WorldTrackingProvider, HandTrackingProvider, SceneReconstructionProvider。

fandhe-ai-agent-reference-skil Bundle

TanStack Query (React Query) v5 (@tanstack/react-query) の API リファレンス。 useQuery, useQueries, useInfiniteQuery, useMutation, useSuspenseQuery, QueryClient, QueryClientProvider, queryOptions, HydrationBoundary, invalidateQueries, prefetchQuery, staleTime, gcTime, placeholderData, optimistic updates, SSR / hydration, persistQueryClient, eslint-plugin-query。 kubb（フック生成側）とは別。

fandhe-ai-agent-reference-skil Bundle

TanStack Table (React Table) v9 ヘッドレステーブル (@tanstack/react-table) の API リファレンス。 ark-ui / chakra-ui のスタイル付き Table とは別。 useTable, tableFeatures, createColumnHelper, flexRender, createCoreRowModel, sorting, column / global / fuzzy filtering, faceting, pagination, row selection, expanding, grouping / aggregation, column / row の ordering・pinning・sizing・visibility, virtualization。 v8 legacy (useReactTable / getCoreRowModel) と v9 移行。

fandhe-ai-agent-reference-skil Bundle

Rust 製フロントエンドフレームワーク fandhe-frontend のリファレンス。 SSR / SPA / SSG / View Transitions 統合、hydration、単一実行ファイル配布。 既定エスケープ・forbid(unsafe_code) の安全設計。 主要クレート core / app / interactive / headless-ui(Primitives) / pre-styled-ui(Themes) / server(SSG generate_pages/generate_assets)（fandhe-frontend- 接頭）。 CLI fw（new / gate / structure / impact）。

fandhe-ai-agent-reference-skil Bundle

React Hook Form v7 (RHF、非制御フォームライブラリ) リファレンス。 別名: rhf, React-Hook-Form。 useForm, register, handleSubmit, watch, setValue, getValues, reset、 Controller (制御コンポーネント連携)、useFieldArray (動的フィールド)、 バリデーション、resolver (Zod / Yup / Joi 連携)、エラーメッセージ、formState。

fandhe-ai-agent-reference-skil Bundle

TanStack Router (型安全 React ルーター、@tanstack/react-router) の API リファレンス。 React Router (react-router) とは別ライブラリ。 createRouter, createFileRoute, createRootRoute, createLazyFileRoute, Link, Outlet, useNavigate, useParams, useSearch, useLoaderData, useBlocker, loader, beforeLoad, validateSearch, redirect, notFound, Await, file-based routing, routeTree.gen.ts, router-plugin, tsr CLI, code splitting, SSR, TanStack Query 統合, eslint-plugin-router。

fandhe-ai-agent-reference-skil Bundle

TanStack Virtual (React 仮想スクロール、@tanstack/react-virtual) の API リファレンス。 useVirtualizer, useWindowVirtualizer, Virtualizer, VirtualItem, estimateSize, measureElement, rangeExtractor, overscan, lanes, getVirtualItems, getTotalSize, scrollToIndex。固定/可変/動的計測、grid、sticky header、infinite scroll、table、 window scroll 仮想化。別名 react-virtual, virtual-core。 react-flow / Compose LazyColumn / WinUI ListView とは別（DOM 向けヘッドレス仮想化）。

fandhe-ai-agent-reference-skil Bundle

Claude Code (code.claude.com) の各サーフェス（Desktop / IDE / Web / モバイル / ターミナル UX）リファレンス。 Desktop app（launch.json, scheduled tasks, WSL, Linux, iOS simulator）、 VS Code / JetBrains / Chrome 拡張連携、claude.ai/code（Web）と mobile アプリ、 interactive mode, fullscreen, voice dictation, accessibility, computer use, artifacts。

nickcrew Skill

Multi-perspective UX review combining usability heuristics, WCAG accessibility checks, and interaction design analysis. Use when reviewing UI components before release, evaluating user flows for usability issues, conducting design critiques, or auditing accessibility compliance.

nickcrew Skill

Use this skill when writing fiction, narrative nonfiction, brand stories, or any content where emotional engagement and narrative arc matter more than pure information delivery. Trigger phrases: 'write a short story', 'tell my brand's origin story', 'write a narrative about', 'create a character'. Do NOT use for purely informational content, technical writing, or persuasive copy without a narrative component.

nickcrew Bundle

User-triggered audit that finds wiring drift between a project's UI surfaces and backend capabilities — orphan surfaces (UI calls endpoints/hooks/procedures that no longer exist), unwired capabilities (backend routes/exports that nothing surfaces), shape drift (both exist but contracts mismatch), method drift (URL matches, HTTP verb does not), validation drift (frontend vs backend rules diverged), permission drift (UI exposes what backend forbids or vice versa), stale labels (UI text references renamed backend concepts), and unsurfaced configuration (env vars or flags that gate behavior with no UI or CLI to control them). This skill should be used when the user asks to "audit our wiring," "find UI/backend drift," "find unwired capabilities," "find stale surfaces," "check for contract violations," "find unused endpoints," "find unused hooks," "what mismatches between UI and backend," or any similar request whose deliverable is a prioritized findings report rather than a descriptive snapshot. Generic across UI

nickcrew Bundle

User-triggered orchestrator that walks the user through running multiple sibling mapping/audit/doc skills against a shared scope, then assembles their outputs into one navigable artifact. Coaches rather than auto-runs — at each step the orchestrator presents the next sibling skill, recommended scope inheritance, and approval gate; the user invokes the sibling and confirms before moving on. Resolves the prior arch-analysis lookup once at suite start so every sibling skill inherits the same scope. Records each run's output path in a suite manifest. Produces a combined navigation HTML that links to each sibling's standalone HTML for one-stop sharing. Ships two named recipes — "release-driver onboarding" (for tooling that drives releases) and "deployed-system onboarding" (for systems that get deployed) — and supports custom plans. Trigger on "run our mapping suite," "do a complete onboarding," "build the combined report," "I need to onboard to system X," "give me the full picture of this codebase," or when the us

nickcrew Bundle

User-triggered orchestrator that runs a comprehensive UI/UX review by coaching the user through four sibling skills as distinct lenses against one shared target, then synthesizing their findings into a single prioritized report. Composes user-journey-mapping (flow/funnel lens), ui-design-aesthetics (visual critique lens), interaction-design (state-coverage lens), and ux-review (usability-heuristics + WCAG lens). Resolves the review target once at suite start — the app/URL, the screens or flows under review, the viewports, and the user persona/goal — so every lens inherits the same scope and captured screenshots. Coaches rather than auto-runs — at each step it presents the next lens with its reframing prompt and an approval gate; the user invokes the sibling and confirms before moving on. Because the lenses overlap (ux-review already touches interaction and a11y), the suite scopes each lens to its distinct concern so the synthesis does not double-count. Produces one authored synthesis report — deduped findings

nickcrew Bundle

Use when generating, updating, or organizing documentation (component/API docs, project indexes, diagrams, tutorials, learning paths) - provides structured workflows and references for docs generation, indexing, diagrams, and teaching.

podo Bundle

D3.js data visualization skill based on Edward Tufte principles. Selects the right chart type from 80+ options by analyzing the data question, then generates single-file HTML with D3 v7, dark theme, responsive layout, direct labels, and annotations.

podo Bundle

Create programmatic videos with React. Official Remotion skill package — compose video sequences using React components, animate with spring physics, and render to MP4/GIF. Ideal for product demos, explainers, and data-driven videos.

podo Bundle

The deepest design engineering skill in the ecosystem. 23 domain references, 18 slash commands, 3 style variants, and a standalone anti-slop CLI detector with 33 rules. Covers premium UI taste, component patterns, and opinionated design-engineering workflows.

podo Bundle

Project-aware shadcn/ui workflow for searching, adding, composing, and fixing components with correct patterns. Understands the local component registry and avoids common shadcn anti-patterns during implementation.

podo Bundle

Design engine that teaches agents design judgment, not just data. Ships 69 brand-agnostic rules, 48 React components, 13 slash commands (/ss-tokens, /ss-component, /ss-audit, /ss-a11y, and more), and 60+ interchangeable brand skins (Toss, Stripe, Linear, Vercel, Notion, Raycast, Arc…). Tailwind v4 + Radix UI. Works with Claude Code and Cursor.

podo Bundle

Diagnose Apple HIG compliance issues with targeted guidance and fixes. 14 specialized skills covering HIG component categories — identifies non-compliant patterns and provides specific remediation steps.

podo Bundle

Official GSAP skills suite with 8 focused skills: core GSAP, Timeline, ScrollTrigger, plugins (Flip/Draggable/SplitText), utils, React (useGSAP hook), performance (60fps), and frameworks (Vue/Svelte/Nuxt). Works across Cursor, Claude Code, Copilot.

podo Bundle

"Write HTML. Render video." — 11 skills for composition authoring, TTS/transcription, CLI workflow, asset registry, URL capture, and GSAP/Anime.js/CSS/Lottie/Three.js/WAAPI animation. Built specifically for AI coding agents. Requires HeyGen account for media generation.

podo Bundle

High-agency frontend skill that gives AI good taste with tunable design variance, motion intensity, and visual density. Prevents generic AI UI slop through metric-based rules, strict component architecture, and premium design engineering directives.

podo Bundle

286K words of color science applied to UI/UX design. Covers OKLCH/OKLAB color spaces, palette generation, accessibility contrast ratios, color naming, pigment mixing, and historical color theory. By meodai, creator of color-names.

podo Bundle

Detects regressions in security, performance, correctness, and architecture across React codebases using score-based quality checks. Surfaces issues with severity ratings and actionable remediation steps for each finding.

podo Bundle

Official Slidev skill from the Slidev team — helps agents understand and generate developer-focused technical presentations using Slidev's Markdown format with Vue components, code highlighting, and animations.

podo Bundle

Emil Kowalski-inspired animation patterns for Next.js/React with 8 working examples: hover effects, toast notifications, text reveals, and modals. Emphasises motion that feels inevitable and purposeful.

podo Bundle

50+ design styles, 97 color palettes, and 9 technology stack templates (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Installs as a Claude plugin via .claude-plugin format.

podo Bundle

19-skill plugin suite covering cognitive psychology UX, Nielsen heuristics, UX research methods, interaction/motion design, accessibility/inclusive design, mobile UX, desktop app design, cross-cultural i18n UX, agentic AI/generative UX, ambient/zero UI, and spatial/voice UX. 310K+ words incorporating iOS 26 Liquid Glass and WCAG 3.0.

podo Bundle

4 official Vercel skills for web design guidelines, component building, React performance, and composition patterns. Enforces 100+ Web Interface Guidelines and accessible, composable component APIs.