Skills Directory

affaan-m/ECC

frontend-patterns

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices. Use when building or reviewing React or Next.js components, state, or render performance.

3.3K installs 246K starsUpdated Sep 3, 2026License: MIT

Install

npx skills add affaan-m/ECC@frontend-patterns

Runs in your terminal. Adds the skill globally for Claude Code, Cursor, Codex and others; add -g -y to skip prompts.

What it does

Frontend Development Patterns Modern frontend patterns for React, Next.js, and performant user interfaces. When to Activate - Building React components (composition, props, rendering) - Managing state (useState, useReducer, Zustand, Context) - Implementing data fetching (SWR, React Query, server components) - Optimizing performance (memoization, virtualization, code splitting) - Working with forms (validation, controlled inputs, Zod schemas) - Handling client-side routing and navigation - Building accessible, responsive UI patterns Privacy and Data Boundaries Frontend examples should use…

Excerpt from the skill's own SKILL.md. Read the full file on GitHub before installing: skills run with your agent's permissions.

View source on GitHub

Before you install

Skills are plain text instructions the agent follows, sometimes with scripts. Check the source, prefer repositories with many installs and stars, and read any script it ships.

Categories

Related skills

  • backend-patterns

    affaan-m/ECC

    Backend architecture patterns, API design, database optimization, and server-side best practices for Node.js, Express, and Next.js API routes. Use when building or reviewing Node.js, Express, or Next.js API routes and their data access.

    3.3K installs 246KDesign & UIReact & Next.jsSecurity
  • security-review

    affaan-m/ECC

    Use this skill when adding authentication, handling user input, working with secrets, creating API endpoints, or implementing payment/sensitive features. Provides comprehensive security checklist and patterns.

    3.3K installs 246KSecurityDataCode review
  • coding-standards

    affaan-m/ECC

    Baseline cross-project coding conventions for naming, readability, immutability, and code-quality review. Use detailed frontend or backend skills for framework-specific patterns. Use when reviewing code quality or naming with no framework-specific skill that applies.

    3.1K installs 246KDesign & UIReact & Next.jsCode review
  • docker-patterns

    affaan-m/ECC

    >

    3.1K installs 246KSecurityDeploy & DevOpsCode review
  • frontend-slides

    affaan-m/ECC

    Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.

    3.1K installs 246KDesign & UIAnimationOffice documents
  • api-design

    affaan-m/ECC

    REST API design patterns including resource naming, status codes, pagination, filtering, error responses, versioning, and rate limiting for production APIs. Use when designing or reviewing REST endpoints, resource names, status codes, pagination, or versioning.

    3.0K installs 246KDesign & UICode reviewProductivity

← Search skills

/skills/affaan-m/ECC/frontend-patterns/