I have a react app hosted on DigitalOcean but would like to change meta tags in the HTML file before it’s sent to the client. I’m trying to have link previews with specific images, descriptions, etc., that are all stored in our database (MongoDB).
I’ve been looking into different possible solutions for dynamic meta tags in React. It looks like all solutions point to server side rendering (SSR). SSR does not seem possible with the way we have our website set up (React front end on one repo and Node backend on different repo). I found this possible solution (LINK) but our hosting platform, DigitalOcean, does not have something similar to Edge Functions.
All of this brings me to my question. Can you have two frontends? React, which we already use, and one with NextJS (or whatever works)? When a user clicks on "example.com/blog" they get the React page but when they go to "example.com/blog/post-1" they get a NextJS page with its own html tags. I don’t want to rebuild the entire site from scratch.
I hope I explained this well and any help would be much appreciated.
2
Answers
Considering Nextjs is a react framework, it would be fairly easy to convert your react app into Nextjs. It would not only help you with your this issue but would also ease up your future development of the website.
Next.js is a React framework, so if you need Next.js you could just go from React to Next.js, here is a link that might help you https://nextjs.org/learn/foundations/from-react-to-nextjs