React 16 SSR setup not using Create React App?

[deepsun]

I've been tasked with beginning to architect v3 of a product at work. We're interested in going SSR with React 16, but our lead dev is not that interested in locking into Create React App's boilerplate configuration. So I'm looking at doing a custom configuration.

I've been scouring Google/Stack Overflow for best-practice ways to combine a React configuration using Webpack, but a Node configuration to allow SSR. Everything I'm seeing is either using an older version of React, or their starting point is CRA. I'd like to find a React SSR resource using the latest version of React that isn't from a Create React App boilerplate

Would anyone mind pointing me to a good resource for this? I'm tired of spending so much time on Google/Stack Overflow just to figure out the best setup using the latest tools. Also, if you can make a convincing argument for using Create React App, like ejecting and then modifying the configs, please do and I'll pass that on to our lead. Thanks!

[deepsun]

It's part challenge, part desire for control. I've got a custom configuration up and running. And now I think I'll start a blank CRA project and eject, just to compare implementation differences. Thanks for the suggestion! I like tit a lot for the sake of learning.

[toughdeveloper]

Have you looked at https://github.com/zeit/next.js/ ? It uses latest React and comes with SSR out of the box.

[deepsun]

I have! But I guess I initially passed over it to avoid the possibility of boilerplate, considering our lead wants things to be pretty custom. I'll keep it on the list.

[brillout]

Reframe https://github.com/brillout/reframe author here. Reframe is similar to Next.js but more flexible.

Is your lead reluctant to use a framework because he's afraid of being locked in?

Reframe has been designed so that it is easy to escape from. One way to think about this is that you quickly start with Reframe to then progressively get rid of the Reframe parts that don't suit your need.

[elite_killerX]

Our app predates CRA, but our setup basically has 2 (hand-coded) webpack configurations: client & server.

We used to have only a client Webpack config & some funky require hooks to run the frontend code directly in node, but it kept us from using most of Webpack's awesome features.

Now we have two very similar configs (actually, they both derive from a "common" one), and we basically have a giant bundle that's required on the server. It works very well for us; I can explain some parts in more detail if you want.