Learn Sass In 20 Minutes | Sass Crash Course

929,498
0
2019-03-13に共有
Check out my courses here!
developedbyed.com/

In this mini crash course we are going to learn everything about Sass.
What Sass allows us to do is write alot of cool things that we would normally wouldn't be able to do in normal CSS.

With Sass we can create variables, use imports and partials to separate our css code into smaller chunks, we can use mixins to create small functions that allow us to reuse css code, nesting allows us to write children elements directly inside the parent element and much more!

We will also look at a tool called Live Sass Compiler which is going to take our scss code and convert it to regular css with autoprefixer.

If you are interested in learning more about css and sass then take the time to watch this sass crash course covered in 20 minutes!

❤Become a patreon for exclusive videos and more!
www.patreon.com/dev_ed
Microphones I Use
Audio-Technica AT2020 - geni.us/Re78 (Amazon)
Deity V-Mic D3 Pro - geni.us/y0HjQbz (Amazon)
BEHRINGER Audio Interface - geni.us/AcbCpd9 (Amazon)

Camera Gear
Fujifilm X-T3 - geni.us/7IM1 (Amazon)
Fujinon XF18-55mmF2.8-4 - geni.us/sztaN (Amazon)

PC Specs
Kingston SQ500S37/480G 480GB - geni.us/s7HWm (Amazon)
Gigabyte GeForce RTX 2070 - geni.us/uRw71gN (Amazon)
AMD Ryzen 7 2700X - geni.us/NaBSC (Amazon)
Corsair Vengeance LPX 16GB - geni.us/JDqK1KK (Amazon)
ASRock B450M PRO4 - geni.us/YAtI (Amazon)
DeepCool ATX Mid Tower - geni.us/U8xJY (Amazon)
Dell Ultrasharp U2718Q 27-Inch 4K - geni.us/kXHE (Amazon)
Dell Ultra Sharp LED-Lit Monitor 25 2k - geni.us/bilekX (Amazon)
Logitech G305 - geni.us/PIjyn (Amazon)
Logitech MX Keys Advanced - geni.us/YBsCVX0 (Amazon)

DISCLAIMERS:
I am a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for us to earn fees by linking to Amazon.com and affiliated sites.



📕 Things covered in this video:

- How to add sass compiler to our project
- How to link our sass to html
- Sass variables
- Mixins
- Nesting
- Extending
- Operators
- Partials and Imports

📔 Materials used in this video:

VSCode

🛴 Follow me on:

Twitter: twitter.com/deved94
Github: github.com/DevEdwin

🎵 Music:

Outro:
LAKEY INSPIRED - Me 2 (Feat. Julian Avila)
Music By: soundcloud.com/lakeyinspired

Intro:
Dj Quads
Track Name: "Every Morning"
Music By: Dj Quads @ soundcloud.com/aka-dj-quads

Creative Commons — Attribution-ShareAlike 3.0 Unported— CC BY-SA 3.0
creativecommons.org/licenses/b..

コメント (21)
  • What a nice guy! He is constantly smiling, makes me smile with him but I am not sure why I am smiling, but I don't care. Happy guy!
  • @munch6814
    Me every second: wow!! I wish I had you as a teacher irl
  • Been doing CSS for years and every time I got close to learning/implementing SASS, got scared with the syntax looking at the docs and ran away, but this tutorial finally made me love the cool thing. Thanks a bunch!!!
  • For no reason, I've been holding back to learning sass. This is my first attempt and I loved it. Thanks so much! You're good
  • @mi5956
    in 19 minute I learned more than past 6 months. thank you please upload more videos like this
  • When you demonstrated the $direction and column custom parameters, my jaw literally dropped. So cool, and so useful! This SASS tutorial totally levels up my CSS skills. Great content!
  • I never learned so many good things in such a short time! Great content, awesome! Thanks
  • When you are having fun making a tutorial it makes the viewer have fun too. Very nice.
  • Nice video! I am always impressed (jealous) with how quickly you can create such high quality tutorials
  • @plusk343
    CSS: Helloooo Sass: Hellooooo CSS: Alright imma head out
  • @danneytee
    the fact that it took me so long to learn HTML, CSS, js, react.. it gave me the idea of sass will take a long time to learn as well. glad I found this video
  • Wow, just wow - all this time I've been overlooking Sass, not knowing it brought this much functionality to CSS... I'm always starting new Angular projects, and every time it asks for my styling choice, I always chose standard CSS. Well I got curious today and I'm glad I did. See, this is why I hate getting too comfortable with one thing. Thanks pal, your video was perfect. [Edit] - I actually can't believe it's this easy!
  • @Guonejo
    I learned more from you in 20 minutes than from my teacher in the last 4 months. Thank you so much for this! Keep smiling!
  • @ricktar15
    Great video. I have been avoiding sass but after seeing this, I am ready. I really like how you touched on so much of it's powers through simple uses, like when you accepted parameters to a mixin for different colors and flex direction. Absolutely loved this
  • @paulv20
    I love your enthusiasm, joy, and excitement that you put into your videos teaching us these crash courses! You're doing gods work teaching us new things! <3
  • 3yr old video, but still the best tutorial ever... I was always getting back whenever I tried to learn SASS, now this guy made me understand about it in less than 20mins. Awesome. ✨✋....
  • he made it looks so easy and fun and he is constantly smiling omg we need poeple like you