What is Sass?
Sass can be claimed as a most powerful CSS Extension language. It adds abundance of nice features to CSS, and helps the developers to build better stylesheets.
Sass is a CSS Preprocessor, How?
The developer writes Sass code in a .sass or .scss file and the Sass Preprocessor converts it to CSS format, that is .css file so that the browser understands the code and renders the page. The .scss format is the widely used one, because of its close to CSS syntax.
The advantage of Sass over css is that, it eradicates the monotonous code style of CSS and craft CSS easily.
How to install Sass on Windows?
Sass is a package provided by the programming language Ruby as one of its dependencies. All the packages of Ruby are called as Gems. Sass is one such Gem. To start with we need to install Ruby first on our machine.
Download and install the proper version of Ruby Installer that suits your computer from the below link.
http://rubyinstaller.org/downloads/
Please note that for a 64 bit Windows operating system, the below link works charm.
https://github.com/oneclick/rubyinstaller2/releases/download/rubyinstaller-2.5.0-2/rubyinstaller-2.5.0-2-x64.exe
Sass can be claimed as a most powerful CSS Extension language. It adds abundance of nice features to CSS, and helps the developers to build better stylesheets.
Sass is a CSS Preprocessor, How?
The developer writes Sass code in a .sass or .scss file and the Sass Preprocessor converts it to CSS format, that is .css file so that the browser understands the code and renders the page. The .scss format is the widely used one, because of its close to CSS syntax.
The advantage of Sass over css is that, it eradicates the monotonous code style of CSS and craft CSS easily.
How to install Sass on Windows?
Sass is a package provided by the programming language Ruby as one of its dependencies. All the packages of Ruby are called as Gems. Sass is one such Gem. To start with we need to install Ruby first on our machine.
Download and install the proper version of Ruby Installer that suits your computer from the below link.
http://rubyinstaller.org/downloads/
Please note that for a 64 bit Windows operating system, the below link works charm.
https://github.com/oneclick/rubyinstaller2/releases/download/rubyinstaller-2.5.0-2/rubyinstaller-2.5.0-2-x64.exe
Start using Sass
In your computer create a dummy folder to test, with couple of subfolders named, CSS and SCSS, and a .scss test file in the scss folder as below.
Now you can watch your .scss test file for any changes and tell the preprocessor to convert to .css file using an inbuilt watch program.
In order to do this go to the Dummy folder in the command prompt and run the below command.
sass --watch scss:css
Hereupon when you do any change in your .scss file, the watcher detects the change and compile it into a .css file. Try adding code to .scss file, save and check for the compilation happening automatically.
sass --watch scss:css
Hereupon when you do any change in your .scss file, the watcher detects the change and compile it into a .css file. Try adding code to .scss file, save and check for the compilation happening automatically.
Good info.
ReplyDelete