reactjsnext.jsseo

SEO for dynamic pages

We have an app where the Admin adds events dynamically.

Let's say our event has a URL : abc.com/100/Rishikesh-Retreat or abc.com/100/Mumbai-Retreat

Now, my query is how Google will index these dynamic pages. Shall I update my sitemap.xml every 24 hours using cron job and then shall I ask Google to crawl the site manually? Can we automate the part where we ask Google to crawl our website once the sitemap is updated?

We are using React and have a simple Node Server that serves the site and updates the metadata tags.

We were planning to move to Next JS if it helps with SEO for dynamic pages.

Our aim is that the dynamic pages should get indexed and when we search for them the results should appear on the first page.

Solution

  • from next sitemap docs

    Good to know: sitemap.js is a special Route Handlers that is cached by default unless it uses a dynamic function or dynamic config option.

    if you add sitemap.ts in your app directory and run npm run build, it will create a static route

    enter image description here

    This means when you visit your sitemap url http://localhost:3000/sitemap.xml sitemap special route handler will be called. you probably have seen creating dynamic sitemap code. For example from here

    // app/sitemap.js

import { getSortedPostsData } from "../lib/posts";

const URL = "https://claritydev.net";

export default async function sitemap() {
  const posts = getSortedPostsData.map(({ id, date }) => ({
    url: `${URL}/blog/${id}`,
    lastModified: date,
  }));

  const routes = ["", "/portfolio", "/blog"].map((route) => ({
    url: `${URL}${route}`,
    lastModified: new Date().toISOString(),
  }));

  return [...routes, ...posts];
}

    With those being sad, everytime your sitemap url is called you have to make sure sitemap() cache gets invalidated and you make a fresh sitemap() call. I did not test this but if you try to add this on top of "app/sitemap.js"

     export const dynamic = 'force-dynamic'

    after this setting, if you rebuild your app, /sitemap will be dynamic:

    enter image description here