私はホームページ制作ではもっぱらSCSSを使っています。
このブログでも、もちろんSCSSを使っています。
私はホームページ制作ではPreprosの有料ライセンス版を使っているのですが、ReactやNext.jsのフロントエンドの作業でも、やっぱりSCSSを使いたくなります。

React/Next.jsでSASS/SCSSを使うには

ReactやNext.jsでSASS/SCSSを使うにはコマンドでパッケージをインストールするだけでOKです。

$ npm install --dev sass

これで、ReactやNext.jsのプロジェクトでSASS/SCSSのファイルが使えます。

読み込んで使う際は、以下の通り

【SCSS】

.test {
    display: block;
}

【Javascript】

import styles from './styles/TestComponents.module.scss';

const TestComponents = () => {
    return (
        <div className={styles.test}>Test</div>
    );
}

ReactやNext.jsのパッケージで使う時は、ホームページで使う時のように、一度CSSに変換してからアップロードしなくてよく、そのままSCSSを読み込むだけなので、かなり楽ですね。