Hi everyone! Hope you are doing fine in this difficult times.
I'm writing this post because I haven't found any resource really covering this topic other than suggesting Server Side Rendering.
I wanted to know how do you React devs out there deal with SEO in your apps? I have read about using Helmet, but does it really make a difference? I tried setting up my meta tags there but when testing with www.heymeta.com they wouldn't show up.
I wanted to know if there are some best practices to be used in React apps other than going with SSR. At this point I'm kinda afraid of offering my dev services only to find that my clients websites don't actually show up in search engines, lol.
Thank you very much!
Top comments (5)
My suggestion would be for you to get your site registered correctly in Google Webmasters/search tools and make use of the Google tools that it makes available for helping with this.
You can use some of them to help the crawler precache some of your site/get insights and suggestions on how to make specific routes more SEO-friendly.
developers.google.com/search/docs/...
google.com/webmasters/
I ran into the same struggle and would second the suggestions Brandin puts first as a first effort. To beat around this, SSR is ultimately the best solution, but if you’re hosting in a bucket you may have to perform that SSR yourself: dev.to/danquack/caching-spas-for-s...
I suppose SSR is the way to go, huh. Thanks for sharing your post!
Prerender your website, especially for the meta tags part. This can be done with prerender-spa plugins, Puppeteer / JSDOM, web-scraping, or alike. Make sure it works even with JavaScript disabled.
But, yeah, I actually recommend Next.js with Vercel hosting, or full static generation for hosting elsewhere.
As for a third option, I don't know if Cloudflare can pre-cache meta tags on JavaScript-rendered, or SPA websites.
Wouldn't Next.js be a little overkill for a SPA? For example a landing page. I've been reading about Gatsby vs Next, but don't know which one would be more suitable for SPAs. My guess would be Gatsby since the website won't be loading dynamic content. What do you recommend?