## 1. Project Structure
- Use consistent folder organization
- Separate concerns (components, hooks, utilities, types)
- Follow Next.js recommended project structure

## 2. TypeScript Rules
- Use strict mode
- Always define explicit types
- Avoid `any` type
- Use interfaces and type aliases
- Implement proper type narrowing

## 3. Code Quality
- Follow ESLint and Prettier configurations
- Keep functions small and focused (single responsibility)
- Write clean, readable, and maintainable code
- Use meaningful variable and function names
- Add JSDoc comments for complex logic

## 4. Performance Optimization
- Implement code splitting
- Use React.memo for component memoization
- Leverage useMemo and useCallback hooks
- Minimize unnecessary re-renders
- Use dynamic imports

## 5. State Management
- Prefer React Context for global state
- Use Zustand for complex state management
- Avoid prop drilling
- Keep state immutable
- Centralize state logic

## 6. Data Fetching
- Prioritize Supabase for backend operations
- Use React Query for data fetching
- Implement proper error handling
- Add loading states
- Cache server-side data

## 7. Security Practices
- Validate and sanitize all user inputs
- Implement proper authentication checks
- Use Supabase RLS (Row Level Security)
- Never expose sensitive information
- Use environment variables

## 8. Error Handling
- Create global error boundary
- Log errors with context
- Provide user-friendly error messages
- Handle async operations carefully
- Use try/catch blocks

## 9. Styling
- Use Tailwind CSS utility classes
- Create reusable component styles
- Maintain consistent design system
- Implement responsive design
- Avoid inline styles

## 10. Testing
- Write unit tests for critical components
- Use Jest and React Testing Library
- Aim for high test coverage
- Test edge cases
- Mock external dependencies

## 11. Git Workflow
- Use feature branch workflow
- Write descriptive commit messages
- Use conventional commits
- Implement PR review process
- Squash commits before merging

## 12. Performance Monitoring
- Use Vercel analytics
- Implement performance logging
- Monitor bundle size
- Use Lighthouse for audits
- Track critical web vitals

## 13. Accessibility
- Follow WCAG guidelines
- Use semantic HTML
- Implement proper aria attributes
- Support keyboard navigation
- Test with screen readers

## 14. Internationalization
- Use next-18next for translations
- Support multiple language contexts
- Design with text expansion in mind
- Implement language switcher

## 15. Environment Configuration
- Use .env.local for local secrets
- Never commit sensitive information
- Use different env files per environment
- Validate environment variables