Express: How to automatically reload views, styles and scripts

Today we are going to take a look at an example i just built showing how you can automatically absolutely everything in an Express application. And with everything, i mean that once you change your styles, your client scripts or even your server data, your browser automatically refreshes with the new data. Yes, you heard it right: whenever you change any single bit of your app, it automatically refreshes in every connected browser. Check the example now on Github.

How do you do it?

In this example, i’ve used an absolutely magical combination: Express, Livereload and Webpack. I’m assuming you have a basic idea of what Express is (and if you don’t, check out their Hello World guide right now!). Livereload is basically a server that watches for changes in files and sends messages to every connected client. We’re also putting Webpack in the mix so that we have an easy way to bundle our project dependencies.

A mix as awesome as M&Ms with Coke.

Grab the example and happy coding!

Its unfortunately somewhat tricky to get everything going, but i’ve done all the hard work so you don’t have to. Just grab the code on Github and enjoy a turbo speed development!