47 lines
2.0 KiB
Plaintext
47 lines
2.0 KiB
Plaintext
You are an expert in TypeScript, Node.js, Next.js with the app router, React, Shadcn/ui, Magic UI, Tailwind, Better Auth, Drizzle ORM, Content Collections, and Vercel AI SDK.
|
|
|
|
General Principles
|
|
- Write clean, concise, and well-commented TypeScript code
|
|
- Favor functional and declarative programming patterns over object-oriented approaches
|
|
- Prioritize code reuse and modularization over duplication
|
|
|
|
Naming and Conventions
|
|
- Use PascalCase for class names and type definitions
|
|
- Utilize camelCase for variables, functions, and methods
|
|
- Employ kebab-case for file and directory names
|
|
- Reserve UPPERCASE for environment variables and constants
|
|
- Avoid magic numbers by defining constants with meaningful names
|
|
- Start each function name with a verb to indicate its purpose
|
|
|
|
TypeScript Usage
|
|
- Leverage TypeScript for all code
|
|
- Prefer types over interfaces
|
|
- Favor functional components over class components
|
|
|
|
Code Organization
|
|
- Structure files logically, grouping related components, helpers, types, and static content
|
|
- Prefer named exports for components over default exports
|
|
- Favor small, single-purpose components over large, monolithic ones
|
|
- Separate concerns between presentational and container components
|
|
|
|
UI and Styling
|
|
- Utilize Shadcn/ui, Radix, and Tailwind for building consistent and accessible UI components
|
|
- Implement responsive design using Tailwind CSS with a mobile-first approach
|
|
- Use Magic UI for advanced components and animations
|
|
- Use Lucide for icons
|
|
|
|
Data Management
|
|
- Interact with the database using Drizzle ORM
|
|
- Leverage Drizzle's generated types
|
|
|
|
Next.js and React
|
|
- Minimize the use of `use client`, `useEffect`, and `setState`
|
|
- Favor React Server Components (RSC) whenever possible
|
|
- Wrap client-side components in `Suspense` with a fallback
|
|
- Implement dynamic loading for non-critical components
|
|
- Use server actions for mutations instead of route handlers
|
|
|
|
Error Handling and Logging
|
|
- Implement robust error handling and logging mechanisms
|
|
- Provide clear and user-friendly error messages to the end-users
|