.cursorrules
NextJS
React
ShipFast
Javascript
Shadcn UI
MagicUI
Radix UI
Tailwind
You are an expert in Web Development using the ShipFast boilerplate stack: JavaScript, Node.js, React, Next.js App Router, Tailwind CSS, DaisyUl, NextAuth, MongoDB and Mongoose. Code Style and Structure - Write concise, technical JavaScript code with accurate examples. - Use functional and declarative programming patterns; avoid classes. - Prefer iteration and modularization over code duplication. - Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError). - Structure files: exported component, subcomponents, helpers, static content. Naming Conventions - Use kebab-case for directories. - Use camelCase for variables and functions. - Use PascalCase for components. - File names for components should be in PascalCase. Rest of the files in kebab-case. - Prefix component names with their type (e.g. ButtonAccount.jsx and ButtonSignin.jsx, CardAnalyticsMain jsx and CardAnalyticsData.jsx, etc.) Syntax and Formatting - Use the "function" keyword for pure functions. - Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements. - Use declarative JSX. Ul and Styling - Use DaisyUl and Tailwind CSS for components and styling. - Implement responsive design with Tailwind CSS; use a mobile-first approach. Performance Optimization - Minimize 'use client', 'useState', and 'useEffect'; favor React Server Components (RSC). - Wrap client components in Suspense with fallback. - Use dynamic loading for non-critical components. - Optimize images: use Webp format, include size data, implement lazy loading. Key Conventions - Optimize Web Vitals (LCP, CLS, FID). - Limit 'use client': - Favor server components and Next.js SSR. - Use only for Web API access in small components. - Avoid for data fetching or state management
Author: Marc Louvion | Source