WordPress×Next.jsで妥協のない完璧なヘッドレスCMSメディアを作る
WordPressとNext.jsでヘッドレスCMSを作っていきます。よくある必要な機能がなくて無駄なコードが多いサンプルではなく、カスタマイズしやすいように無駄を極力省きつつよくある機能は全部付けていきます。追加してほしい機能どしどし募集してます！
Chapters
はじめに
※注意・変更点
チートシート
ディレクトリ構造
Dockerのインストール（※WordPressが既にある人はスキップ）
WordPressの設置（※WordPressが既にある人はスキップ）
WordPressの独自テーマ作成
WordPress初期設定&プラグインのインストール
nvm（Node.js）のインストール
Next.jsアプリ立ち上げ
GitHubでソースコードを管理する
VS Codeの便利な拡張機能
↓ 本格的にNext.js×WordPressはじめます！注意点あり。
Tailwind CSSを導入
WordPressにGraphQLを導入する
Next.jsからWordPressのデータを取得する
.env.localで環境変数を設定する
constantsでデータをまとめる
ISR×useSWRでリアルタイムデータ取得をする
Atomic Designでコンポーネントをまとめる
記事一覧全データ取得&デザイン「最小&大ざっぱ編」
記事一覧全データ取得&デザイン「詳細編」
<Image>を使う- 画像の表示とその設定
<Link>を使う
Layout+Header+Footerを作成する
記事詳細ページを作成する
カテゴリーページを作成する
ページネーションで複数ページにする
Dynamic Routesを使ってトップ記事一覧とカテゴリー記事一覧のページを共通化させる
Author
Topics
- 公開
- 本文更新
- 文章量
- 約110,276字
- 価格
- 1,200円