“…so I just save my code here, and the browser auto-magically displays my new changes…without me refreshing the page……no you’re gonna have to run that by me again…”
So recently I stumbled upon a blog post and got quite excited reading about the witchcraft you can achieve playing with Socket.IO, and in particular with a plugin utilising said witchcraft called Browser-Sync.
I’m running it as a Grunt plugin and it works a treat. For me, it’s very handy when running the same page in several different browsers, especially content that might take a while to drill down to after a normal page refresh (such as modal popups, async journeys etc.)
I just save my scss file, compass compiles my css, browser-sync looks at all the browsers open and injects the new code. Boom!
“What about the IE browsers I’m running on a vm?” I hear you say. No problem, it’ll do those too. I use virtualbox to run my IE8 machine and it works perfectly.
As well as css, it can also live-inject jpg & png files AND it will also watch for changes on js, html and php type files, but those will require a standard browser refresh – which browser-sync does for you.
In short, I think it’s a really useful tool and it has stayed in my dev env.
I must admit though, every now and again I did find myself refreshing the browser manually without even knowing I’d done it due to the habitual ‘ctl + s, alt tab, f5’ procedure we all have tattooed to our inner skull!
Code and stuff