JavaScript SEO for Local Business Websites: React and Next.js Checklist

A local business website can look perfect in a browser and still have technical SEO problems. The issue is not that React or Next.js is inherently bad for SEO. The issue is whether search systems and people can reliably access the important content, links, and page metadata.

This guide is for developers and business owners maintaining React, Next.js, or another JavaScript-heavy website. Framework APIs change, so treat code details as implementation patterns and verify them against the version you use.

How Google processes JavaScript pages

Google describes Search processing in three broad phases: crawling, rendering, and indexing. Googlebot can render JavaScript, but rendering is a separate processing stage and not every crawler or external system executes JavaScript in the same way. A page that depends on client-side code for its entire main message can be more fragile than a page whose meaningful content is present in the initial HTML.

For a local service page, the initial response should ideally expose the main heading, service explanation, location context, title, canonical, and crawlable links without requiring a user to click through a complex interface.

Start with the response, not the screenshot

Check a representative URL such as /services/boiler-repair/:

1. Open the page in a normal browser and confirm the content works.
2. View the page source or fetch the HTML response.
3. Check whether the response contains the main content and metadata.
4. Inspect the rendered page with Search Console's URL Inspection tool.
5. Compare what is present in the initial HTML with what appears after JavaScript runs.

A browser screenshot alone does not prove that the correct canonical, robots directives, internal links, or structured data are present in the response Google processes.

Choose rendering that fits the page

For public marketing pages, server-side rendering or static generation is often a practical choice because the main content can be delivered with the HTML. Client-side rendering may still be appropriate for interactive tools, account dashboards, or experiences that depend on user input. Many websites use a hybrid model.

In Next.js, select rendering and caching behavior intentionally for each route. Do not assume that every page is statically generated or that dynamic rendering is a magic SEO fix. The important question is whether the canonical page returns stable, accurate content and metadata.

Useful rules:

• Public service pages should have a stable URL and meaningful content in the rendered document.
• Every important page should have a unique title and meta description.
• The canonical URL should point to the intended canonical page.
• Navigation links should be real crawlable links, typically rendered as anchor elements with valid destinations.
• Error routes should return appropriate HTTP status codes rather than rendering a “not found” message with a successful status.
• Avoid requiring an interaction before the core service text becomes available.

Metadata and canonical URLs

A common SPA mistake is giving every route the same title, description, or canonical. That makes it harder to distinguish pages and can create ambiguity when URL parameters or trailing-slash variants exist.

Create a route-level metadata map and validate it. For a page such as /guides/local-seo-audit-checklist/, its canonical should be the chosen preferred URL for that page, not the homepage or an unrelated guide. Use one consistent URL convention across internal links, sitemap entries, and canonical tags.

Avoid generating canonicals from untrusted query parameters. If filters or tracking parameters do not represent separate indexable content, usually keep the canonical pointed at the clean preferred URL.

Internal links must be discoverable

A visually clickable card implemented only with a JavaScript event handler may be less robust than a proper link. Use meaningful anchor text that tells people and crawlers what the destination contains. Ensure important service and guide pages are reachable through ordinary links, not only through a search box or a sequence of clicks.

For a local business, connect the home page to core services, service pages to relevant FAQs and case studies, and guides to genuinely related guides. Avoid adding every page to every footer just to inflate link counts.

Structured data in JavaScript applications

JSON-LD can be included in server-rendered HTML or generated in a supported client-side process, but the final rendered structured data must be valid and match the visible page. Test it with Google's supported validation tools. Do not add hidden reviews, fake aggregate ratings, or facts that are not visible and accurate.

For LocalBusiness structured data, choose a suitable subtype only when it accurately describes the real business. Markup does not guarantee a rich result or better local ranking.

Common React and Next.js failure patterns

One title for every route: generate unique metadata from route-specific content.

The main copy appears only after a client fetch: consider rendering essential copy on the server or generating the page at build time.

Broken internal links after navigation: crawl the production site, not only local development.

Soft 404 pages: return a true not-found response when a URL does not exist.

Canonical mismatch: align canonicals with redirects, internal links, sitemap URLs, and the preferred slash convention.

Robots directives injected incorrectly: verify the final HTML and response headers, particularly on preview deployments and pages that change from noindex to indexable.

Stale cached content: make cache invalidation and content updates part of the release process.

Preview URLs indexed: protect preview environments and prevent them from becoming competing copies of the production site.

A release checklist for local SEO pages

Before deploying a new batch of pages, test a sample across each page type:

• Homepage.
• Main service page.
• Location page, if the business genuinely serves that location.
• Blog or guide article.
• Contact page.
• A deliberately invalid URL.

For each page, confirm status code, title, description, canonical, robots directives, main content, internal links, images and alt text, structured data where appropriate, and mobile layout. Then inspect important URLs in Search Console after deployment. Indexing is not instantaneous and URL Inspection is not a guarantee of indexing.

How to diagnose a page that is not indexed

First determine whether the URL is known to Google, whether crawling is allowed, whether the server returns a successful response, and whether the canonical points elsewhere. Then inspect rendered content and internal links. Review the relevant Search Console indexing reason rather than repeatedly requesting indexing without fixing the cause.

If a whole group of pages is affected, look for a shared template or deployment error. If only one URL is affected, inspect that URL's content, canonical, links, and response.

FAQ

Is React bad for SEO?

No. The key is how the site delivers and exposes its content, metadata, links, and status codes.

Should every page use server-side rendering?

Not necessarily. Public pages often benefit from pre-rendered content, while interactive application areas may use client-side rendering. Choose based on user needs and technical requirements.

Does valid schema guarantee rankings?

No. Structured data helps describe content; it does not guarantee rankings or enhanced search appearances.

How do I check what Google sees?

Use Search Console's URL Inspection tool and review the rendered result and indexing information. Also test the actual production response.

Why does my page look fine but remain unindexed?

Possible causes include discovery, canonicalization, noindex directives, server errors, duplicate or low-value content, or rendering problems. Diagnose the specific Search Console status before changing the site.

Related Chamko guides

• Why local pages are not indexed
• Sitemap guide for small business websites
• Local business schema markup guide
• Local SEO internal linking strategy
• Core Web Vitals for local business websites

Official references

• Google: JavaScript SEO basics
• Google: URL Inspection tool
• Google: SEO Starter Guide
• Google: LocalBusiness structured data