Page created with ReactJs is not indexed by google

Question

I have a news section created with ReactJs, each news post acts as an individual page. Unfortunately Google is not indexing these pages because of REactJs. I tried to use the babel-polyfill webpack, but it's still not working. Also, I'm making my Ajax call BEFORE rendering the DOM.

Any other ideas for another workaround on this?

Answer 1

the google crawler won't wait for async requests to resolve, and because your pages are rendered on the users' client, they will appear to be empty pages.

You have two options. Either modify your app to render on the server, this is often called a universal app, or an isomorphic app. There are many tutorials for creating these. The other option is to pre-render static html from your code so that the crawler can see what should be there. There are numerous libraries you can use for this.

The first option is more extensible and probably preferable, but a bit more complex. So make the choice about whats more appropriate for you