JAMStackを学ぼう中級編 GatsbyとmicroCMSでつくるコーポレートサイト ～WordPressはもう古い～

～改訂履歴～
第1版 2020年10月7日　初版発行
第1.1版　2021年3月1日 0.1.2 WordPressのデメリットの章にWordPress管理画面ブルートフォースアタックデモ記事へのリファレンスを追記

～はじめにより～
————————————————–
本書ではGatsbyと、ヘッドレスCMSであるmicroCMSの組み合わせで、コーポレートサイトを作成していく手順を紹介します。 ヘッドレスCMSとは、従来のCMS（Content Management System）から「ヘッド」部分を省いたシステム／クラウドサービスのことです。「ヘッド」部分とはビュー（表示機能）のことです。

これにより、コンテンツ入稿・編集する仕組みはヘッドレスCMSで行い、表示する仕組みはわたし達フロントエンドエンジニアが自由にプログラミングして作りこむことができます。 本書で作っていくサンプルサイトはある企業のコーポレートサイトという設定で、コンテンツは広報担当者やIR担当者など非エンジニアが入稿・編集する、という想定にしています。
その意味で、前作「Gatsby＋React bootstrap＋netlifyでつくる企業サイト」でマークダウンファイルをコンテンツデータとして使用したのと比べ、ヘッドレスCMSはより編集者フレンドリーになります。また、いくつかのヘッドレスCMSサービスの中で日本語対応であるのは日本製のmicroCMSだけとなりますので、必然的にmicroCMS一択となりました。

本書読者対象としましては、前作「Jamstackを学ぼうGatsby＋React bootstrap＋netlifyでつくる企業サイト」の既読者、もしくはGatsbyかReactの基本について理解している方となります。 プログラムコードの解説はありますが文法の解説はありません。

～目次～
改訂履歴
はじめに
環境
免責事項
サンプルコードとサンプルサイトURL
Section0: なぜヘッドレスCMSなのか
　0.1 なぜヘッドレスCMSなのか
　　0.1.1 WordPressのメリット
　　0.1.2 WordPressのデメリット
　0.2 なぜmicroCMSなのか
Lesson1 準備
Section1: 開発環境構築
　1.1. Ubuntuの場合
　1.2. Windowsの場合
　1.2. Macの場合
Section2 : Gatsbyプロジェクト作成
　2.1. 初期セットアップ手順
Lesson2 microCSMの利用方法
Section3: microCMSの利用方法
　3.1 microCMSをはじめる前に
　　3.1.1 microCMS新規登録
　　3.1.2 microCMSサービス情報設定
　3.2 microCMSのAPIを作成
【コラム】microCMSの利用料金
　　3.2.1 APIを作成していく
　　3.2.2コンテンツを作成する
　3.2 microCMSのAPIをテスト
Lesson3：microCMSとGatsbyのインプリメント
Section4：microCMSとGatsbyのインプリメント
　4.1 GatsbyでmicroCMSを使う準備
　　4.1.1 microCMSプラグインをインストール
　　4.1.2 gatsby-config.jsの編集
　4.2 graphQLでコンテンツ取得できているか確認してみる
Lesson4：インフォメーションページ作成
Section5：インフォメーションページ作成
　5.1 インフォメーション記事一覧ページと詳細ページ
　　5.1.1 インフォメーション記事一覧
　　5.1.2 インフォメーション記事一覧に本文の抜粋を入れる
　　5.1.3 インフォメーション詳細ページ（動的ページ）の作成
　　コラム【GatsbyのNode API】
　5.2 トップページで最新のお知らせを表示 あとがき 書籍紹介