Using react-snap for SEO

Question

I'm using react snap for SEO.

Here's what I did.

I added the following to index.js in my react application

import React from 'react';
import { hydrate, render } from "react-dom";

const rootElement = document.getElementById("root");
if (rootElement.hasChildNodes()) {
    hydrate(<App />, rootElement);
} else {
    render(<App />, rootElement);
}

Then I added the following to package.json

"postbuild": "react-snap"

When I run npm run build, and do View Source on the pages, I don't see the real time meta description and title that I need for the page.

What am I doing wrong?

Here's how I set the meta tags.

In BookDetail.jsx

import {Helmet} from "react-helmet";
<Helmet>
    <meta charSet="utf-8" />
    <title>{this.state.book.title} by {this.state.book.author} | Sumizeit</title>
    <meta name="description" content={this.state.book.desc}/>
</Helmet>

Answer 1

do not use react-snap just change to next.js (react-snap so many problems: refresh error on protected routes, build time no joke, inline css)...by the way there is nothing wrong in your code