Frontend

Run integration tests after workstreams complete to verify system-level behavior.Triggers after unit tests pass but before code review. Starts required services(via docker-compose), runs integration test suites, and verifies API contracts.Use when:- All workstreams in a plan complete- Unit tests pass- Before code review phase- User asks "run integration tests"If no integration tests exist: Warn but proceed (don't block).

Build production-ready frontend for Morpho Blue lending protocol on Solana. Covers all 26 program instructions across supply/borrow, flash loans, liquidations, authorization, and admin features. Uses Next.js 14, Anchor client, Jupiter wallet adapter, and Kamino-style UI/UX. Integrates with morpho-solana-builder skill for contract understanding.

Prettier configuration validation and templates for package.json "prettier" field in MetaSaver monorepos. Includes 4 required standards (prettier field in package.json with string reference only, no separate prettierrc files, prettier in devDependencies, required npm scripts format and format:check). Use when creating or auditing Prettier configs to ensure consistent code formatting via shared library.

PowerPoint presentation toolkit for creating new presentations, editing existing ones, and using templates. Supports HTML-to-PPTX conversion, slide manipulation, and professional design. Use when building presentations, slide decks, or visual reports.

Create atomic components (atoms) - basic, reusable UI building blocks following React/TypeScript best practices with Tailwind v4 styling. Use when creating fundamental UI elements like buttons, inputs, labels, icons, or other single-responsibility components. Triggers on requests like "create a button component", "add an input atom", "build a reusable icon wrapper", or "create atomic UI elements".

Homeostatic sensor detecting requirements without implementation or test coverage. Scans for REQ-* keys in requirements docs and checks if they have corresponding code and tests. Use to find coverage gaps.

Specialized knowledge for working with Angular 19 and Nx in the Sentinel monorepo. Use when generating components, running tests/builds, or working with the frontend workspace structure.

Use this skill whenever the user wants to set up, refactor, or optimize Supabase usage in a Next.js (App Router) + TypeScript project, including auth, database, storage, RLS-safe patterns, edge functions, and secure client/server integration.

Generative UI implementation patterns for AI SDK RSC including server-side streaming components, dynamic UI generation, and client-server coordination. Use when implementing generative UI, building AI SDK RSC, creating streaming components, or when user mentions generative UI, React Server Components, dynamic UI, AI-generated interfaces, or server-side streaming.

Combines YouTube lecture transcripts with PDF slides to create an interactive HTML page. Matches each slide to corresponding transcript segments, organized by key concepts. Use when users want to create synchronized lecture notes from transcript text files and slide PDFs.

Master profiling, benchmarking, and optimization techniques. Learn caching strategies, database optimization, code optimization, and system-level tuning to build lightning-fast applications. Identify bottlenecks and achieve 10x-100x performance improvements.

Git workflow orchestrator guiding developers through workspace setup, clean commits, and work completion across git-worktrees, git-commit, and git-finish skills

Reactive 패턴 검증. Use when:(1) 구현 완료 후 Reactive 준수 확인, (2) .block() 호출 감지,(3) Coroutine/Flow 패턴 검증.

Next.js/Reactによるフロントエンド実装スキル（UI、API連携、状態管理、テスト）

Real-time observability dashboard for multi-agent Claude Code sessions.Visualize agent interactions, tool usage, and session flows in real-time through a web dashboard. Track multiple agents running in parallel with swim lane visualization, event filtering, and live charts.**Key Features:**- 🔴 Real-time event streaming via WebSocket- 📊 Agent swim lanes showing parallel execution- 🔍 Event filtering by agent, session, event type- 📈 Live charts for tool usage patterns- 💾 Filesystem-based (no database required)**Inspired by [@indydevdan](https://github.com/indydevdan)**'s work on multi-agent observability.**Our approach:** Filesystem + in-memory streaming vs. indydevdan's SQLite database approach.

Technical leadership guidance for engineering teams, architecture decisions, and technology strategy. Includes tech debt analyzer, team scaling calculator, engineering metrics frameworks, technology evaluation tools, and ADR templates. Use when assessing technical debt, scaling engineering teams, evaluating technologies, making architecture decisions, establishing engineering metrics, or when user mentions CTO, tech debt, technical debt, team scaling, architecture decisions, technology evaluation, engineering metrics, DORA metrics, or technology strategy.

PolicyEngine React web application - the user interface at policyengine.org

Next.js App Router Server Components, Client Components, layouts, data fetching, and Server Actions. Use when working with Next.js app directory, component boundaries, or data fetching patterns.

Write clear git commits with Conventional Commits format. Detects project conventions from history and config. Guides commit granularity. Use when: (1) Completing working code, (2) Code builds and tests pass, (3) Ready to save, (4) Before pushing, (5) After review feedback. Triggers: automatically when finishing commitable work that builds and passes tests.

Guide for implementing Better Auth - a framework-agnostic authentication and authorization framework for TypeScript. Use when adding authentication features like email/password, OAuth, 2FA, passkeys, or advanced auth functionality to applications.