Connect with us

Published on: 05 Aug 2014

Recently I changed my workflow, using some of the best tools available: gulp.js, gulp-sass and Browser-Sync. I now work faster and better when creating responsive websites. Using gulp.js I no longer need to combine, compress or process my Sass by hand, it is all done by gulp’s streaming build system.

Add Browser-Sync and you truly get some amazing power! Any changes in my Sass/CSS is displayed instantly in my browser without refeshing. Connect as many devices as you want to the URL generated by Browser-Sync and the project will be displayed and refreshed on these devices instanly as well.

gulp.js, gulp-sass and Browser-Sync allow you to setup your own device lab for responsive web design.

The video

In this video I will show you how to set up your front end web design workflow using gulp.js, gulp-sass and Browser-Sync.

It will allow you to see changes made to your Sass/CSS instantly across any device and greatly optimize your responsive web design workflow.

The Gulpfile.js used in the video


Thanks to

Many thanks to the creators of NodeJS, gulp.js, Sass and Browser-Sync! The tools are truly amazing.

This video was inspired by the post: GulpJS + Sass + BrowserSync ftw from: @shaneosbourne.

Links in the video

NodeJS gulp.js Browser-Sync gulp-sass Gulpfile.js code as a Gist

Feel free to contact us to find out if we can help you improve your website.

Lets chat free of charge