This post is also available in different formats so you can read on the go or share it around!
React is concerned with the UI of your application and typically targets the frontend of your web application. There is however a use-case for running React on your server, SSR.
How do you use React on the backend?
Using Node.js, you can simply import React DOM Server and start using it.
// ES modules
import ReactDOMServer from "react-dom/server"
// CommonJS
var ReactDOMServer = require("react-dom/server")
Then you can turn a react component into HTML with one of the following methods.
Render as a string
ReactDOMServer.renderToString(element)
This method can be used on the frontend and/or the backend.
Render as a Node Stream
ReactDOMServer.renderToNodeStream(element)
This method only works on the server because Streams don't work on the browser.
This is how you can use React on the backend to generate HTML from your React app. This can be used to make your app faster by pre-rendering the page before making it interactive on the client or even statically rendering your app if you don't even need interactivity on the frontend.
