作成: 更新:

AMPを導入する(Next.js + tailwind.css + Typescript)

ampnextjsssggooglejamstacktypescript

AMP is 何?

  • Accelerated Mobile Pages
  • モバイルページを高速に表示させる手法

How to AMP

前提

フロー

  1. 前準備
    1. tailwindcssの共通コンポーネントを小さくする
    2. _document.tsx#getInitialProps の戻り値を変更する
  2. 実装
    1. 実装したい [NextPage].tsxexport const config = { amp: "hybrid" }
    2. markdownでCDNで読み込んでたスタイルシートをインラインで読み込む

????

参考記事