Sass Crash Course

Ғылым және технология

In this video we will talk about what Sass is and look at its features as well as create a landing page header to display things like variables, nesting, mixins, etc
Code:
codepen.io/bradtraversy/pen/E...
💖 Become a Patron: Show support & get perks!
/ traversymedia
Website & Udemy Course Links:
www.traversymedia.com
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia

Пікірлер: 511

  • @TraversyMedia
    @TraversyMedia4 жыл бұрын

    I realized I never created an official Sass crash course. So here it is :) The slides end around 8:43 if slides bore you

  • @haris7090

    @haris7090

    4 жыл бұрын

    Exactly what i'm looking for..Right time.. your are great Brad...TYSM...Today i've enrolled 20 js project course in Udemy..Tysm for all of your valuable educational contents...

  • @ead5590

    @ead5590

    4 жыл бұрын

    Was surprised for some reason that I'd received a notification denoting Traversy media has uploaded a SASS course.. Left me scratching my head thinking.. Didn't he upload a crash course on SASS before? None the less, this is certainly welcome to an enormous array of crash courses by you Brad.. Thanks for everything that you do.. ✌🏻

  • @tolmind

    @tolmind

    4 жыл бұрын

    Brad. You are so great. I always use your video to fine tune my skills. Coming from a medical background. I have learnt a lot from your channel.

  • @SkyFly19853

    @SkyFly19853

    4 жыл бұрын

    Thank you very much for this tutorial! 💯💯💯💯💯

  • @TraversyMedia

    @TraversyMedia

    4 жыл бұрын

    @@haris7090 No problem...thanks for checking the course out

  • @jayasudhaganesh2085
    @jayasudhaganesh20852 жыл бұрын

    I got interested in web development after watching your videos, Brad. Now i landed my full time job as a front end developer after making a career transition. Thanks and kudos for making the contents crisp and to the point.

  • @kamatz4156

    @kamatz4156

    2 жыл бұрын

    I've been having a hard time finding a company bro. What advice do you have?

  • @kamatz4156

    @kamatz4156

    2 жыл бұрын

    I got a job😁

  • @jusyF

    @jusyF

    2 жыл бұрын

    @@kamatz4156 🙂👍my congratulations

  • @jogodev3684

    @jogodev3684

    2 жыл бұрын

    You got a job by his tutorials only?

  • @Morquioo

    @Morquioo

    2 жыл бұрын

    @@kamatz4156 congrats man!!!!

  • @viniciuslima9434
    @viniciuslima94343 жыл бұрын

    For further reference: 00:51 - Intro 2:13 - .scss vs .sass 3:11 - Variables 4:02 - Nesting 4:34 - Modules 5:39 - Mixins & Functions 6:46 - Inheritance 7:33 - Operators 7:55 - Conditionals 10:40 - Creating a .scss file 12:30 - Compile .scss to css with npm 14:40 - Compile .scss to css with vs code extension (live sass compiler) 25:10 - Modular scss (multiple scss files)

  • @arc8696

    @arc8696

    2 жыл бұрын

    Thank you

  • @atulcodex7730

    @atulcodex7730

    Жыл бұрын

    Big thanks

  • @colindante5164

    @colindante5164

    Жыл бұрын

    Thankyou much ))

  • @u12blue

    @u12blue

    Жыл бұрын

    Thanks good sir

  • @plop_plop_plop

    @plop_plop_plop

    13 күн бұрын

    Thank you so much!

  • @DennisIvy
    @DennisIvy4 жыл бұрын

    Everybody loves Brad! Excited to check this out man :)

  • @TraversyMedia

    @TraversyMedia

    4 жыл бұрын

    No everyone :)

  • @anusree114

    @anusree114

    4 жыл бұрын

    @@TraversyMedia i like u

  • @zaviens9574

    @zaviens9574

    4 жыл бұрын

    @@Emre__Can Selamlar

  • @shahbozabdullayev5583

    @shahbozabdullayev5583

    3 жыл бұрын

    Dennis you're also good tutor!

  • @caioferreira3308

    @caioferreira3308

    3 жыл бұрын

    yes we love this big guy hehe

  • @goldenpunk9k
    @goldenpunk9k3 жыл бұрын

    2:17 two formats of sass files.. scss preferred 2:18 Variables 4:07 Nesting 4:34 Modules 5:40 Mixins and functions 6:54 Inheritance 7:35 Operators 8:00 conditionals

  • @shashwatsingh2799

    @shashwatsingh2799

    Жыл бұрын

    😊p pp 0:24 😊pt

  • @Mustafa-pe5mp
    @Mustafa-pe5mp4 жыл бұрын

    advice: change 'compressed' to 'expanded' so you can see regular css and it will be much clearer to understand

  • @codecast8713

    @codecast8713

    3 жыл бұрын

    I was looking for this comment and it's the first one I read.

  • @foxysamu

    @foxysamu

    3 жыл бұрын

    thank you

  • @themoroccanpianist8953

    @themoroccanpianist8953

    3 жыл бұрын

    but which one is practical and used by most developers ?

  • @Mustafa-pe5mp

    @Mustafa-pe5mp

    3 жыл бұрын

    @@themoroccanpianist8953 idk but it is better to follow the way that is easier for you now and worry about this kind of stuff later on

  • @themoroccanpianist8953

    @themoroccanpianist8953

    3 жыл бұрын

    ​@@Mustafa-pe5mp I have an issue with live sass compiler , so I uninstalled it and installed compile hero pro instead ! and it is working like a charm

  • @francomacias8904
    @francomacias89044 жыл бұрын

    You must tired of people telling you how awesome you are but I can't stay silent anymore, You're Awesome!!!

  • @ayberkyigit4795
    @ayberkyigit47954 жыл бұрын

    are you actually reading my mind? I've just finished sass documentation and you uploaded this crash course nice!

  • @codeaperture

    @codeaperture

    4 жыл бұрын

    Send me the docs please Ive always wanted a deep dive to sass.Link to content you used?

  • @cooljohnny9402

    @cooljohnny9402

    4 жыл бұрын

    me too lol. Brad sees everything haha

  • @adnanaz4526

    @adnanaz4526

    4 жыл бұрын

    So true..

  • @lightingstrike7285
    @lightingstrike72854 жыл бұрын

    Hey Brad, I am really thankful for all of your videos. You're a great programmer. Thank you for sharing your knowledge with others. I hope you keep on helping the programming industry.

  • @BTSPeach1469
    @BTSPeach14692 жыл бұрын

    this tutorial is so amazing! i've been using the very basic features of sass (variables, and nesting) for a few months as i'm new to web dev but this just helped me level up my skills tremendously. thank you!

  • @lucaszanek6204
    @lucaszanek62044 жыл бұрын

    It's funny, every time I want to learn something I go to youtube and you just upload a course about it. Monday I start a new job so I was about to learn sass and you just uploaded it. Thanks a lot, you're the best!

  • @dumbignorantfool2353
    @dumbignorantfool2353Ай бұрын

    Thanks! I watched lots of videos about sass and yours are easy to understand with little to no errors which I encountered while following other sass tutorial. Cheers!

  • @techhype6065
    @techhype60654 жыл бұрын

    Thank you very much Brad. You are my favorite teacher. I love every contents you created. I have wrote bad scss codes on my vue.js job but now I learned many useful technique from you. :)

  • @waqaskhandev
    @waqaskhandev Жыл бұрын

    Your Crash Courses are amazing. I have watched most of them a to z and it really help me alot.

  • @MCA96
    @MCA964 жыл бұрын

    I learnt a lot from you and keep learning. Thanks for all these top quality content, Brad.

  • @SuperSarhanWebdev
    @SuperSarhanWebdev3 жыл бұрын

    this was just an amazing video, the way you did those spacing utility classes awesome man love it

  • @sethmccullough6206
    @sethmccullough62064 жыл бұрын

    Beautifully done video Brad, you made it so easy to get up and running with Sass which I'm loving. Thank you!!!

  • @iahonz
    @iahonz4 жыл бұрын

    I just watched your responsive portfolio website series and realized "Oh, looks like I've been doing Sass wrong" *me, goes to Brad's KZread to see that he uploaded a course on this 6 days ago*. Awesome!

  • @goncalodumas
    @goncalodumas4 жыл бұрын

    Thanks for a great presentation! I’ve used css since the end of the browser wars and it’s great to see how it’s evolved.

  • @helenag9915
    @helenag99154 жыл бұрын

    There are many Sass tutorials on KZread, but yours is the best. Like always!

  • @Pavfixers
    @Pavfixers3 жыл бұрын

    first ever css html video i stumble on was Brad . Im very picky for voice and Brad has perfect voice and the way he explains and Happy new year Brand and to your family thanks for what you do

  • @bonguthandokhumalo7552
    @bonguthandokhumalo75522 ай бұрын

    Your videos are always informative and clear, you're really a great teacher. Thank you so much for sharing your knowledge.

  • @elilumilay9405
    @elilumilay94054 жыл бұрын

    And this is the things i've been searching right now!! Thank you so much Brad! You are great and awesome :)

  • @arindamchowdhury16
    @arindamchowdhury164 жыл бұрын

    Thanks Brad for all the knowledge you've been sharing with us... You changed my career

  • @hiuheu6653
    @hiuheu66534 жыл бұрын

    Brad thanks for this, I am really enjoying your recent videos. I have a degree in Civil Engineering but I fell in love with programming and have been teaching myself for the last 7ish months. I am starting to make websites for my local businesses here in London. I have picked up view and react so far, I am really starting to love Gatsby for doing freelance projects. Anyways thanks for your videos, they serve as a nice refresher.

  • @andrewbutton8294
    @andrewbutton82944 жыл бұрын

    I have been looking into using SASS in some of my projects. This is a great place to start. Thank you !!

  • @grantwilliams9838
    @grantwilliams98382 жыл бұрын

    Again, another awesome vid Brad. Very comprehensive with a great and simple example to learn off. Thanks a mil

  • @TechTravelbyRJ
    @TechTravelbyRJ3 жыл бұрын

    Same stuff i watched from another youtuber and those thing goes above my head , your presentation is awesome ❤️

  • @marcelino-dev
    @marcelino-dev4 жыл бұрын

    I've previously watched a crash course about Sass on another channel and it was nothing compared to this. Thank you Brad for all your work!

  • @suyashrahatekar4964

    @suyashrahatekar4964

    3 жыл бұрын

    did u watch designcourse channel's course?

  • @bacanalienigena
    @bacanalienigena3 жыл бұрын

    Thank you for the whole learning about Sass, you helped me also to understand flex box better. Cheers and Happy Christmas!

  • @bmehder
    @bmehder2 жыл бұрын

    Today was the day I started using SCSS, and I am never going back. What's great is you can use it right away and then slowly learn and include features at your own pace. At first, I just wanted the nesting, but I quickly started using variables because the syntax is so nice. In a perfect world, native CSS would work like SCSS.

  • @badytouray294
    @badytouray294 Жыл бұрын

    Loved this video 🙂 Your style of teaching is amazing with basic easy to use/understand examples :-) Love your 1hour crash courses.. Thank you for being yourself

  • @_dinesh
    @_dinesh4 жыл бұрын

    You're such an inspiration. I really look up to you. Thanks for yet another awesome video. 🎉

  • @RyanFurrerGaming
    @RyanFurrerGaming4 жыл бұрын

    This was an amazing resource to getting started in Sass. Thank you so much!

  • @orangecode1902
    @orangecode19024 жыл бұрын

    That's why we love you you upload every video when we actually need These

  • @soflogator
    @soflogator3 жыл бұрын

    Wow Sass is really going to take things to the next level for me. There's so much that I can learn and do with it. Excited to see how I can implement this with my larger projects. Thanks for the great introduction and explanation to it!

  • @pavelsantelises9553
    @pavelsantelises95533 жыл бұрын

    Omg dude, you're like the best teacher I ever had. Thank you so much.

  • @adarshchakraborty
    @adarshchakraborty2 жыл бұрын

    Everything in one video. Exactly What was I looking for! That too from my favourite channel on KZread. 🤩

  • @gabornagy6274
    @gabornagy62744 жыл бұрын

    Congrats for the 1 million subscriber! You are our hero!

  • @julieoelker1865
    @julieoelker18652 жыл бұрын

    After I finished Brad's Udemy course on Javascript, I took this course. So glad I did. It was easy to understand the functions and mixins after learning Javascript.

  • @colindante5164
    @colindante5164 Жыл бұрын

    Once again you demonstrate why most consider you the best out there for web content.. Thankyou much and greatly appreciated. ))

  • @user-tf2oi3ef1w
    @user-tf2oi3ef1w4 жыл бұрын

    Congratulations on 1 million subscribers, you deserved it. Great tutorial as ussual

  • @Algebrodadio
    @Algebrodadio4 жыл бұрын

    This is the one piece of web development that has, never seemed hard, but I've never bothered to learn it. Now that you've made a vid, I'm happy to watch it. Thanks Brad.

  • @cynthiamanor6565
    @cynthiamanor65654 жыл бұрын

    Thanks so much for posting this. I'm having to learn about CSS pre-processors for a class, and this REALLY helped!

  • @TomkinsOkello
    @TomkinsOkello4 жыл бұрын

    Brad, just a thank you. Great as always...from one of your students 🙏🏾

  • @mistersz
    @mistersz3 жыл бұрын

    you are my favorite programming guru. Glad to see Sass course in your channel ! Thanks

  • @nervanis
    @nervanis4 жыл бұрын

    The utility loop @40min is amazing! I'm working on an image utility library and this is the key to making this code more concise.

  • @alwin5995

    @alwin5995

    3 жыл бұрын

    I thought I could make a theme changer with this prop using JS, but Sass doesnt repond to JS changes, so I dont see the point of using it.

  • @deaconuadrian6554
    @deaconuadrian65544 жыл бұрын

    Great video, Brad! Thank you for the video and all the hard work. God bless.

  • @CharlesDeBarros
    @CharlesDeBarros3 жыл бұрын

    As always, your content is just priceless. Shame I can only give one thumbs-up! Keep the oustanding content coming! Much appreciated indeed!

  • @federicocipriani7399
    @federicocipriani73993 жыл бұрын

    Thanks Brad! And this is how after 1 hour I have a good knowledge of Sass 😁

  • @atmanvisual190
    @atmanvisual1903 жыл бұрын

    Your big picture crash courses are such a great resource. Thanks a lot!

  • @luciogutierrez997
    @luciogutierrez9972 жыл бұрын

    I've always hated Bootstrap from version 4 to date because I found it impossible to customize. One video and 48 minutes later, I'm excited about it!

  • @finalfantasy7820
    @finalfantasy78204 жыл бұрын

    Everybody is teaching for money to some extent but this guy also aims to deliver the content in the best way possible - and he can.

  • @ImranKhan-ft7ns
    @ImranKhan-ft7ns Жыл бұрын

    These crash courses are life saving... Thanks Brad ❤

  • @lourenxoweb6348
    @lourenxoweb63484 жыл бұрын

    I love your content so much and I always wanted to see a Sass crash course from you!

  • @miquel2423
    @miquel24233 жыл бұрын

    I enjoyed it very much Traversy Media. I am currently trying to take a expand my HTML and CSS knowledge and this video was very useful. Thanks a lot man!

  • @erfanm1206
    @erfanm12062 жыл бұрын

    your crash courses are my first choice for learning stuff Thanks Man

  • @nivellen1168
    @nivellen11683 жыл бұрын

    I'm very glad you made a video to Sass. Thanks Brad for the video!

  • @kasopejohnson3831
    @kasopejohnson3831 Жыл бұрын

    Thank you so much Brad! I've been working professionally building apps but I skipped SASS during my learning path because I was being rushed so I only write my custom css with frameworks. Now I know the basics in less than 2 hours!! SASS actually makes writing css LIKEABLE! 😂😁

  • @codingtutorialsannguyen3924
    @codingtutorialsannguyen39243 жыл бұрын

    Omg thank you! I always wanted to learn sass! Thanks to you I'm a beginner! I'm going to show of to my friends now!

  • @programmingjobesch7291
    @programmingjobesch729111 ай бұрын

    33:00- Just opened up a whole world for me

  • @iamaakashbasnet
    @iamaakashbasnet4 жыл бұрын

    I also learned SASS from your Udemy course. Loved to see more in-depth video on it. 😍

  • @29rohitkumar01
    @29rohitkumar013 жыл бұрын

    Thanks for this amazing course. Will try to implement some of these in one of my existing project.

  • @gxguy2906
    @gxguy29064 жыл бұрын

    Finally I been searching your channel for this. Thanks

  • @techboytutorials4733
    @techboytutorials47334 жыл бұрын

    Hello good sir. Congrats again on hitting 1 million. You totally deserve it.

  • @aniketchaudhari5062
    @aniketchaudhari50624 жыл бұрын

    I was about to look for SASS video and here it is! 👍

  • @parthpuri2000
    @parthpuri20004 жыл бұрын

    Hey Brad. Thanks for all this amazing content you're putting out here. Just wanted to make a small request. Is it possible to make a crash course on the basic backend stuff using node. Like all the basics a website needs (logging a user in and maintaining user database + sending out emails as newsletters)?

  • @jawadkhan8747
    @jawadkhan87473 жыл бұрын

    I was thinking that saas will be to complex to understand, but you did it. Thank you Traversy Media.

  • @CPenguinManiacos
    @CPenguinManiacos Жыл бұрын

    Hey, man! Awesome course, as always. Thank you so much, it really helped in understanding this thing. You were the one who helped me get my last and current job, you're awesome!

  • @yonahbb4635
    @yonahbb4635 Жыл бұрын

    great vid, loved how simple and easy it was to understand throughout!

  • @izdann
    @izdann3 жыл бұрын

    You are the best!!! I bought ur Udemy course and it's really worth it!!!

  • @AccessCode101
    @AccessCode1014 жыл бұрын

    You read my mind. I had created two videos on SCSS hoping I can learn something by doing, and here it comes the king tutorials... hehehehe thanks for the video Brad. I learned more from you that from the documentation. You should write SASS documentation.

  • @mariuszgolik7040
    @mariuszgolik70403 жыл бұрын

    You are amazing! You are doing a great job! Thank you very much Brad and best regards from Cracow.

  • @otongjrliah4787
    @otongjrliah47872 жыл бұрын

    one of the best humans i can ever name even though i have never seen and met him. he teaches with whole of his heart.

  • @Shaktish-kumar
    @Shaktish-kumar3 жыл бұрын

    To set the folder path correctly, you can try this "liveSassCompile.settings.formats": [ { "format": "expanded", "savePath": "~/../css/" } ]

  • @goodnessdavid6583

    @goodnessdavid6583

    2 жыл бұрын

    Yeah. I noticed "format" : "compressed" made my compiled css appear in one line, which doesn't look so nice, I had to change it to "expanded to fix it

  • @saadarman4718
    @saadarman47188 ай бұрын

    Like always brilliant, this gave me the quick start on the Sass. Thank you 😀

  • @nilmendes7710
    @nilmendes77103 жыл бұрын

    As always, very rich and fun content. Helped me a lot! Thanks!

  • @chopardissmo6869
    @chopardissmo68694 жыл бұрын

    Look forward to this topic from Traversy for a while, thx man.

  • @kamatz4156
    @kamatz41562 жыл бұрын

    Really enjoyed learning this!. Thank you for the video.

  • @tonymorin6308
    @tonymorin63082 жыл бұрын

    Cheers Brad. Great sass primer. For the last few days & I've been beating myself up by having a new v16 version of node.js, but trying to use the old npm way of using sass on your Udemy Modern HTML & CSS course. I now know how to do both npm & live sass vs code extension. Ouch! no pain, no gain lol

  • @Supersnoopadoop478
    @Supersnoopadoop4784 жыл бұрын

    Thanks for uploading this Brad. Could you give us an idea how you choose colors that complement each other well? Like how you chose the primary and secondary colors in the video. Thanks for all your hard work on these videos. Keep it up!

  • @Dablus
    @Dablus4 жыл бұрын

    i swear to god i was just looking for a sass course, and here you are !

  • @MuhammadIrfan-ch4jm
    @MuhammadIrfan-ch4jm4 жыл бұрын

    Brad You are great and i learned lot from you channel love you so much

  • @yanjim
    @yanjim4 жыл бұрын

    Thank you for sharing your knowledge, Brad!

  • @ojas.11
    @ojas.112 ай бұрын

    That was really amazing. Great Job!.

  • @ore_bear8045
    @ore_bear80453 жыл бұрын

    the slides was very informative and not boring, great tut !

  • @agungeka9281
    @agungeka92814 жыл бұрын

    Thanks brad, just feeling better knowing Sass before I commit to being a full-stack web developer. It really amazing how much time we'll save using Sass!

  • @sheikhrashed1242
    @sheikhrashed12424 жыл бұрын

    I have seen notification yesterday of your sass video, but that moment I was messed up my project about thinking should I use scss or normal css. can't figure out what should do, Now I know what to do -Thnx Brad

  • @adamploof3528
    @adamploof35283 жыл бұрын

    Awesome course. Psyched to start putting this to use!

  • @ariel035
    @ariel0354 жыл бұрын

    Thank you Brad! excellent as always.

  • @nasratt
    @nasratt4 жыл бұрын

    Brad you are great 😊 Thanks for your educational materials

  • @MarshGames
    @MarshGames2 жыл бұрын

    My dream is to become a fullstack developer because the subject of programming, logic, and design has become my free time, and your videos are always so much fun to watch. Thank you for being so informative and clear in explainations. I said "no way" out-loud at least 5 times when you showed a functionality of Sass. This will definitely be a useful dev tool in the front-end work! Thank you!

  • @kaonashi5044
    @kaonashi50443 жыл бұрын

    Enjoyed this crash course and learned a lot, thank you 🙂

  • @ashutoshagrawal3076
    @ashutoshagrawal30764 жыл бұрын

    Yipeeeee! Now we can create our own CSS framework. Thank You Mr. Traversy!

  • @bengbeng2005
    @bengbeng20052 жыл бұрын

    the best mentor is definitely you Brad

  • @Knards
    @Knards4 жыл бұрын

    I have always used the indented version. Much quicker. I use SASS with modified SMACSS. Thank you very much for the refresher

  • @esportsnexus
    @esportsnexus4 жыл бұрын

    You are awesome Brad. Love you man.

  • @sharepointtips9330
    @sharepointtips93304 жыл бұрын

    Thanks Brad.Helpful as always!

  • @Gamerbay2017
    @Gamerbay2017 Жыл бұрын

    Fantastic video! I'm a student web developer, and this was the recommended video by the course (which is run by TAFE Australia!).

  • @tzwacdastag8223
    @tzwacdastag82234 жыл бұрын

    Thank you for your hard work

Келесі