How to Reload, Refresh, Update, Webpack, Transpile, or `Whatever You Want to Call it` a React App on Glitch.com

This dev tip is brought to you by the developer of MoneyPhone: Personal Expense Tracking for Android and iOS. Consistently spend less than you earn each month and get your finances under control when you start monitoring your expenses with MoneyPhone!

Tonight I discovered this really cool quickstart tutorial on ReactJS from the team at Glitch.com where you can actually start programming in ReactJS in your browser using the Glitch.com web-based coding environment without having to use create-react-app or webpack to build your app. They handle all of the hosting and tooling for you. Pretty neat huh?

The only problem is hot reloading doesn’t always work. But after a little fiddling around I figured out a work around to get Glitch to sometimes hot reload everything when necessary: Simply go in and add a comment to the server.js file to trick glitch into hot reloading everything =>

// glitch reload!

If that doesn’t work, which it may not as I’ve found. You may just want to try using REPL.it instead to do your ReactJS coding practice in the browser using a web based coding environment. After playing around with REPL.it’s competing ReactJS browser based coding environment, I think it is probably a little bit better, albeit somewhat slower.

So there you have it. Maybe the best way to get started with React and Glitch is to watch their excellent 5 part video tutorial, but actually do your coding on REPL.it instead.

 

topherPedersen