LiveReload icon

I’m not even sure how exactly I came across this review from Brett Terpstra about LiveReload since it’s almost a year old now, but it stuck with me. Being the poor little student that I am, it took me about a month to actually spent the 8,99€ (US $9.99) for LifeReload, but boy, it is worth it.

LiveReload is a tool for web designers, which reloads your web browser(s) if any change on the site occurs. Just point LiveReload at the site’s folder and install the browser extension or add a JavaScript snippet to the site to get it working. Sure, editors like Coda or Espresso got that feature build in1 but they are also a bit more costly. LiveReload brings it to every editor you already own.2

While it’s easier to go with the browser extension, choosing the JavaScript snippet can save you a bunch of time if you’re doing anything with responsive design. Let the site run on an apache web server on a virtual host3, visit it with the browsers of your computer and all mobile devices and you can instantly see how your site behaves on all those devices without having to reload a single page.4 When I fiddled with this site I had it loaded up on my iMac, iPhone and iPad. It worked flawlessly and was really cool.

Additionally LiveReload can compile SASS, LESS, CoffeScript and others5 or run any shell command after changes occurred and before the browser refreshes. This setup certainly bears endless possibilities.

  1. and it is probably a bit faster as well. ↩︎

  2. or will own. ↩︎

  3. If you don’t know how to do that, I’d recommend you take a look at MAMP. Point MAMP at the folder with the site, start the server and the the site is reachable from your network. ↩︎

  4. The code you get from the app works only if your site is running on your local computer. If it’s running on another server, you need to specify the IP of your local computer. ↩︎

  5. Eco, HAML, IcedCoffeeScript, Jade, Compass, Slim & Stylus. ↩︎