First Impressions of Bootstrap & SASS

Hi! I really quickly wanted to write down exactly what I’m learning today, which is Bootstrap & SASS.

I am FINALLY getting my grubby, little hands on Bootstrap and learning how to make it my own! I am going to make a fabulous, live web dev portfolio so soon. And I want to use Bootstrap to make it, so that I can learn how and also because I think it’ll just be the fastest option for me to get it done.

So far I have learned how to link up Bootstrap as a CDN. Great, quick option. And now I’m also downloading it to my machine as a learning tool for learning SASS. I’m finally learning SASS! You can create like a billion snippets of CSS, and then compile it into one crisp, cute file. I’m already ALL OVER THIS.

So real quick notes for me:


Learning Bootstrap & SASS

gem install sass (on the command line)

You will probably get an error saying something like, “You don’t have write permissions for ….” This is because you are using the version of Ruby that MAC automatically comes with. But don’t fret! The fix is super simple!

sudo gem install sas

then type

sass -v

to double check that it worked! You should be given the version of sass that you are now running.

Then to actually use your sass files… Again with sass you basically make a bunch of partial css files, using the .scss filename. Then you will compile all of those (on the command line) and they will compile into one master css file that you will link to your header, like normal CSS. YES, EASY MODE!


sass –watch scss:compiled

In this example I’m just compiling the Bootstrap files that I downloaded. All of the partial SASS files live in the /scss file folder (or directory-remember they are the same thing!), so I am calling for SASS to watch this directory and compile it into a new directory called compiled. When I open /compiled I’ll see some .css files that are giant css files calling for all of the individual partials that exist in /scss.

I hope that kind of makes sense… Also! When you call SASS to do something on the command line like watch, SASS will continue watching for files/file changes to compile until you tell it to stop. So hit CTRL+C whenever you’re done, or whenever you need to get back to your command line for a new command.


No comments

Leave a Comment

Your email address will not be published. Required fields are marked *