![]() Using the Command Line / Terminal can be an intimidating step for a beginner, but with some copy & pasted instructions, you can get up and running with Sass in the command line! While the idea that the makers of useful software should be compensated for their work makes absolute sense to me, this is not ideal, and thankfully there are other ways to compile Sass without annoying popups.Ĭommand Line Sass Step One - Installing Node (I call this “hassleware”, also known as “guiltware”). ![]() The downside is that Prepros exists as a paid program, and while available for free, the program will intermittently give the user pop-ups prompting one to purchase the program. Prepros provides a very user-friendly Graphical User Interface (GUI) to compile your Sass automatically, along with some extra features like minification and automatic auto-prefixing. But I grew weary of this for reasons discussed below (any user of Prepros will know where I’m coming from). A number of tools exist to make this easy - in my personal experience, I was taught to use Prepros to easily compile my Sass. However, as browsers do not support Sass syntax, this comes with some more complicated concepts, like compiling your Sass to browser-readable CSS. Also, this article assumes the user knows basic commands for navigating folders and directories in the command line - if not, look into “pwd”, “cd”, and “ls”. In this article, I will be using “Sass” to include both Sass and SCSS - the two terms refer to syntax patterns and for our purposes are essentially interchangeable.Īn aside - I’m a Mac user, but these instructions should work for both Mac and PC. ![]() Sass, and other CSS preprocessors, can allow you to speed up writing code, and can give you a taste for the type of logic used in JavaScript to build functionality by writing functions, conditionals, and loops to output the CSS that you want. For those interested in learning to build websites, or those starting their journey to become front-end developers, learning Sass or SCSS can be an exciting step. ![]()
0 Comments
Leave a Reply. |