slightly more complicated project, to learn advanced HTML/CSS, I've done it with :

1. node-sass
2. chart.js

if you want to use SASS and have an easy transpiler i'll explain how to set it up within your terminal (Linux, windows or macOs).

install node.js, found it here
it will unlock the npm command.

install node-sass with your terminal, write :

npm install -g node-sass

the -g flag indicates you're installing it for the whole device.

with your terminal, go to your active directory, write :

cd /path/to/your/working/directory

Now that you're in right directory, you may start the transpiler, write :

node-sass sass/screen.scss css/screen.css -o --watch

1. node-sass : it calls the newly added package to your terminal.

2. sass/screen.scss : this argument tells node-sass the directory from where it will fetch the data to "feed" the transpiler.

3. css/screen.css : this argument tells node-sass the output directory, were the transpiled file will go when it's finished to transpile.

4. -o : this flag will specify that the argument before this flag is an output directory, if ommited the output will be sent to stdout(?).

5. --watch : this flag will make node-sass stay put and watch your files, and every time there is a modification, it will sees it.

you're all set, everytime you're gonna save/modify your screen.scss (or the files imported inside your screen.scss) it will transpile all your files into a .css file inside your /css directory.

/!\ Watch out, I showed you how I did it with the files named my way. If your files/directory have other names, modify your code accordingly, or just use the same tree as me.

Thanks my lads, now I'm gonne drink a cold one with the boïs!