Server Side Rendering Individual Component to String
Amnesthesia opened this issue · 1 comments
I've been trying to figure out how to load a .tsx file with a React component and render this to a HTML string that I could write to a file for a while now, without luck.
What I'm trying to do is generate a PDF from HTML on the server, without having to use WickedPDF or user interaction on the client-side. We have a couple of components used for e.g Invoice generation and other PDFs in our system, and as we build our UI in React, we end up duplicating a lot of this and the server-generated PDFs (using Prawn) look very different from the beautiful React versions — just that we can't generate those as PDFs and send on the server.
We use TypeScript and Webpack to bundle and codesplit on the frontend and aren't rendering the main pages using react-rails, and when trying to use <%= react_component("Post", {title: "Hello World"}) %> this in consoles, if I do manage to find the component containing e.g <div data-react-class="HelloMessage" data-react-props="{"name":"John"}"></div> isn't exactly what I'm looking for, but what I'm looking for is the final HTML given a set of props for a dumb component
I feel like I'm on deep water here and it may very well not be possible to do what I want to do here, and perhaps I'm better off creating a webpack config and somehow doing this in node, but I thought I'd ask
TL;DR: Is it possible (and if it is, could somebody point me in the right direction for where to begin?) to render a single dumb react component with a set of props to its final HTML as a string?
trying to figure out how
That's better for https://github.com/reactjs/react-rails/discussions