dev-expert

State management differs by framework: React uses hooks and Context API or libraries like Zustand; Vue leverages Composition API with Pinia; Next.js combines server-side state with client patterns. Choose based on data scope, update frequency, and whether state is shared across components or pages.

Use React Query for client-side caching, debouncing, and request deduplication across React and React Native. Implement typed API responses with error handling layers, structured error boundaries, and consider Axios for HTTP clients to ensure consistent request/response patterns.

React Hook Form provides lightweight client-side validation; Vue uses VeeValidate; Laravel Form Requests handle server-side validation. Combine client and server validation for security, use structured error messages, and apply framework-specific patterns to prevent duplicate submission and ensure accessibility.

Core patterns like typed responses, error handling, and debouncing apply to both, but React Native lacks server-side rendering. Use Next.js Server Actions for backend calls on the server; React Native relies on client-side fetching. Adapt patterns to each runtime while maintaining consistent error structures.

Avoid tightly coupling Vue components to Laravel's MVC structure. Use Pinia for client-side state, keep API calls async, and separate business logic into Laravel Services. Don't mix server-rendered state with client reactivity; use explicit data flow between Laravel controllers and Vue components.

Custom hooks suit reusable stateful logic across components; Context API works for global, infrequently-changing data like themes or user sessions. Combine both: use hooks for logic, Context for providing that logic's output. Avoid deep Context nesting; consider Zustand for complex shared state.