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

Again, I'm not sure if that's the only problem with your code, but try to rewrite the cloud code function call to something like this:

This was an issue with next-redux-wrapper.

Ref.:
https://github.com/kirill-konshin/next-redux-wrapper/issues/385
https://github.com/kirill-konshin/next-redux-wrapper/pull/384

It is fixed in this commit, release.

Please upgrade to v7.0.2 to resolve this problem.

The request is being called on client side cause you have written const { data } = useQuery(QUERY); in Profile Component. So when component is rendered on client side then that query is called.

If you want to call that query only on server side i.e ssr then use getServerSideProps method and in that call the given query and pass the result as props to the Profile Component

Example:

Turns out, my loader was missing saga support. Fixed it. Now, it looks like:

I had the same issue. I solved it by not passing all the props further down to material components.

You can see what I used to theme the markdown with material ui in the component in this gist: https://gist.github.com/boganegru/a4da0b0da0b1233d30b10063b10efa8a

One of your dependencies is not using ES5-compliant code for older browsers and will need to be transpiled.

You need to narrow which dependency is producing this code and transpile it using babel. This dependency can be the result of a sub-dependency to a main dependency, so you may have to traverse the entire dependency tree all the way down to find the culprit. A simple example would be: @nivo is a React charting package that has a sub-dependency called d3-scale which dropped support for IE11 and can't be polyfilled, therefore it needs to be transpiled by babel to work in IE11:

next.config.js

I found where is the problem, one of my websites link getting undefined value. I am using 'next/link' component. But it's not logical to get all these three exceptions for an undefined URL passed to that linked. I think NextJS development team should review more how they are logging an exception. And even if I passed undefined for that component, there should be a check for that, not the whole website should go down.

I am not using heroku cli and not planning on using it

You should and I really recommend, as it's the best way to see errors that occurs after the build, why your app crashed and see the full logs. Even though you can see the logs from your heroku dashbord (More -> View logs), this only gives you the tail of the logs.

How can we make sure this small React SSR git repo deploys and i am able to access the home page.

Make sure the server is listening on the right port by using process.env.PORT as heroku expose a dynamic port.

I was able to find one way to get around this problem ,But this is not that clean of a solution and i do-not want to do it for every loadData method + the saga . I was able to abstract it is there a cleaner way of achieving this as i am still not satisfied with the answer

loadData in Component