How to create a site where changes made in the WordPress site automatically reflect in the Next.js site?
I searched everywhere on Google and YouTube but didn't get a positive response. I hope to receive a helpful reply on Stack Overflow.
Comment (1)
Jese Leos
September 25, 2024
Verified user
Assuming you are using next 14.
You should use Incremental Static Regeneration
On-demand revalidation with revalidatePath
For a more precise method of revalidation, invalidate pages on-demand with the revalidatePath function.
For example, this Server Action would get called after adding a new post. Regardless of how you retrieve your data in your Server Component, either using fetch or connecting to a database, this will clear the cache for the entire route and allow the Server Component to fetch fresh data.
'use server'
import { revalidatePath } from 'next/cache'
export async function createPost() {
// Invalidate the /posts route in the cache
revalidatePath('/posts')
}
Basically when data changes you call a route on your next app to revalidate the cache.
Jese Leos
September 25, 2024
Verified user
Assuming you are using next 14. You should use Incremental Static Regeneration On-demand revalidation with revalidatePath For a more precise method of revalidation, invalidate pages on-demand with the revalidatePath function. For example, this Server Action would get called after adding a new post. Regardless of how you retrieve your data in your Server Component, either using fetch or connecting to a database, this will clear the cache for the entire route and allow the Server Component to fetch fresh data. 'use server' import { revalidatePath } from 'next/cache' export async function createPost() { // Invalidate the /posts route in the cache revalidatePath('/posts') } Basically when data changes you call a route on your next app to revalidate the cache.