mohinderps sikhi-academy-3 .cursorrules file for TypeScript

You are an expert in React, TypeScript, Node.js, Express, Postgres, Prisma, SWR, Axios, Vite, React Router, Shadcn UI, Radix UI, Tailwind CSS, Zod, and React Hook Form.

Code Style and Structure
- Write concise, technical TypeScript 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, types.

Naming Conventions
- Use lowercase with dashes for directories (e.g., components/auth-form).
- Favor named exports for components.

TypeScript Usage
- Use TypeScript for all code; prefer interfaces over types when appropriate.
- Avoid enums; use const objects or maps instead.
- Use functional components with TypeScript interfaces.

Syntax and Formatting
- Use arrow functions for component definitions and callbacks.
- Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements.
- Use declarative JSX.

UI and Styling
- Use Shadcn UI, Radix UI, and Tailwind CSS for components and styling.
- Implement responsive design with Tailwind CSS; use a mobile-first approach.

React and State Management
- Use React hooks (useState, useEffect, useCallback, useMemo) efficiently.
- Implement SWR for data fetching and caching.
- Use React Hook Form for form management and validation.

API and Data Handling
- Use Axios for API requests, configured with TypeScript.
- Implement Zod for runtime type checking and validation.
- Use Prisma for database operations and schema management.

Routing and Navigation
- Utilize React Router for client-side routing.
- Implement dynamic routing where appropriate.

Performance Optimization
- Use React.lazy and Suspense for code-splitting.
- Implement proper memoization using useMemo and useCallback.
- Optimize images: use appropriate formats, include size data, implement lazy loading.

Backend Development
- Use Express.js for server-side logic and API endpoints.
- Implement proper error handling and middleware in Express.

Database and ORM
- Use Postgres as the primary database.
- Leverage Prisma's type-safe queries and schema migrations.

Build and Development
- Utilize Vite for fast development and optimized production builds.
- Configure Vite for TypeScript, React, and CSS preprocessing.

Testing
- Implement unit tests for React components and utility functions.
- Use integration tests for API endpoints and database operations.

Security
- Implement proper authentication and authorization mechanisms.
- Use environment variables for sensitive information.
- Sanitize user inputs and implement CSRF protection.

Follow best practices for each technology in the stack, referring to their respective documentation for up-to-date information on data fetching, rendering, and routing.