React & Gatsby開発入門

関連サイト

本書の関連ページが用意されています。

• NextPublishingオフィシャルWebサイト

内容紹介

近年、静的サイトジェネレーターGatsbyをはじめNext.jsでのウェブサイト構築が増えています。しかし、その土台となるJavaScript用ライブラリのReactは本来アプリケーション開発を想定しており、現状の入門本もアプリケーションを作るための学習を目的としたものになっています。本書では、Gatsbyでサイトを作ることをゴールとし、その過程でReactの学習を行います。本来Reactの入門本では必須と思われるhooksやcontext、fluxに関してもほとんどスキップし、コンポーネントの書き方やCSS Modulesといったマークアップに近い内容を重点的に紹介します。今後、更に増えてくるであろうReactのマークアップやGatsby、Next.jsでのウェブサイト制作への入門を考えている方に向けた一冊です。2021年3月2日リリースのGatsby v3にも最速で対応しています！

書誌情報

• 著者: 竹本 雄貴
• 発行日: 2021-04-02 (紙書籍版発行日: 2021-04-02)
• 最終更新日: 2021-04-02
• バージョン: 1.0.0
• ページ数: 124ページ(PDF版換算)
• 対応フォーマット: PDF, EPUB
• 出版社: インプレス NextPublishing

対象読者

Web開発,Webサイト,JavaScript,Next.js,サイト構築,静的サイト,React,GatsbyJS,Gatsbyに興味がある人

著者について

竹本 雄貴

1993年、東京都生まれ。ベンチャー企業から大企業まで多くの現場でウェブアプリケーション・スマートフォンアプリ開発、UIデザインに携わる。現在は幅広い経験を活かし出版社でデザインエンジニアとして活動している。

目次

まえがき

• 対象読者
• 本書の扱っている内容
• 検証環境について
• サンプルコード・正誤表
• お問い合わせ
• 免責事項

第1章　React開発入門

• 1.1　Reactとは
• 1.2　本章で開発するもの
• 1.3　環境構築
• 1.4　テンプレートの確認と編集
• 1.5　マークアップ
• 1.6　ビルド
• 1.7　デプロイ
• 1.8　React製サイトの問題点
• 1.9　解決へのアプローチ

第2章　Gatsby入門

• 2.1　Gatsbyとは
• 2.2　本章で開発するもの
• 2.3　環境構築
• 2.4　ディレクトリ構成の説明
• 2.5　はじめてのページ編集
• 2.6　Gatsbyのルーティング
• 2.7　データを扱う
• 2.8　プラグインによるデータの追加
• 2.9　ファイルシステムを使ったデータ利用
• 2.10　メタタグへの対応
• 2.11　ビルドとデプロイ
• 2.12　各ページの実装
• 2.13　表示条件とフォーマットの調整

第3章　Headless CMSを用いたウェブサイト制作

• 3.1　Headless CMSとは
• 3.2　本章で開発するもの
• 3.3　事前準備
• 3.4　データの設計と準備
• 3.5　サンプルコード
• 3.6　microCMSコンテンツの読み込み
• 3.7　トップページの実装
• 3.8　記事詳細ページの実装
• 3.9　カテゴリ詳細ページの実装
• 3.10　デプロイ
• 3.11　（発展）プレビュー画面の作成
• 3.12　（発展）ページネーションの実装

第4章　ステップアップ

• 4.1　公式情報の活用方法
• 4.2　Gatsby Cloudについて
• 4.3　（発展） TypeScript対応
• 4.4　ソースデータの追加
• 4.5　プラグインの作成
• 4.6　Next.jsについて

あとがき

謝辞