Does it support monorepo structures?

Yes, it is designed with standard monorepo layouts in mind, utilizing package scopes like @project/ and organized app-specific paths.

What is the primary focus of the Frontend Patterns skill?

It focuses on the data layer of React/Next.js applications, specifically handling API interactions via ORPC and state management via TanStack Query.

How does this differ from the frontend-design skill?

While frontend-design handles visuals and styling, frontend-patterns manages data fetching, mutations, and the underlying logic connecting the UI to the backend.

Which libraries are used for notifications and errors?

The skill standardizes on using Sonner for toast notifications to provide consistent success and error feedback during data mutations.

Frontend Data Patterns

Name: Frontend Data Patterns
Author: grmkris

bygrmkris

API Development

Implements standardized React and Next.js data patterns using TanStack Query and ORPC for robust state management.

About

The Frontend Data Patterns skill provides Claude with specialized knowledge for architecting the data layer of modern web applications. It focuses on TanStack Query (React Query) hooks, ORPC client integration, and consistent error handling strategies. By utilizing this skill, developers can quickly generate type-safe fetching and mutation logic, manage cache invalidation seamlessly, and ensure a standardized project structure across Next.js monorepos. It serves as the logical logic-heavy counterpart to visual design skills, handling the essential 'plumbing' of the application.

Key Features

Consistent error handling with Sonner toast notifications
Standardized TanStack Query hook generation
Type-safe ORPC client integration patterns
Automated cache invalidation for data consistency
Monorepo-optimized file structure and pathing
0 GitHub stars

Use Cases

Scaffolding type-safe data fetching hooks for Next.js components
Setting up query clients and authentication providers in a monorepo
Implementing complex API mutations with automatic UI feedback

About

Key Features

Consistent error handling with Sonner toast notifications
Standardized TanStack Query hook generation
Type-safe ORPC client integration patterns
Automated cache invalidation for data consistency
Monorepo-optimized file structure and pathing
0 GitHub stars

Use Cases

Scaffolding type-safe data fetching hooks for Next.js components
Setting up query clients and authentication providers in a monorepo
Implementing complex API mutations with automatic UI feedback