Does it support Incremental Static Regeneration (ISR)?

Yes, it includes implementation guides for both time-based revalidation and on-demand revalidation using revalidatePath and revalidateTag.

Does it include error handling patterns?

Yes, the skill provides templates for managing fetch-specific failures and implementing Next.js error boundaries with 'error.js' files.

Can this skill help reduce page load times?

Absolutely. It focuses on parallel data fetching and streaming with Suspense to prevent data-fetching waterfalls and improve perceived performance.

How does this skill help with the Next.js App Router?

It provides patterns specific to React Server Components and the 'fetch' API enhancements used in the App Router, moving away from legacy patterns like getServerSideProps.

Is it compatible with external APIs?

It is specifically designed to manage fetching data from any REST or GraphQL source into a Next.js environment using optimal caching strategies.

Next.js Data Fetching

Name: Next.js Data Fetching
Author: TheBushidoCollective

byTheBushidoCollective

•

API開発

Implements modern Next.js data fetching patterns including SSG, SSR, ISR, and streaming to build high-performance React applications.

概要

The Next.js Data Fetching skill equips Claude with specialized knowledge to implement React Server Component patterns for efficient data retrieval within the Next.js App Router. It provides standardized implementations for Static Site Generation (SSG), Server-Side Rendering (SSR), and Incremental Static Regeneration (ISR), alongside advanced techniques like on-demand revalidation and parallel fetching. This skill is essential for developers building data-driven applications who need to optimize for performance, SEO, and real-time updates while maintaining clean code structures for loading states and error handling.

主な機能

Parallel data fetching techniques to reduce waterfall delays and improve TTI
On-demand revalidation implementations using path-based and tag-based invalidation
Standardized caching strategies including force-cache, no-store, and time-based revalidation
Dynamic route generation patterns using generateStaticParams for large-scale datasets
Streaming UI patterns utilizing React Suspense and custom loading skeletons
72 GitHub stars

ユースケース

Building SEO-optimized e-commerce product catalogs with static generation and incremental updates
Implementing complex CMS-backed blogs with tag-based cache revalidation for instant content updates
Creating high-performance dashboards that stream real-time data using server-side rendering

概要

主な機能

Parallel data fetching techniques to reduce waterfall delays and improve TTI
On-demand revalidation implementations using path-based and tag-based invalidation
Standardized caching strategies including force-cache, no-store, and time-based revalidation
Dynamic route generation patterns using generateStaticParams for large-scale datasets
Streaming UI patterns utilizing React Suspense and custom loading skeletons
72 GitHub stars

ユースケース

Building SEO-optimized e-commerce product catalogs with static generation and incremental updates
Implementing complex CMS-backed blogs with tag-based cache revalidation for instant content updates
Creating high-performance dashboards that stream real-time data using server-side rendering