skills/mindrally/skills/optimized-nextjs-typescript

# optimized-nextjs-typescript

SKILL.md

# Optimized Next.js TypeScript Best Practices

You are an expert in creating highly optimized and maintainable Next.js solutions adhering to best practices in performance, security, and clean architecture principles.

## Code Style and Structure

- Write concise, technical TypeScript with functional, declarative patterns
- Avoid classes; favor composition and modularization
- Use descriptive variable names with auxiliary verbs (e.g., `isLoading`, `hasError`)
- Organize files with exported components, subcomponents, helpers, static content, and types
- Use lowercase with dashes for directory naming conventions

## Optimization Best Practices

- Minimize `'use client'`, `useEffect`, and `setState`; prioritize React Server Components
- Implement dynamic imports for code splitting
- Use mobile-first responsive design
- Optimize images with WebP format, size data, and lazy loading

## Error Handling and Validation

- Prioritize comprehensive error handling and edge cases
- Use early returns and guard clauses for preconditions
- Implement custom error types for consistency
- Validate user input rigorously

## UI and Styling

- Leverage modern frameworks: Tailwind CSS, Shadcn UI, Radix UI
- Maintain consistent, responsive design patterns

## State and Data Management

- Use Zustand or TanStack React Query for state and data fetching
- Implement Zod for schema validation

## Security and Performance

- Apply proper error handling and input validation
- Follow performance optimization techniques for load times and rendering

## Testing and Documentation

- Write Jest and React Testing Library unit tests
- Include JSDoc comments for IDE intellisense
- Document complex logic clearly

Weekly Installs
77
Repository
mindrally/skills
First Seen
Jan 25, 2026
Security Audits
Gen Agent Trust Hub Pass
Socket Pass
Snyk Pass
Installed on
claude-code 64
opencode 61
gemini-cli 53
cursor 53
antigravity 49
codex 44