Generate CSS for Server Side Rendering in React - Material-UI

user_6086095 0
Viewed 372

I'm trying to generate CSS for Server Side Rendering according to Material UI - Server Rendering

I'm using React on Rails with PHP (React Bundle) is any other way to generate CSS? In docs we providing all whole content in one request in JS. In my case I must provide component to twig and next separately CSS. Any other ways?

symfony server-side-rendering reactjs css php
1 Answers

I guess you can pass the CSS with the html template to client like, I did the same in one of my project.

const cssStyleTage = extractCSSFromMaterialUIServerSideAPI();
const componentStream = someHtmlConten;

const html = `
  <!doctype html>
    <html>
    <head>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      ${cssStyleTage}
    </head>
    <body>
        <div id="root">
            ${componentStream}
        </div>
    </body>
    </html>`;

// pass it to client, this you can open in any iframe at client side.
res.status(200).send(html);

// or otherwise just send the css styles separately.
res.status(200).send({
  cssStyleTags: cssStyleTage,
  html: componentStream
});

Am just giving an idea what are the possible ways this can be done, if that can help you to achieve your task.

user_57946940
Related