React Typescript Nextjs Nodejs Cursorrules Prompt

react-typescript-nextjs-nodejs-cursorrules-prompt-

description: Enforces specific React/Next.js component development practices, including functional components, declarative JSX, UI library usage, and optimization techniques. globs: components/**/*.{ts,tsx,js,jsx}

• Use functional components and TypeScript interfaces.
• Use declarative JSX.
• Use function, not const, for components.
• Use Shadcn UI, Radix, and Tailwind Aria for components and styling.
• Implement responsive design with Tailwind CSS.
• Use mobile-first approach for responsive design.
• Place static content and interfaces at file end.
• Use content variables for static content outside render functions.
• Minimize 'use client', 'useEffect', and 'setState'. Favor RSC.
• Use Zod for form validation.
• Wrap client components in Suspense with fallback.
• Use dynamic loading for non-critical components.
• Optimize images: WebP format, size data, lazy loading.