frontend-dev-guidelines

Fetch data in Next.js 16 using async/await directly in Server Components or the use() hook for unwrapping promises. Prioritize these methods for efficient data retrieval before considering React Query.

To handle data mutations in React 19, use Server Actions combined with the useActionState hook. This provides a standardized approach for managing form submissions and data updates.

Manage loading and error states in Next.js 16 using React Suspense for loading UI and error.tsx files for robust error boundaries. This ensures graceful handling of asynchronous operations and runtime errors.

Use Server Components for data fetching and static rendering, and Client Components for interactivity. This distinction optimizes performance and maintainability across your Next.js 16 application.

Implement caching in React 19 and Next.js 16 using React.cache() and unstable_cache(). These functions provide best practices for optimizing data fetching and reducing redundant requests.

Yes, these frontend development guidelines cover UI and styling using Tailwind CSS and shadcn/ui. They provide standards for implementing project structure and consistent visual components.