Next.js data fetching - Server actions, caching, revalidation
Handles Next.js data fetching with server actions, automatic caching, and revalidation strategies. Use when building server-side mutations or fetching data with time-based/on-demand cache invalidation.
/plugin marketplace add pluginagentmarketplace/custom-plugin-nextjs/plugin install custom-plugin-nextjs@pluginagentmarketplace-nextjsThis skill inherits all available tools. When active, it can use any tool Claude has access to.
assets/config.yamlassets/schema.jsonreferences/GUIDE.mdreferences/PATTERNS.mdscripts/helper.pyscripts/validate.pyModern data fetching in Next.js with server actions, caching strategies, and revalidation.
// Server Action
'use server'
export async function createPost(formData: FormData) {
const title = formData.get('title')
await db.posts.create({ title })
revalidatePath('/posts')
}
// Data fetching with caching
async function getData() {
const res = await fetch('https://api.example.com/data', {
next: { revalidate: 3600 } // Revalidate every hour
})
return res.json()
}
cache: 'force-cache' - Default, cachedcache: 'no-store' - No cachingnext: { revalidate: N } - Revalidate after N seconds