react-ssr | : ledger : A react ssr demo | Server Side Rendering library

I am trying to do SSR for a React App made with Redux, Saga, and ConnectedRouter. I found a couple of relevant examples, specifically https://github.com/mnsht/cra-ssr and https://github.com/noveogroup-amorgunov/react-ssr-tutorial

Those I understand supposed to work. I am however having a problem hooking state and history.

My loader code is below:

I'm trying to parse a markdown table using react-markdown and rendering the resulting tags using the Material-UI table component. Here's my renderer:

I know there is topic on why this error occurs on here. My question is how to fix it in the NextJS environment and babel to produce chunks that don't include the spread operator in an object. Here is the background.

I need to support Edge18 where the spread operator is not supported in object destructing. It produces the error:

SCRIPT1028: SCRIPT1028: Expected identifier, string or number

The error is caused by this line:

My Next JS website was working perfectly, one day when I tried to install Apollo Rest from here https://www.apollographql.com/docs/link/links/rest/#gatsby-focus-wrapper I began having a lot of errors. I discard any changes in packages.json, removed packages-lock.json, node_modules and dust file and folders. But keep getting the next error:

I have simple running react Server Side App .

GitHub Link for the repo, in the local env i have a build script that runs using npm start which starts the client and server builds and then i have a watcher which listen's to changes in file. This set up works really well locally.

I am trying React SSR using Redux and Redux-saga.

I am able to get the Client Rendering to work but the server store never seems to get the data / wait for the data before rendering the HTML.

server.js

I'm using material-ui with SSR. I've set up the SSR machinery on my app according to the instructions on the material-ui docs. It does work, but not without a rendering issue that so far has been very hard to debug. More details follow.

SSR + loading state (which causes the comp. in question to not render in one of the SSR rendering passes, more on that below) cause inconsistent ID in the className of a specific component that renders on the second SSR rendering pass but not on the first (because its rendering is conditioned to having the data available).

This causes the markup sent from the server to have a different CSS class name for this component, causing a visual inconsistency in when hydration happens, as you may see below:

SSRed component:

Hydrated component:

The actual class available in the DOM is:

I've been developing a project with a simple authorization using cookies and apollo-client. The challenge is, sometimes when I try to useQUery(isAuthenticatedQuery) they retrieve correct data and sometimes not. This query is used to check if my users is loggedIn, I sent in my request Header the token returned after my LoginMutation. I've already checked my request in the network tab and when I got error is when the header is sending "bearer undefined" instead of "bearer ${token}".

It's my first app using apollo so probably it's a dummy question, I was thinking there was some issue with the asynchronous request, but all the requests in useQuery are already async, right?

login.tsx

I'm trying to implement SSR using React (create-react-app) and Firebase. To do so, I'm currently working on my webpack configuration following this tutorial and github dir: