By AratKruglik
Vue 3 SPA frontend stack provider for SDLC marketplace. Composition API, <script setup>, Pinia, Vue Router v4, vee-validate, Vitest + @vue/test-utils. Vue 3 primary; Vue 2 fallback notes for legacy projects. Nuxt out of scope (separate plugin in roadmap).
Vue 3 SFC structure, Composition API + <script setup>, file naming, project layout, props/emits/slots typing, defineModel, composables, lifecycle, watchers, UI library detection. Vue 2 fallback notes. Use this skill to: - Structure a new SFC with `<script setup>`, template, scoped styles. - Type props/emits/slots correctly via macros. - Pick `ref` vs `reactive` (prefer `ref`). - Build composables that compose cleanly. - Apply lifecycle hooks correctly. - Detect UI library (Vuetify/Quasar/PrimeVue/Naive UI/Element Plus/shadcn-vue) and mirror its patterns. Do NOT use this skill for: - State management lib choice (see vue-state-management). - Routing (see vue-routing). - Forms (see vue-forms). - Testing (see vue-testing).
Vue 3 form patterns: native v-model, vee-validate + zod (most common), VueUse helpers, defineModel for custom inputs, controlled vs uncontrolled, field arrays, multi-step wizards. Use this skill to: - Wire vee-validate with a validation schema (zod / yup). - Build custom form components with defineModel (Vue 3.4+). - Implement multi-step forms. - Handle async validation. - Integrate forms with TanStack Query mutations or Pinia actions. Do NOT use this skill for: - General SFC conventions (see vue-conventions). - State management (see vue-state-management). - Routing (see vue-routing). - Testing forms (see vue-testing).
Vue Router v4 (Vue 3 default) — route configuration, nested routes, dynamic segments, navigation guards, lazy loading, typed routes, route meta, programmatic navigation. Vue Router v3 (Vue 2) pointer only. Use this skill to: - Configure routes with createRouter + createWebHistory. - Use useRoute / useRouter composables in components. - Lazy-load route components for code splitting. - Implement auth guards via meta + beforeEach. - Type route params for safer access. Do NOT use this skill for: - General Vue conventions (see vue-conventions). - State management (see vue-state-management). - Forms (see vue-forms). - Testing routes (see vue-testing).
State management decision tree for Vue 3 SPAs: ref/reactive locally, composables for shared logic, Pinia for app-wide state, provide/inject for DI, TanStack Query Vue for server state. Vuex pointer for Vue 2 legacy. Use this skill to: - Pick the right state tool for the data shape (local / shared / server / form). - Implement a Pinia store (Setup syntax preferred). - Use provide/inject correctly with InjectionKey<T>. - Set up TanStack Query Vue for server state. - Migrate from Vuex (with caution; only if BA asks). Do NOT use this skill for: - General SFC conventions (see vue-conventions). - Form state (see vue-forms — vee-validate handles that). - Routing state (see vue-routing — use vue-router useRoute). - Testing stores (see vue-testing).
Testing Vue 3 SPAs: Vitest + @vue/test-utils, RTL-style alternatives, Pinia testing via createTestingPinia, composable testing, msw for network mocks, Cypress component testing, Playwright e2e. Use this skill to: - Set up Vitest for Vue 3 with jsdom + @vue/test-utils. - Pick mount vs shallowMount. - Test components by props/emits/slots contract. - Mock Pinia stores in tests. - Test composables in isolation. - Set up Playwright or Cypress for end-to-end. Do NOT use this skill for: - General Vue conventions (see vue-conventions). - State patterns (see vue-state-management). - Form-specific patterns (see vue-forms).
Modifies files
Hook triggers on file write and edit operations
Uses power tools
Uses Bash, Write, or Edit tools
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Multi-stack AI-assisted SDLC pipelines built on the Stack Provider Pattern: a single core orchestrator runs the pipeline, framework plugins register themselves via declarative stack.md profiles. No core overrides, no slot registries, no copy-paste between stacks.
v1.2.0 — 26 plugins: 1 core + 5 shared libs + 7 JS/TS stacks + 5 PHP/Laravel/Symfony stacks + 3 Java/.NET stacks + 5 Python stacks. Cost-optimized: model tiering + effort per-subagent, fixed Haiku enforcement for the docs phase, file-scoped format hooks, shared architect conventions (~1,600 lines of boilerplate deduped), per-aspect QA fan-out on full-stack runs.
# 1. Add the marketplace
/plugin marketplace add AratKruglik/claude-sdlc
# 2. Install the stack plugin you need (sdlc core is installed automatically as a dependency)
/plugin install laravel-plugin@sdlc-marketplace
# or for JS/TS projects:
/plugin install nodejs-plugin@sdlc-marketplace # Express/Fastify/Koa
/plugin install nestjs-plugin@sdlc-marketplace # NestJS
/plugin install nextjs-plugin@sdlc-marketplace # Next.js (full-stack)
/plugin install react-plugin@sdlc-marketplace # React SPA
/plugin install vue-plugin@sdlc-marketplace # Vue 3 SPA
/plugin install angular-plugin@sdlc-marketplace # Angular 18-21
/plugin install react-native-plugin@sdlc-marketplace # React Native / Expo
# or for Python projects:
/plugin install django-plugin@sdlc-marketplace # Django + DRF
/plugin install fastapi-plugin@sdlc-marketplace # FastAPI + SQLAlchemy 2.0
/plugin install flask-plugin@sdlc-marketplace # Flask + Flask-Migrate
/plugin install python-plugin@sdlc-marketplace # Plain Python (CLI/library/scripts)
# 3. Install optional plugins
/plugin marketplace add mattpocock/skills
/plugin install mattpocock-skills@skills # Enhances BA phase with interactive grilling
# 4. Verify
/sdlc:doctor
/sdlc:list-stacks
# 4. Run
/sdlc:start "Add subscription billing with Stripe"
┌─────────────────────────────────────────────────────────────┐
│ sdlc (core) │
│ ┌──────────────────────────────────────────────────────┐ │
│ │ pipeline-orchestrator (skill) — NEVER CHANGES │ │
│ │ │ │
│ │ Phase 1: BA → core's business-analyst │ │
│ │ Phase 2: Dev → ⚡ DISPATCH to stack provider │ │
│ │ Phase X: extra → ⚡ stack-specific phases │ │
│ │ Phase N-2: QA → core's qa-engineer │ │
│ │ Phase N-1: Security → core's security-analyst │ │
│ │ Phase N: Docs/PR → core's document-writer │ │
│ └──────────────────────────────────────────────────────┘ │
│ ▲ │
│ │ reads stack.md profiles │
└────────────────────────────┼────────────────────────────────┘
│
┌────────────────────────┼───────────────────────────┐
│ │ │ │ │
┌───▼───┐ ┌────▼────┐ ┌────▼────┐ ┌────▼────┐ ┌────▼────┐
│laravel│ │ nodejs │ │ nestjs │ │ nextjs │ │ react │
│plugin │ │ plugin │ │ plugin │ │ plugin │ │ plugin │
│stack.md│ │ stack.md│ │stack.md │ │stack.md │ │stack.md │
└───────┘ └─────────┘ └─────────┘ └─────────┘ └─────────┘
Key principles:
pipeline-orchestrator/SKILL.md.stack.md frontmatter — they declare auto-detection rules, priority, agents per phase, and convention skills.When /sdlc:start runs, the orchestrator needs to decide which agent handles development. The priority system is how it picks.
Each plugin has a stack.md file where it describes itself: "I handle projects that have X, and my priority is Y." The orchestrator scans all installed plugins, runs their detection rules against the current project, and picks the highest-priority match.
Step by step:
~/.claude/plugins/cache/**/stack.md — collect all registered profiles.detect rules: is there a package.json? Does it contain react? Is there a manage.py? And so on.Example — Laravel + React (Inertia.js) project:
npx claudepluginhub aratkruglik/claude-sdlc --plugin vue-pluginShared Python foundation skills for the SDLC marketplace. Contains stack-agnostic Python conventions (python-conventions — type hints, dataclasses, match, pathlib, enums, context managers, PEP 8, strict typing), python-tooling (pyproject.toml as source of truth, pip/Poetry/uv/pipenv, venv, lockfiles, ruff lint+format, mypy, console scripts), and pytest-testing (fixtures, parametrize, conftest, monkeypatch, unittest.mock, pytest-cov). No agent, no stack profile — pure shared library. Referenced by django-plugin, fastapi-plugin, flask-plugin, and python-plugin.
Shared C#/.NET foundation skills for the SDLC marketplace. Contains stack-agnostic conventions: csharp-conventions (modern C# idioms — nullable reference types, records, pattern matching, async/await, IDisposable, naming), dotnet-tooling (dotnet CLI, NuGet, csproj/sln, central package management, dotnet format) and dotnet-testing (xUnit, Moq/NSubstitute, FluentAssertions, coverlet). Referenced cross-plugin by every .NET framework provider in the marketplace. No agent, no stack profile — pure shared library.
Next.js full-stack React framework stack provider for SDLC marketplace. Multi-aspect ownership (backend + frontend). App Router, Server Components, Server Actions, Route Handlers, ISR/SSG/SSR. Reuses TypeScript and npm skills from nodejs-plugin.
Angular 18-21 SPA frontend stack provider for SDLC marketplace. Standalone components + NgModule equally, signals + services + NgRx (Store/Component Store/Signals), Reactive Forms (typed), Angular Router with functional guards, TestBed + component harnesses + Angular Testing Library. Modern era (signal-first, control flow @if/@for/@switch) with legacy NgModule fallback. Angular Universal (SSR) pointer-only — SPA focus.
React SPA frontend stack provider for SDLC marketplace. Components, hooks, state management, routing, forms, testing. Composes with backend plugins (nodejs/nestjs/laravel) via aspect resolution. Loses to higher-priority frameworks (nextjs, react-native) on their respective project types.
Inertia.js + Vue 3 frontend stack provider for Laravel SDLC marketplace. Detects @inertiajs/vue3 adapter (priority=175, beats generic vue-plugin at 150). Server-driven Inertia pages, useForm, usePage, shared props — no client-side router.
Comprehensive debugging strategies and troubleshooting guides for Vue.js applications.
shadcn-vue for Vue/Nuxt with Reka UI components and Tailwind. Use for accessible UI, Auto Form, data tables, charts, or encountering component imports, dark mode, Reka UI errors.
Advanced Vue skills for Composition API, components, and reactivity.
Your AI development team. 36 agents and 32 skills for building, reviewing, debugging, and shipping production code. Supports Vue, React, Next.js, SvelteKit, Angular, Astro, and Nuxt.
Ultra-compressed communication mode. Cuts 65% of output tokens (measured) while keeping full technical accuracy by speaking like a caveman.