Sass Workflow & Dev Server From Scratch Using Gulp

In this video we are going to build the "Sass Starter Pack" which is a complete Sass workflow and dev server and environment using Gulp, the Gulp-Sass plugin and BrowserSync. Then well mess with it a little bit and create a simple little project. Feel free to use this starter pack in future Sass projects

SASS STARTER PACK GITHUB:

BECOME A PATRON: Show support & get perks!

ONE TIME DONATIONS:

FOLLOW TRAVERSY MEDIA:

[TraversyMedia]

Id love to hear anyone elses workflow when it comes to compiling Sass. Also, come join the new Discord server. The goal is to have a community to help eachother with programming, business, projects, etc...

[slimyelow]

everytime I search something "dev", Traversy comes up first. - That is an excellent thing.

[darz_k.]

This tutorial is highly recommended for understanding the benefits of SASS in a project.
This project is a small one, though it actually has the benefit of showing, really quickly, how SASS can be a powerful asset in larger projects.
The first half of this tutorial too, is very useful and shows how to create a simple script to automate SASS compiling with NPM and gulp.
A lot of great info packed into this short tutorial, and it's very easy to follow.
Thanks a lot Brad!

[SmellySamosa]

Wow the discord server really made a huge difference. Somebody suggested it yesterday and was discussing it with brad and here we are a day later he's already up with a video about it. Join the server guys!

[JuanAndOnly]

Thanks for taking the extra time in the video to do that simple page. Seeing those variables in motion really helped me get a better grasp of it as well as the @extend and @import

[wimeatsworld]

I was getting annoyed with CSS and discovered Sass on CodeAcademy. Then I went to search for a decent explanation and found you, Brad. I'm really glad I've been Patreoning you so you can make this cool stuff, even though I didn't dive in as deep as I should've yet. Starting self employed developer here and especially design is tricky...

[JamesQQuick]

Wow, great video. I'm glad you started from scratch. Often those details get skimmed over. Really enjoyed it, thanks as always!

[butlerfuqua]

Thank you so much for this! This is EXACTLY what I was looking for. I am an aspiring developer and learning. I really appreciate the work that you do. Please keep them coming! Simple and to the point.

[jimmaccormaic]

Wonderful stuff. Your step-by-step approach is unbeatable. Also, I really loved the function for changing font-colour depending on the background. That's a terrific idea.

[AlisherMakhmudov]

Nice video as always Brad, thanks a lot...

P.S. You can install gulp-plumber package to get rid of starting "npm start" every time you get error. Gulp plumber will let you not to break your "npm start" command.

[Thor]

Thanks for all that you do to educate those of us with lesser knowledge. You are awesome dude.

[RealToughCandy]

Another great video, Brad. Keep it up man, I've been waiting for somebody with skills do to a modern Sass tut.

[cesarlara]

I'm using flex and it is really easy I don't have to use many media queries because it makes it responsive. Thank Traversy media!

[charliecoplestone]

Jesus. I've avoided using this for a while but holy damn this is a game changer. Thanks for the tut.

[maz]

When Youtube recommends good stuff, great as usual. :)

[ninjaskter]

The tutorial and instruction was very straightforward at my level. I will have to check out your other tutorials!

[maithienit]

Hi Brad, thanks for great series of tutorial. I am back-end developer. Your series really made a huge motivation for me to focus on front-end. Enrolled in Bootstrap 4 and Angular 4 course on Udemy. Keep up good work.

[YashwanthP]

You are the best Brad! You make everything sound easy and interesting.

[justinohalloran]

I absolutely love your work. You are the best resource on Youtube. Keep it up!

[amadoucisse]

Thanks for this starter-pack been looking for something like this for a while, created one myself but this is much better