Vue Complete Kit
Ship Vue 3 apps without setup fatigue. Composition API. Pinia state. Tailwind styling. Just works.
TL;DR
Vue 3 development stack, pre-configured. Composition API patterns. Pinia for reactive state. Tailwind for styling. Production-ready components and best practices.
What's Inside
vue-expert
Vue 3 specialist. Composition API patterns, lifecycle hooks, reactive refs. Knows when to use computed vs watch. composables over mixins.
tailwind-pro
Utility-first styling expert. Responsive design, custom themes, component extraction. Dark mode that doesn't break.
ui-styling
shadcn/ui components, Radix UI primitives, Tailwind patterns. Accessible, beautiful, production-ready.
frontend-development
Modern frontend patterns. File organization, performance optimization, TypeScript best practices.
Prompts That Work
Copy, paste, ship. These prompts leverage the full kit stack.
1. Set up Pinia store for user auth
Create a Pinia store for user authentication with login/logout actions, persistent state using localStorage, and reactive computed getters for isAuthenticated. Use Composition API pattern.
2. Build responsive form with validation
Build a registration form with email, password, confirm password fields. Add reactive validation (email format, password strength, match check). Style with Tailwind using focus states and error indicators. Mobile-first responsive.
3. Create dashboard layout with sidebar navigation
Design a dashboard layout with collapsible sidebar, top navigation bar, and main content area. Use Vue Router for navigation. Add Tailwind transitions for sidebar collapse. Include dark mode toggle that persists.
4. Implement component communication pattern
Set up parent-child component communication using props down, events up pattern. Create a reusable composable for shared state. Show when to use provide/inject vs Pinia for different state scopes.
5. Add data table with sorting and filtering
Build a data table component with column sorting, search filter, and pagination. Use computed properties for reactive filtering. Style with Tailwind including hover states, striped rows, and responsive collapse on mobile.
Why This Kit
Composables over mixins. The kit knows Vue 3 patterns. No legacy Vue 2 advice. Composition API from the start.
Reactive state that just works. Pinia setup with TypeScript support, persistent storage, devtools integration. No boilerplate.
Styling without chaos. Tailwind patterns that scale. Custom themes, design systems, component libraries. Dark mode included.
Production-ready, not tutorial code. Error boundaries, loading states, accessibility. The stuff that separates demos from deployed apps.
Get the Kit
Install the full Vue Complete stack. 2 agents, 2 skills. One command.
npx vibery kit install vue-complete
What You'll Ship
Reactive Vue 3 apps
Composition API, script setup syntax, reactive refs and computed properties. Modern Vue from day one.
Predictable state management
Pinia stores with TypeScript. Actions, getters, persistence. State that makes sense across components.
Beautiful, responsive UIs
Tailwind utility classes, custom design systems, accessible components. Mobile-first, dark mode ready.
Production patterns
Error handling, loading states, optimistic updates. Code that survives real users and real data.
Part of the Vibery Kits collection. Curated templates for Claude Code.