Random Quote Machine
- Integrated forismatic random quote api
- Integrated Twitter Web intent
- Codepen Demo
Random Quote Machine
OS – Window 7 , Browser – Chrome 47.0.2526.80m , Livereload – 2.0.8
You have set up gulp with react and when you make changes in HTML it is not getting refreshed once you hit save button. Hmm then debugging this is a challenge because console will not show any error and you will keep on looking in your code to find some issue.
After, making sure that nothing is wrong in code and googling you might end up to read unanswered threads and information here and there. I spend almost 2 days to debug and fix the issue.
Here are some steps which helps me to debug this issue
After maximum attempt to connect to LiveReload following error will be displayed in console(F12 in Chrome)
WebSocket connection to ‘ws://localhost:35729/livereload’ failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED
Now, we know the actual problem is setting up the WebSocket for livereload. let’s debug the network , Please note I am working on Window 7. I defined the network rule to allow traffic to port 35729.
If this solve your problem, good ! but, it didn’t helped me so I started looking for other solution which was turning of firewall. that’s Risky! but you have to take some risk😉
If this solve your problem, you are lucky and I mean it ! Because, this didn’t even solved anything for me so my journey continued to read more about debugging livereload.js and reading on error ERR_CONNECTION_REFUSED ! Here is a sweet summary.
And finally I too got lucky.
It was a real journey with great lesson and I will share a good info to you which is usually not highlighted in online course or tutorials.
When you are using gulp-connect you make sure you switch off the web browser extension of LiveReload in chrome and firefox.
From livereload.js redme – “note: if you use this middleware, you should make sure to switch off the Browser LiveReload Extension if you have it installed.”
Hope these notes might help someone. This post doesn’t ensure that it will solve but I think It will give you some direction to solve the problem.