Our great sponsors
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
Just like the way that the get*Props methods above make serverside decisions and then inject the data into the initial HTML, you'd handle your server-side constructed Redux store similarly. Essentially what you're looking for is a flow like getServersideProps is fired on the server and it creates a store => any dispatches and updates are made to this store => this getServersideProps function returns a prop to the page with a prop that's something like INITIAL_REDUX_STATE, and then on the client, your custom App component uses that prop as the 'initial State' value when constructing the client-side store. This is the trickiest thing in your whole post to get right, I would say I found a lot of good inspiration from this official Next examples repo. The only difference I had to make to make this work correctly, was once the state is already created, I needed to deepmerge the initial and pre-existing states in order to no overwrite values.
I fail to see any good example of getServerSideProps and redux. I've seen this: https://github.com/kirill-konshin/next-redux-wrapper#getserversideprops. Does it make sense to trigger a redux-thunk in the example there instead of `store.dispatch({type: 'TICK', payload: 'was set in other page'});`
There's also next-auth to help with a lot of authentication, however I've never used it so I'm not sure what it does and does not cover out of the needs you listed here.