CODEWITHSUNDEEP
reactjsdeploymentserver-side-rendering
Shweta Gulati
Shweta Gulati

Reputation: 606

How to deploy React App on production with Server Side Rendering

I have created my application using create-react-app. It is working fine with SSR. Everything is in place but I don't know how to deploy it? What I ideally want is : Generate a build folder and will upload in cdn. Want to serve my static assets from there. I want to create a distribution from my code and take that to another machine to deploy. I am not able to figure out how to do highlighted part. How can I create bundle for server? npm run build creates my bundle for client.

PS: I am using React libraries like React Router 4, Redux.. in my application. Hope this does not affect my answer. For SSR , I have used express.

Upvotes: 8

Views: 5108

Answers (2)

Jesus Berrio
Jesus Berrio

Reputation: 43

I tried whit Firebase, but I can't, In the function's documentation says that execute the function can't be more than 60s, and my function takes more. When I deployed other basic functions, it deploys without problems. And If you achieve deploy it, give you a status 403, because you have to put the function in public mode.

If you want to deploy an app whit SSR make it whit Express, like in my case, you can deploy it like an API. You can deploy it too whit Doker using AWS or Google cloud.

Heroku is the easiest way to do it, but I don't want to have all my apps here.

Upvotes: 0

Antony Budianto
Antony Budianto

Reputation: 111

Server side rendering means you need a server (which is express) that will serve all the requests: server-rendered pages, including the static assets. So CDN is not enough. You might want to try following free cloud services that support Node server:

You can create server bundle using Webpack, with target: "node" and use https://www.npmjs.com/package/webpack-node-extenals.

The details can be complicated, so you can just visit https://github.com/antonybudianto/react-ssr-starter/blob/master/config/webpack.server.config.babel.js for the reference.

Upvotes: 4

Related Questions