Изучаем JavaScript

Устанавливаем Sass глобально: npm install -g sass Теперь, если зайти в папку проекта, скомпилировать index.scss в index.css можно командой: sass index.scss index.css В папке проекта появились файлы index.css и index.css.map Файл map это связь между sass и css. Подключать в index.html следует файл index.css <link rel="stylesheet" href="index.css"> Ок. Всё работает. Но вводить команду sass index.scss index.css каждый раз, когда что-то изменил в scss-коде и хочешь посмотреть на результат, нерационально. По этой инструкции устанавливаем и подключаем Webpack https://dev.to/pixelgoo/how-to-configure-webpack-from-scratch-for-a-basic-website-46a5 Запускаем команды npm run build  // компилирует scss в css и сохраняет в папке dist npm run watch // отслеживает изменения и компилирует их  Компиляция SASS онлайн: https://www.sassmeister.com/ Переменные sass $color: red; $padding: 10px; a {   color: ...

В предыдущей теме  мы пришли вот к такому образцу кода function Animal(name, voice) { this.name = name; this.voice = voice; } Animal.prototype.say = function() { console.log(this.name, 'says', this.voice) } const dog = new Animal('dog', 'woof'); dog.say(); // dog says woof С появлением в JavaScript классов писать подобный код стало удобнее class Animal {   constructor(name, voice) {     this.name = name;     this.voice = voice;    }   say() {     console.log(this.name, 'says', this.voice)   } } const dog = new Animal('dog', 'woof'); dog.say(); Классы это синтаксический сахар. Они не создают никакой новой функциональности, но делают более простой и удобной работу с прототипами. На основе базового класса Animal  мы можем создавать дочерние классы и добавлять им новые свойства