ufocoder / redux-universal-boilerplate

Boilerplate for react universal (isomorphic) application based on flux architecture (redux implementation)
MIT License
72 stars 19 forks source link

No server errors in the console #26

Closed RIP21 closed 7 years ago

RIP21 commented 7 years ago

Since we have pm2 to launch a server. It's possible that all server console errors are now swallowed in the console, which is made it very hard to debug any possible problems with a server. I have probably a server error while transferring my project. It's just started loading page and do it endlessly with no result, but no errors in the console in the same time so I can debug it somehow and understand what's happening.

ufocoder commented 7 years ago

@RIP21 I've changed pm2 to nodemon to resolve this issues

quickshiftin commented 7 years ago

Hi @ufocoder I'm having a similar problem. On one of my pages if I go directly to the page in the browser, it spins and never loads. If I go to another page to start, then to the one I'm having a problem with the server rending, the client renders it with no errors in the browser console.

There must be something the server doesn't like tying to build the page, but there are no errors on the server console (using npm run watch). How can I track down the problem?

RIP21 commented 7 years ago

@quickshiftin IMHO. This project is not supported much anymore. It's better to move to something like next.js and analogs. If @ufocoder prove me wrong :D I will be happy. But this really needs a total rewrite since it quite outdated. react-boilerplate have some plans to add server-side-rendering from what I know. So it's a nice alternative with open config. If you don't like to use next.js https://github.com/react-boilerplate/react-boilerplate

quickshiftin commented 7 years ago

@RIP21 Thanks a lot for your feedback! I'm still fairly new to React and this was the first little framework I found for doing universal apps that I liked. I'll take a look at next.js; I see it has a lot of stars :D

RIP21 commented 7 years ago

@quickshiftin you are welcome. Next.js have some learning curve, but it's WAY WAY WAY more predictive and easy to deal with this learning curve than with this custom config hell. Highly recommend it. Also if you don't need SSR, create-react-app is the best thing to stick to. (if you need slightly tunning its setup without eject react-app-rewired it is another way to go) With all this tooling developed last year boilerplates start to become a quite useless thing :) Encapsulated configs FTW! Also, take a look to Prettier :) And CSS-in-JS solutions. Like styled-components and glamorous. (just some promotion of amazing things that I really LOVE) Good luck with learning React :)

ufocoder commented 7 years ago

@quickshiftin Use this boilerplate as education material as @RIP21 wrote some concepts really outdated, for example it would be great if project:

@quickshiftin This project can be a good start point to build your own boilerplate or to dive into other. Current boilerplate could be updated, but I can't promise when it will be. Now all my free time is investing in other pet-project

quickshiftin commented 7 years ago

@ufocoder Thanks for this. It's definitely helping me learn. I think I will move on to something else like what @RIP21 suggested, however for now, I just want to get my little demo app out haha!

I was able to track down the problem, in src/server/index.js, it seems there were some missing res.send() calls where exceptions are caught. This is what I added:

--- a/src/server/index.js
+++ b/src/server/index.js
@@ -104,11 +104,15 @@ app.use((req, res, next) => {
                 res.status(isNotFound ? 404 : 200);
                 res.send(doctype + html);
             } catch (err) {
+                console.log(`Server failed to render React; underlying error: ${e.toString()}`);
                 res.status(503);
+                res.send('Server Error, please contact site administrator');
             }
         })
         .catch(() => {
+            console.log(`Server failed to run fetch; underlying error: ${e.toString()}`);
             res.status(503);
+            res.send('Server Error, please contact site administrator');
         });
     });