MUI設定
インストール
npm install @mui/material @emotion/react @emotion/styled @mui/material-nextjs @emotion/cache @mui/icons-material
https://mui.com/material-ui/getting-started/installation/
初期設定
-
こちらのサンプルプロジェクトを参考に
theme.tsを追加 -
layout.tsxにAppRouterCacheProvider等をimportしてラップする。詳細
ヘッダー・フッターの追加
以下の参考にmuiのヘッダー・フッターを追加
ヘッダー
https://mui.com/material-ui/react-app-bar/