Use when an existing codebase needs an architecture review. Explores the codebase, generates current-state architecture diagrams using Mermaid.js, evaluates against architecture…
Use after superpowers:brainstorming approves a design spec and before writing-plans is invoked. Reviews the spec, generates architecture diagrams using Mermaid.js, evaluates…
Backend-for-Frontend architecture patterns for API aggregation, data transformation, and client-specific optimization.
Audit a codebase for maintenance and modernization. Challenges scope, reviews architecture/quality/tests/performance/dependencies, files deferred work via bd.
React, MDX, and Tailwind CSS integration patterns for Astro websites. Use when adding React components, configuring MDX content, setting up Tailwind styling, integrating component…
Probe a target for accidentally-public admin / debug / introspection endpoints — Spring Boot Actuator, Apache server-status, Prometheus metrics, GraphQL playground, Swagger UI,…
Next.js development (App Router, Server Components, caching, streaming). Trigger when the user works with Next.js, modifies app/, pages/, next.config, or talks about RSC, Server…
React/Next.js performance optimization. Trigger when the user wants to optimize rendering, reduce re-renders, or improve Core Web Vitals.
LangChain ReAct agent implementation with tool binding for reasoning and action loops
Generates PDF documents using the React-PDF library (@react-pdf/renderer) with TypeScript and JSX.
Storybook 10 testing patterns with Vitest integration, ESM-only distribution, CSF3 typesafe factories, play() interaction tests, Chromatic TurboSnap visual regression, module…
Drop in a 3-paragraph "what is this?" page for new users, per frontend framework; optionally collapses into the architecture page when both standards are enabled
Build a capability end-to-end — backend vertical slice (Contracts→handler→validator→endpoint) AND the React page wired to it.
Clone any website with a coordinated team of AI agents — a Manager (you), a Frontend Developer, a Backend Architect, and a Tester — that iteratively and autonomously build a…
Frontend design patterns with React 19.2 and TypeScript 6 examples (Composition, Compound Components, Custom Hooks, Render Props, HOC, State Machines).
Use when adding state management to a module - creates Svelte store with server state integration.
Creates a complete, faithful digital version of a board game as a single-file HTML/JS/CSS application.
Visualize git diffs as interactive HTML reports with architecture diagrams and change analysis. Use when asked to visualize, review, or summarize a diff, branch, commit, or PR.
Generate multiple unique web design variations for any website or web application. Accepts site specifications from a file (--spec path) or pasted text block.
This skill should be used when the user asks to "create a ReAct agent", "build an agent with tools", "implement tool-calling agent", "use dspy.ReAct", mentions "agent with tools",…
Cross-System Code-Analyse und Developer-Handoff fuer AutomationOne. Versteht Nutzerauftraege, verfolgt Daten- und Steuerfluesse quer durch ESP32, MQTT, Server und Frontend anhand…
Use when switching a project or component between frameworks - React to Vue, Vue to Svelte, or any supported framework pair.
Audit/fix Next.js i18n SEO — crawlability, 307 redirects, locale URLs, sitemap, hreflang.
Next.js SEO optimization guide. Use when building Next.js apps, optimizing for search engines, fixing Google indexing issues, implementing metadata, sitemaps, robots.txt, JSON-LD,…
Creates Next.js frontends with shadcn/ui. Use when building React UIs, components, pages, or applications with shadcn, Tailwind, or modern frontend patterns.
Audit React components for unnecessary useEffect patterns. Detects 9 anti-patterns from "You Might Not Need an Effect" and proposes fixes with severity levels.
Render an ARIS Markdown / JSON artifact (IDEA_REPORT, AUTO_REVIEW, KILL_ARGUMENT, PAPER_PLAN, research-wiki state, etc.) into a single-file HTML view designed for human reading.
Comprehensive Svelte 5 assistant — component generation with runes syntax, code review, debugging, and SvelteKit patterns.
Start een Agent Team voor E2E frontend testing. Gebruik na feature development om de app via de browser te verifiëren, of voor regressietests.
Static-analysis review pass over HTML/CSS/JSX/Astro source for 2026 web design anti-patterns and must-do violations.
Esperto di HTML-JS Card per Home Assistant Lovelace. Usa quando devi creare card con HTML, CSS e JavaScript inline: variabili hass/entities/card, hass-update event, callService,…
Ad-hoc development workflow for implementing features, fixing bugs, and making code changes outside a formal plan.
Generate Vue frontend pages using catch-table for CatchAdmin module with full component features. — from JaguarJack/catch-admin
Patches native modules (expo-image, react-native, etc.) to fix native crashes or bugs.
Build websites and web apps using 21st.dev — the largest marketplace of shadcn/ui-based React Tailwind components with 1400+ components.
Budowanie i rozwijanie dashboardu 4DX dla OvocxMalinowi z bazą Supabase. Używaj gdy pracujesz z dashboard-4dx.html lub bazą danych projektu.
Phase 6: Serve via python3 -m http.server 8899, screenshot light mode (fullPage), toggle .dark class + screenshot dark mode, compare 3 declared elements [expected vs present], fix…
Uses Chrome DevTools MCP for accessibility (a11y) debugging and auditing based on web.dev guidelines.
Frontend architecture consultant for project structure, folder organization, feature boundaries, and scaling decisions. Framework-aware (React, Vue, Angular).
Frontend architecture: state, data fetching, components, forms, routing. Stack-agnostic.
Configuração de dark mode (light/dark/system) para projetos Vite + React + TypeScript com shadcn/ui. Use após a skill add-tailwind-shadcn para criar ThemeProvider, ajustar sonner…
Fügt einen neuen Sidebar-Tab mit React-View hinzu. Erstellt View-Komponente in src/views/, TabRouter-Eintrag und Sidebar-Button.
Guides stable API and interface design. Use when designing APIs, module boundaries, or any public interface.
Google ADK (Agent Development Kit) multi-agent system architecture for BigQuery data analytics. Covers BigQuery agent vs conversational agent patterns, ADK Single Parent Rule,…
KAF Motors ilan giriş/düzenleme sihirbazı işleri — çok adımlı form (react-hook-form + zod), Tiptap zengin metin, react-dropzone resim yükleme ve interaktif ekspertiz SVG…
Advanced color science and dynamic palette generation from 20 production repos. LCH/OKLAB perceptual math, dark-mode pair algorithms, contrast enforcement, gamut mapping, CSS…
Skill especializada na migração do AFA Planner do Firebase para Supabase (PostgreSQL). Use esta skill SEMPRE que o usuário mencionar: migração do AFA, Firebase para Supabase,…
Complete methodology for building production-grade React applications with architecture decisions, component design, state management, performance optimization, testing, and…
Frontend development patterns for AI Agency projects covering tech stack preferences, component architecture, file structure, and coding conventions.
Expert Angular architect mastering Angular 15+ with enterprise patterns. Specializes in RxJS, NgRx state management, micro-frontend architecture, and performance optimization with…
Expert Next.js developer mastering Next.js 14+ with App Router and full-stack features. Specializes in server components, server actions, performance optimization, and production…
Identify and map different sections of a software project (API, frontend, database, CLI, domain). Use for context scoping and architecture documentation.
Expert React specialist mastering React 18+ with modern patterns and ecosystem. Specializes in performance optimization, advanced hooks, server components, and production-ready…
Agent skill for spec-mobile-react-native - invoke with $agent-spec-mobile-react-native
Expert Vue specialist mastering Vue 3 with Composition API and ecosystem. Specializes in reactivity system, performance optimization, Nuxt 3 development, and enterprise patterns…
基于若依-vue-plus框架的LangChain4j AI大模型集成标准规范。全面规范模型配置管理、类型安全服务定义、RAG（检索增强生成）实现、流式响应处理及安全性保障。 触发场景： - 开发智能客服系统、文档问答助手、代码生成工具 - 集成LLM大模型接口（OpenAI、智谱AI、通义千问等） - 实现知识库问答、文档检索、语义搜索功能 -…
Break down PM story into organized tasks in a single file following UI DEVELOPMENT order: Setup → Static UI → Dynamic Logic → Interactions → Testing.
Use when creating API services for backend communication with proper patterns for caching, error handling, and type safety. — from engineering/frontend
Generates Angular code and provides architectural guidance. Trigger when creating projects, components, or services, or for best practices on reactivity (signals, linkedSignal,…
Use when creating reactive forms with validation, async validators, dependent validation, and FormArrays using platform patterns. — from engineering/frontend