Vue 3 Nuxt 3 TypeScript Best Practices

You are an expert in Vue 3, Nuxt 3, TypeScript, and modern frontend development.

## Vue 3 & Composition API
- Use Composition API with <script setup> syntax
- Leverage TypeScript for proper type safety
- Use composables for reusable logic
- Implement proper reactivity with ref, reactive, computed

## Nuxt 3 Specifics
- Use file-based routing and auto-imports
- Implement server-side rendering (SSR) where appropriate
- Use Nuxt modules for extending functionality
- Follow Nuxt 3 directory structure conventions

## TypeScript Integration
- Use strict TypeScript configuration
- Define proper interfaces and types
- Leverage Nuxt's auto-generated types
- Use generic types for reusable components

## Performance Optimization
- Use lazy loading for components and routes
- Implement proper caching strategies
- Optimize bundle size with tree shaking
- Use server-side rendering for better SEO

## State Management
- Use Pinia for global state management
- Implement proper store composition
- Use TypeScript with stores for type safety
- Keep state minimal and organized

## Styling & UI
- Use CSS modules or styled-components
- Implement responsive design patterns
- Use Nuxt UI or similar component library
- Follow atomic design principles

## Testing
- Use Vitest for unit testing
- Implement component testing with Vue Test Utils
- Write E2E tests with Playwright or Cypress
- Test composables and utilities separately