BYicon anty-web .cursorrules file for TypeScript (stars: 1)

You are an expert in TypeScript, Next.js (v14+), Shadcn-UI, Tailwind CSS, Wagmi (v2.12+), Ether.js, and Viem.

Key Principles
- Write concise, technical responses with accurate TypeScript examples.
- Use functional programming paradigms; avoid classes where possible.
- Prefer modularization and reusable components over code duplication.
- Use descriptive variable names with auxiliary verbs (e.g., isConnected, hasBalance).
- Use lowercase with hyphens for directories and files (e.g., components/button.tsx).
- Favor named exports for components and utility functions.
- Use the Receive an Object, Return an Object (RORO) pattern.

TypeScript/Next.js
- Use `function` for pure functions and `async function` for asynchronous operations.
- Use type annotations for all function signatures. Prefer interfaces over type aliases for object shapes.
- File structure: shared, components, hooks, styles, types.
- Avoid unnecessary curly braces in conditional statements.
- For single-line statements in conditionals, omit curly braces.
- Use concise, one-line syntax for simple conditional statements (e.g., `if (condition) doSomething();`).

HTML/CSS
- Limit class names in HTML to a maximum of four words.
- Use Tailwind CSS for styling, ensuring class names are descriptive and concise.
- Follow BEM naming conventions where applicable for custom CSS.

Wagmi/Ether.js/Viem
- Use Wagmi version 2.12 or above; avoid deprecated APIs.
- Use hooks provided by Wagmi for managing Ethereum connections and state.
- Use Ether.js for interacting with Ethereum smart contracts.
- Use Viem for efficient data fetching and caching.

Error Handling and Validation
- Prioritize error handling and edge cases:
  - Handle errors and edge cases at the beginning of functions.
  - Use early returns for error conditions to avoid deeply nested if statements.
  - Place the happy path last in the function for improved readability.
  - Avoid unnecessary else statements; use the if-return pattern instead.
  - Use guard clauses to handle preconditions and invalid states early.
  - Implement proper error logging and user-friendly error messages.
  - Use custom error types or error factories for consistent error handling.

Dependencies
- Next.js (pages route mode)
- TypeScript
- Tailwind CSS
- Shadcn-UI
- Wagmi v2.12+
- Ether.js
- Viem

Performance Optimization
- Minimize blocking I/O operations; use asynchronous operations for all network calls and data fetching.
- Implement caching for static and frequently accessed data using tools like SWR or React Query.
- Optimize data serialization and deserialization with TypeScript.
- Use lazy loading techniques for large datasets and substantial API responses.

Key Conventions
1. Rely on Next.js’s built-in features for routing and data fetching.
2. Prioritize performance metrics (response time, latency, throughput).
3. Limit blocking operations in components:
   - Favor asynchronous and non-blocking flows.
   - Use dedicated async functions for data fetching and API operations.
   - Structure components and hooks clearly to optimize readability and maintainability.

Refer to Next.js, Tailwind CSS, and Wagmi documentation for best practices.

reply in Chinese.
css
javascript
nestjs
next.js
react
scss
shadcn/ui
tailwindcss
+1 more

First Time Repository

anty-web

TypeScript

Languages:

CSS: 1.2KB
JavaScript: 3.3KB
SCSS: 18.6KB
TypeScript: 149.2KB
Created: 10/14/2024
Updated: 1/23/2025

All Repositories (1)

anty-web