Navigate Between Pages (ページ間を移動する) について
ページ遷移にnext/linkコンポーネントを使う
import Link from 'next/link';
Assets, Metadata, and CSS (アセット、メタデータ、CSS) について
画像の表示にnext/imageコンポーネントを使う
import Image from 'next/image';
headタグをページごとにカスタマイズするときにnext/headコンポーネントを使う
Third-Party JavaScriptのページに書いてあった。headタグ内にscriptタグを入れたい場合に以下のようにする。
import Head from 'next/head';
scriptタグを挿入したい場合はnext/scriptコンポーネントを使う
Third-Party JavaScriptのページに書いてあった。
import Script from 'next/script';
SCSSについて
Next.jsはデフォルトで.scss拡張子をサポートしている
Layoutコンポーネントの作り方
components/layoutsディレクトリを作成して、その中にchildrenを受け取るコンポーネントを普通に作るだけ
グローバルCSSについて
pages/_app.tsxで以下のようにcssをインポートする。
import '../styles/global.css';
PostCSS 構成のカスタマイズについて
PostCSS 構成をカスタマイズするには、postcss.config.js を使用する。
これは Tailwind CSS などのライブラリを使用している場合に便利です。
Pre-rendering and Data Fetching (事前レンダリングとデータ取得) について
これから読む。