Full-stack development guide for the VibeAny project. Covers creating pages, API routes, database tables, admin panels, landing page sections, i18n content, and server functions. Use when building any new feature, page, API endpoint, or modifying the landing page in this TanStack Start + React + Drizzle + Intlayer codebase.
CRXJS Chrome extension development — true HMR for popup, options, content scripts, side panels, manifest-driven builds, dynamic content script imports (`?script`, `?script&module`), and `defineManifest` for type-safe manifests. Uses Vite as its build tool. Use when the user mentions CRXJS, crxjs, @crxjs/vite-plugin, 'extension with hot reload', 'HMR for chrome extension', or wants to set up a CRXJS-based Chrome extension project with any framework (React, Vue, Svelte, Solid, Vanilla). Also trigger when the user has an existing CRXJS project and wants to add features, fix HMR issues, or configure content scripts with CRXJS. For general Chrome extension architecture (messaging, CSP, storage, permissions) -> See `samber/cc-skills@chrome-extension` skill.
Work on Madoc TS frontend structure for site and admin. Use when changing React routes, SSR render entrypoints, shared utilities, or component organization in services/madoc-ts.
Build, run, and debug the Madoc Docker/compose stack with the Docker daemon already running, including rebuilding images, starting/stopping services, inspecting containers/images, and using pm2 inside the madoc-ts container (server/queue/scheduler/auth) plus frontend rebuilds for volume-mounted assets.
REST/GraphQL/gRPC/tRPC API design patterns. Use when designing APIs, writing OpenAPI specs, versioning, auth, or rate limiting.
Guidelines and workflow for working on Laravel 11 or Laravel 12 applications across common stacks (API-only or full-stack), including optional Docker Compose/Sail, Inertia + React, Livewire, Vue, Blade, Tailwind v4, Fortify, Wayfinder, PHPUnit, Pint, and Laravel Boost MCP tools. Use when implementing features, fixing bugs, or making UI/backend changes while following project-specific instructions (AGENTS.md, docs/).
Production-grade frontend for Next.js, Vue, Angular, and Svelte. Use when building UI, fixing hydration errors, or setting up a new web project.
Production-grade iOS, Android, and cross-platform mobile dev. Use when building apps, handling auth/push, or preparing App Store releases.
RxJS patterns as used in the Nuclia frontend monorepo — covering Subject type selection, flattening operator decisions (switchMap vs concatMap vs mergeMap), combination operators (combineLatest vs forkJoin vs withLatestFrom), error handling, shareReplay placement, cleanup strategies, debounce conventions, Angular signal interop, and import hygiene. Activate this skill for ANY task that touches observable pipelines, service state streams, RxJS subscriptions, or operator choices in Angular apps or libs. Do not wait to be asked about "RxJS patterns" specifically — if the task writes or modifies a .pipe(), creates a Subject, adds a subscription in a service or component, uses catchError/switchMap/forkJoin, or asks "which operator should I use here?", this skill applies. Also use when debugging streams that never emit, emit multiple times unexpectedly, or cause memory leaks. This skill covers Angular libs and apps only; it does not cover search-widget (Svelte) or rao-widget (React).
Start the local HTTP registry server for development. Use when testing infra scripts or commands that need a Abacus work private overrides such as RPC URLS.
UI/UX design intelligence and implementation guidance for building polished interfaces. Use when the user asks for UI design, UX flows, information architecture, visual style direction, design systems/tokens, component specs, copy/microcopy, accessibility, or to generate/critique/refine frontend UI (HTML/CSS/JS, React, Next.js, Vue, Svelte, Tailwind). Includes workflows for (1) generating new UI layouts and styling, (2) improving existing UI/UX, (3) producing design-system tokens and component guidelines, and (4) turning UX recommendations into concrete code changes.
指导从 Entity 到 Controller 的完整 CRUD 功能开发流程。包括实体创建、DTO设计、服务实现、控制器开发、数据库配置和迁移。当用户需要开发新的 CRUD 功能、创建 API 接口、或添加新的业务模块时使用。
Official integration patterns for Mapbox GL JS across popular web frameworks (React, Vue, Svelte, Angular). Covers setup, lifecycle management, token handling, search integration, and common pitfalls. Based on Mapbox's create-web-app scaffolding tool.
Cross-platform mobile development specialist for React Native, Expo, native modules, and mobile-specific patternsUse when "react native, expo, mobile app, ios app, android app, cross-platform, native module, react navigation, mobile development, react-native, expo, mobile, ios, android, cross-platform, javascript, typescript, native-modules, navigation" mentioned.
Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences. Use when "3D website, three.js, WebGL, react three fiber, 3D experience, spline, product configurator, " mentioned.
Expert in Prisma - the TypeScript ORM for type-safe database access. Covers schema design, migrations, Prisma Client queries, relations, edge deployment, and performance optimization. Essential for building reliable database layers in TypeScript applications. Use when "prisma, orm, database typescript, prisma client, prisma migrate, type-safe database, prisma, orm, database, typescript, postgresql, migrations, type-safe" mentioned.
Python dominates backend development for good reason - readable code, massive ecosystem, and frameworks that scale from prototype to production. Django gives you batteries included. FastAPI gives you speed and modern async patterns. This skill covers both frameworks because real projects often need both: Django for admin panels and complex apps, FastAPI for high-performance APIs. The key insight: don't fight the framework. Django's ORM is not SQLAlchemy. FastAPI's Pydantic is not marshmallow. Learn the idioms. 2025 reality: Type hints are mandatory. Async is the default for I/O. Poetry/uv replaced pip for serious projects. If you're not using pyproject.toml, you're living in the past. Use when "python, django, fastapi, flask, pydantic, sqlalchemy, celery, uvicorn, poetry, python api, python backend, python, django, fastapi, flask, pydantic, backend, api, async" mentioned.
Vue is the progressive JavaScript framework - adopt as much or as little as you need. From sprinkles of reactivity on static pages to full single-page apps, Vue scales with your needs without forcing architectural decisions upfront. This skill covers Vue 3 Composition API, Nuxt 3, Pinia state management, and the Vue ecosystem. Key insight: Vue's power is in its simplicity. If you're writing complex code, you're probably fighting the framework. 2025 lesson: Composition API won. Options API is legacy. Nuxt 3 with auto-imports is the default for new projects. Server components are production-ready. Use when "vue, vue 3, nuxt, nuxt 3, pinia, composition api, vue composable, vue reactivity, ref, reactive, vue router, vite vue, vue, vue3, nuxt, nuxt3, composition-api, pinia, frontend, javascript, typescript, reactive" mentioned.
Expert at building robust form experiences. Covers React Hook Form, Zod validation, server actions, progressive enhancement, error handling, and accessible form patterns. Use when "form, react-hook-form, zod, validation, form validation, useForm, form errors, server action form, forms, validation, react-hook-form, zod, server-actions, accessibility" mentioned.
Expert at building resilient applications through proper error handling. Covers Result types, error boundaries, try-catch patterns, typed errors, and graceful degradation. Use when "error handling, try catch, error boundary, Result type, exception, error-handling, typescript, react, resilience" mentioned.
Rust no_std skill for embedded and bare-metal development. Use when writing
Expert at building real-time features using WebSockets, Server-Sent Events, and other live update mechanisms. Covers connection management, reconnection strategies, scaling with pub/sub, and common patterns like presence and typing indicators. Use when "websocket, real-time, realtime, live updates, socket.io, SSE, server-sent events, presence, typing indicator, live notifications, chat, collaborative, websockets, real-time, sse, socket.io, presence, live-updates, chat, collaborative" mentioned.
