feat: rules
This commit is contained in:
60
.cursor/rules/clean-code.mdc
Normal file
60
.cursor/rules/clean-code.mdc
Normal file
@@ -0,0 +1,60 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: Guidelines for writing clean, maintainable, and human-readable code. Apply these rules when writing or reviewing code to ensure consistency and quality.
|
||||||
|
globs:
|
||||||
|
---
|
||||||
|
# Clean Code Guidelines
|
||||||
|
|
||||||
|
## Constants Over Magic Numbers
|
||||||
|
- Replace hard-coded values with named constants
|
||||||
|
- Use descriptive constant names that explain the value's purpose
|
||||||
|
- Keep constants at the top of the file or in a dedicated constants file
|
||||||
|
|
||||||
|
## Meaningful Names
|
||||||
|
- Variables, functions, and classes should reveal their purpose
|
||||||
|
- Names should explain why something exists and how it's used
|
||||||
|
- Avoid abbreviations unless they're universally understood
|
||||||
|
|
||||||
|
## Smart Comments
|
||||||
|
- Don't comment on what the code does - make the code self-documenting
|
||||||
|
- Use comments to explain why something is done a certain way
|
||||||
|
- Document APIs, complex algorithms, and non-obvious side effects
|
||||||
|
|
||||||
|
## Single Responsibility
|
||||||
|
- Each function should do exactly one thing
|
||||||
|
- Functions should be small and focused
|
||||||
|
- If a function needs a comment to explain what it does, it should be split
|
||||||
|
|
||||||
|
## DRY (Don't Repeat Yourself)
|
||||||
|
- Extract repeated code into reusable functions
|
||||||
|
- Share common logic through proper abstraction
|
||||||
|
- Maintain single sources of truth
|
||||||
|
|
||||||
|
## Clean Structure
|
||||||
|
- Keep related code together
|
||||||
|
- Organize code in a logical hierarchy
|
||||||
|
- Use consistent file and folder naming conventions
|
||||||
|
|
||||||
|
## Encapsulation
|
||||||
|
- Hide implementation details
|
||||||
|
- Expose clear interfaces
|
||||||
|
- Move nested conditionals into well-named functions
|
||||||
|
|
||||||
|
## Code Quality Maintenance
|
||||||
|
- Refactor continuously
|
||||||
|
- Fix technical debt early
|
||||||
|
- Leave code cleaner than you found it
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
- Write tests before fixing bugs
|
||||||
|
- Keep tests readable and maintainable
|
||||||
|
- Test edge cases and error conditions
|
||||||
|
|
||||||
|
## Version Control
|
||||||
|
- Write clear commit messages
|
||||||
|
- Make small, focused commits
|
||||||
|
- Use meaningful branch names
|
||||||
52
.cursor/rules/code-quality.mdc
Normal file
52
.cursor/rules/code-quality.mdc
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: Code Quality Guidelines
|
||||||
|
globs:
|
||||||
|
---
|
||||||
|
# Code Quality Guidelines
|
||||||
|
|
||||||
|
## Verify Information
|
||||||
|
Always verify information before presenting it. Do not make assumptions or speculate without clear evidence.
|
||||||
|
|
||||||
|
## File-by-File Changes
|
||||||
|
Make changes file by file and give me a chance to spot mistakes.
|
||||||
|
|
||||||
|
## No Apologies
|
||||||
|
Never use apologies.
|
||||||
|
|
||||||
|
## No Understanding Feedback
|
||||||
|
Avoid giving feedback about understanding in comments or documentation.
|
||||||
|
|
||||||
|
## No Whitespace Suggestions
|
||||||
|
Don't suggest whitespace changes.
|
||||||
|
|
||||||
|
## No Summaries
|
||||||
|
Don't summarize changes made.
|
||||||
|
|
||||||
|
## No Inventions
|
||||||
|
Don't invent changes other than what's explicitly requested.
|
||||||
|
|
||||||
|
## No Unnecessary Confirmations
|
||||||
|
Don't ask for confirmation of information already provided in the context.
|
||||||
|
|
||||||
|
## Preserve Existing Code
|
||||||
|
Don't remove unrelated code or functionalities. Pay attention to preserving existing structures.
|
||||||
|
|
||||||
|
## Single Chunk Edits
|
||||||
|
Provide all edits in a single chunk instead of multiple-step instructions or explanations for the same file.
|
||||||
|
|
||||||
|
## No Implementation Checks
|
||||||
|
Don't ask the user to verify implementations that are visible in the provided context.
|
||||||
|
|
||||||
|
## No Unnecessary Updates
|
||||||
|
Don't suggest updates or changes to files when there are no actual modifications needed.
|
||||||
|
|
||||||
|
## Provide Real File Links
|
||||||
|
Always provide links to the real files, not x.md.
|
||||||
|
|
||||||
|
## No Current Implementation
|
||||||
|
Don't show or discuss the current implementation unless specifically requested.
|
||||||
57
.cursor/rules/nextjs.mdc
Normal file
57
.cursor/rules/nextjs.mdc
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: Next.js with TypeScript and Tailwind UI best practices
|
||||||
|
globs: **/*.tsx, **/*.ts, src/**/*.ts, src/**/*.tsx
|
||||||
|
---
|
||||||
|
|
||||||
|
# Next.js Best Practices
|
||||||
|
|
||||||
|
## Project Structure
|
||||||
|
- Use the App Router directory structure
|
||||||
|
- Place components in `app` directory for route-specific components
|
||||||
|
- Place shared components in `components` directory
|
||||||
|
- Place utilities and helpers in `lib` directory
|
||||||
|
- Use lowercase with dashes for directories (e.g., `components/auth-wizard`)
|
||||||
|
|
||||||
|
## Components
|
||||||
|
- Use Server Components by default
|
||||||
|
- Mark client components explicitly with 'use client'
|
||||||
|
- Wrap client components in Suspense with fallback
|
||||||
|
- Use dynamic loading for non-critical components
|
||||||
|
- Implement proper error boundaries
|
||||||
|
- Place static content and interfaces at file end
|
||||||
|
|
||||||
|
## Performance
|
||||||
|
- Optimize images: Use WebP format, size data, lazy loading
|
||||||
|
- Minimize use of 'useEffect' and 'setState'
|
||||||
|
- Favor Server Components (RSC) where possible
|
||||||
|
- Use dynamic loading for non-critical components
|
||||||
|
- Implement proper caching strategies
|
||||||
|
|
||||||
|
## Data Fetching
|
||||||
|
- Use Server Components for data fetching when possible
|
||||||
|
- Implement proper error handling for data fetching
|
||||||
|
- Use appropriate caching strategies
|
||||||
|
- Handle loading and error states appropriately
|
||||||
|
|
||||||
|
## Routing
|
||||||
|
- Use the App Router conventions
|
||||||
|
- Implement proper loading and error states for routes
|
||||||
|
- Use dynamic routes appropriately
|
||||||
|
- Handle parallel routes when needed
|
||||||
|
|
||||||
|
## Forms and Validation
|
||||||
|
- Use Zod for form validation
|
||||||
|
- Implement proper server-side validation
|
||||||
|
- Handle form errors appropriately
|
||||||
|
- Show loading states during form submission
|
||||||
|
|
||||||
|
## State Management
|
||||||
|
- Minimize client-side state
|
||||||
|
- Use React Context sparingly
|
||||||
|
- Prefer server state when possible
|
||||||
|
- Implement proper loading states
|
||||||
83
.cursor/rules/react.mdc
Normal file
83
.cursor/rules/react.mdc
Normal file
@@ -0,0 +1,83 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: React best practices and patterns for modern web applications
|
||||||
|
globs: **/*.tsx, **/*.jsx, components/**/*
|
||||||
|
---
|
||||||
|
|
||||||
|
# React Best Practices
|
||||||
|
|
||||||
|
## Component Structure
|
||||||
|
- Use functional components over class components
|
||||||
|
- Keep components small and focused
|
||||||
|
- Extract reusable logic into custom hooks
|
||||||
|
- Use composition over inheritance
|
||||||
|
- Implement proper prop types with TypeScript
|
||||||
|
- Split large components into smaller, focused ones
|
||||||
|
|
||||||
|
## Hooks
|
||||||
|
- Follow the Rules of Hooks
|
||||||
|
- Use custom hooks for reusable logic
|
||||||
|
- Keep hooks focused and simple
|
||||||
|
- Use appropriate dependency arrays in useEffect
|
||||||
|
- Implement cleanup in useEffect when needed
|
||||||
|
- Avoid nested hooks
|
||||||
|
|
||||||
|
## State Management
|
||||||
|
- Use useState for local component state
|
||||||
|
- Implement useReducer for complex state logic
|
||||||
|
- Use Context API for shared state
|
||||||
|
- Keep state as close to where it's used as possible
|
||||||
|
- Avoid prop drilling through proper state management
|
||||||
|
- Use state management libraries only when necessary
|
||||||
|
|
||||||
|
## Performance
|
||||||
|
- Implement proper memoization (useMemo, useCallback)
|
||||||
|
- Use React.memo for expensive components
|
||||||
|
- Avoid unnecessary re-renders
|
||||||
|
- Implement proper lazy loading
|
||||||
|
- Use proper key props in lists
|
||||||
|
- Profile and optimize render performance
|
||||||
|
|
||||||
|
## Forms
|
||||||
|
- Use controlled components for form inputs
|
||||||
|
- Implement proper form validation
|
||||||
|
- Handle form submission states properly
|
||||||
|
- Show appropriate loading and error states
|
||||||
|
- Use form libraries for complex forms
|
||||||
|
- Implement proper accessibility for forms
|
||||||
|
|
||||||
|
## Error Handling
|
||||||
|
- Implement Error Boundaries
|
||||||
|
- Handle async errors properly
|
||||||
|
- Show user-friendly error messages
|
||||||
|
- Implement proper fallback UI
|
||||||
|
- Log errors appropriately
|
||||||
|
- Handle edge cases gracefully
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
- Write unit tests for components
|
||||||
|
- Implement integration tests for complex flows
|
||||||
|
- Use React Testing Library
|
||||||
|
- Test user interactions
|
||||||
|
- Test error scenarios
|
||||||
|
- Implement proper mock data
|
||||||
|
|
||||||
|
## Accessibility
|
||||||
|
- Use semantic HTML elements
|
||||||
|
- Implement proper ARIA attributes
|
||||||
|
- Ensure keyboard navigation
|
||||||
|
- Test with screen readers
|
||||||
|
- Handle focus management
|
||||||
|
- Provide proper alt text for images
|
||||||
|
|
||||||
|
## Code Organization
|
||||||
|
- Group related components together
|
||||||
|
- Use proper file naming conventions
|
||||||
|
- Implement proper directory structure
|
||||||
|
- Keep styles close to components
|
||||||
|
- Use proper imports/exports
|
||||||
|
- Document complex component logic
|
||||||
83
.cursor/rules/tailwind.mdc
Normal file
83
.cursor/rules/tailwind.mdc
Normal file
@@ -0,0 +1,83 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: Tailwind CSS and UI component best practices for modern web applications
|
||||||
|
globs: **/*.css, **/*.tsx, **/*.jsx, tailwind.config.js, tailwind.config.ts
|
||||||
|
---
|
||||||
|
|
||||||
|
# Tailwind CSS Best Practices
|
||||||
|
|
||||||
|
## Project Setup
|
||||||
|
- Use proper Tailwind configuration
|
||||||
|
- Configure theme extension properly
|
||||||
|
- Set up proper purge configuration
|
||||||
|
- Use proper plugin integration
|
||||||
|
- Configure custom spacing and breakpoints
|
||||||
|
- Set up proper color palette
|
||||||
|
|
||||||
|
## Component Styling
|
||||||
|
- Use utility classes over custom CSS
|
||||||
|
- Group related utilities with @apply when needed
|
||||||
|
- Use proper responsive design utilities
|
||||||
|
- Implement dark mode properly
|
||||||
|
- Use proper state variants
|
||||||
|
- Keep component styles consistent
|
||||||
|
|
||||||
|
## Layout
|
||||||
|
- Use Flexbox and Grid utilities effectively
|
||||||
|
- Implement proper spacing system
|
||||||
|
- Use container queries when needed
|
||||||
|
- Implement proper responsive breakpoints
|
||||||
|
- Use proper padding and margin utilities
|
||||||
|
- Implement proper alignment utilities
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
- Use proper font size utilities
|
||||||
|
- Implement proper line height
|
||||||
|
- Use proper font weight utilities
|
||||||
|
- Configure custom fonts properly
|
||||||
|
- Use proper text alignment
|
||||||
|
- Implement proper text decoration
|
||||||
|
|
||||||
|
## Colors
|
||||||
|
- Use semantic color naming
|
||||||
|
- Implement proper color contrast
|
||||||
|
- Use opacity utilities effectively
|
||||||
|
- Configure custom colors properly
|
||||||
|
- Use proper gradient utilities
|
||||||
|
- Implement proper hover states
|
||||||
|
|
||||||
|
## Components
|
||||||
|
- Use shadcn/ui components when available
|
||||||
|
- Extend components properly
|
||||||
|
- Keep component variants consistent
|
||||||
|
- Implement proper animations
|
||||||
|
- Use proper transition utilities
|
||||||
|
- Keep accessibility in mind
|
||||||
|
|
||||||
|
## Responsive Design
|
||||||
|
- Use mobile-first approach
|
||||||
|
- Implement proper breakpoints
|
||||||
|
- Use container queries effectively
|
||||||
|
- Handle different screen sizes properly
|
||||||
|
- Implement proper responsive typography
|
||||||
|
- Use proper responsive spacing
|
||||||
|
|
||||||
|
## Performance
|
||||||
|
- Use proper purge configuration
|
||||||
|
- Minimize custom CSS
|
||||||
|
- Use proper caching strategies
|
||||||
|
- Implement proper code splitting
|
||||||
|
- Optimize for production
|
||||||
|
- Monitor bundle size
|
||||||
|
|
||||||
|
## Best Practices
|
||||||
|
- Follow naming conventions
|
||||||
|
- Keep styles organized
|
||||||
|
- Use proper documentation
|
||||||
|
- Implement proper testing
|
||||||
|
- Follow accessibility guidelines
|
||||||
|
- Use proper version control
|
||||||
62
.cursor/rules/typescript.mdc
Normal file
62
.cursor/rules/typescript.mdc
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
---
|
||||||
|
description:
|
||||||
|
globs:
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
---
|
||||||
|
description: TypeScript coding standards and best practices for modern web development
|
||||||
|
globs: **/*.ts, **/*.tsx, **/*.d.ts
|
||||||
|
---
|
||||||
|
|
||||||
|
# TypeScript Best Practices
|
||||||
|
|
||||||
|
## Type System
|
||||||
|
- Prefer interfaces over types for object definitions
|
||||||
|
- Use type for unions, intersections, and mapped types
|
||||||
|
- Avoid using `any`, prefer `unknown` for unknown types
|
||||||
|
- Use strict TypeScript configuration
|
||||||
|
- Leverage TypeScript's built-in utility types
|
||||||
|
- Use generics for reusable type patterns
|
||||||
|
|
||||||
|
## Naming Conventions
|
||||||
|
- Use PascalCase for type names and interfaces
|
||||||
|
- Use camelCase for variables and functions
|
||||||
|
- Use UPPER_CASE for constants
|
||||||
|
- Use descriptive names with auxiliary verbs (e.g., isLoading, hasError)
|
||||||
|
- Prefix interfaces for React props with 'Props' (e.g., ButtonProps)
|
||||||
|
|
||||||
|
## Code Organization
|
||||||
|
- Keep type definitions close to where they're used
|
||||||
|
- Export types and interfaces from dedicated type files when shared
|
||||||
|
- Use barrel exports (index.ts) for organizing exports
|
||||||
|
- Place shared types in a `types` directory
|
||||||
|
- Co-locate component props with their components
|
||||||
|
|
||||||
|
## Functions
|
||||||
|
- Use explicit return types for public functions
|
||||||
|
- Use arrow functions for callbacks and methods
|
||||||
|
- Implement proper error handling with custom error types
|
||||||
|
- Use function overloads for complex type scenarios
|
||||||
|
- Prefer async/await over Promises
|
||||||
|
|
||||||
|
## Best Practices
|
||||||
|
- Enable strict mode in tsconfig.json
|
||||||
|
- Use readonly for immutable properties
|
||||||
|
- Leverage discriminated unions for type safety
|
||||||
|
- Use type guards for runtime type checking
|
||||||
|
- Implement proper null checking
|
||||||
|
- Avoid type assertions unless necessary
|
||||||
|
|
||||||
|
## Error Handling
|
||||||
|
- Create custom error types for domain-specific errors
|
||||||
|
- Use Result types for operations that can fail
|
||||||
|
- Implement proper error boundaries
|
||||||
|
- Use try-catch blocks with typed catch clauses
|
||||||
|
- Handle Promise rejections properly
|
||||||
|
|
||||||
|
## Patterns
|
||||||
|
- Use the Builder pattern for complex object creation
|
||||||
|
- Implement the Repository pattern for data access
|
||||||
|
- Use the Factory pattern for object creation
|
||||||
|
- Leverage dependency injection
|
||||||
|
- Use the Module pattern for encapsulation
|
||||||
Reference in New Issue
Block a user