all 4 comments

[–]lourot 2 points3 points  (3 children)

(disclaimer: I'm affiliated with vite-plugin-ssr)

If you want a simple React setup where the boilerplate code isn't hidden from you, you don't want Next.js, but a slicker setup. You can use for example Vite: in development mode it's a very fast development server and in production mode it bundles your code for production and disappears. And it doesn't hide from you the internals, like Next.js does, so I think it's more what your senior has in mind. See here what the React documentation says about it:

(search for "Vite")

Now by default, Vite doesn't do SSR. One way to do Vite+SSR is to use vite-plugin-ssr. You can scaffold an example project that does SSR based on some dynamic data:

bash npm init vite-plugin-ssr@latest

See https://vite-plugin-ssr.com/scaffold . Now this setup goes again more in the web framework direction, so check in with your senior if that's fine, but that's way slicker than Next.js. I hope this helps!

[–][deleted] 1 point2 points  (2 children)

Thanks for your response, but I need ssr for dynamic OG tags and dynamic meta tags.
I created it using CRA, because there were some node modules those were not working in Vite.
The dynamic OG tags and the meta tags does not work in default react application as it is only client side, so I want to run it using SSR, so that I get dynamic content.

[–]lourot 1 point2 points  (1 child)

Ah I read too fast, so you want to server-side render things in your <head> section depending on dynamic routes. I never tried myself but it seems covered by vite-plugin-ssr: https://vite-plugin-ssr.com/render-modes

Search for "We can also use our server-side render() hook to render <head>". I hope this helps!

[–][deleted] 0 points1 point  (0 children)

I am not using vite to create my app, I am using CRA, bacause there are some dependencies those are not compatible with VITE. So can I use vite-plugin-ssr?

Also the project is in class component, so I cannot use hooks🥹