【Next.js】Next.jsのプロジェクトにMaterialize.cssを組み込みたい

Next.js

Next.jsのプロジェクトにMaterialize.cssを組み込みたい場合は以下のような設定に。

Next.jsの設定は以下の記事にて解説しています。
nekorokkekun.hatenablog.com

import React from 'react';
import Link from 'next/link';
import Head from 'next/head';

class Header extends React.Component {
    render() {
        return (
            <React.Fragment>
                <Head>
                    <title key="title">Fun Club</title>
                    {/* Import Google Icon Font */}
                    <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"></link>
                    {/* Import materialize.css */}
                    <link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" rel="stylesheet"></link>
                </Head>
                <Link href='/'>
                    <a>Home</a>
                </Link>
                <Link href='/about'>
                    <a>About</a>
                </Link>
                {/* Import materialize.js */}
                <script src="js/materialize.min.js"></script>
                {/* And then your bundled js */}
                <script src="path/to/your/bundle.js"></script>
            </React.Fragment>
        )
    }
}

export default Header;