Sass Quickstart (Coming Soon)
This tutorial assumes you’re already familiar with HTML, CSS, JS, and npm. It also assumes you know what Sass is for.
First, visit the Sass training ground repo. Press the green Code button and click Download ZIP. Unzip the file and then open it in your editor. Then, run this command in the terminal to install the packages listed in package.json.
npm installThen run this command to start the dev server.
npm run devThis command converts src/main.scss into dist/main.css. It’ll update the file every time you save. Use Ctrl + C to stop this process.
Open the index.html file in your browser. The web page should say Hello World. You can also use the Live Preview extension to open up index.html on localhost:3000.
In your editor, you’ll see several files. However, for now you’ll mainly be working in src/main.scss.
Comments
Section titled “Comments”Variables
Section titled “Variables”Nesting
Section titled “Nesting”Partials and Modules
Section titled “Partials and Modules”Mixins
Section titled “Mixins”Inheritance
Section titled “Inheritance”Operators
Section titled “Operators”