試験公開中

このエントリーをはてなブックマークに追加

実践入門 はじめてのReact開発

インプレスR&D

1,760円 (1,600円+税)

本書は主にサーバーサイドを専門に開発してきた著者が、仕事でゼロからフロントエンドを開発する中で、現場で実際にReactを使って学んだ情報やTipsをまとめたものです。

関連サイト

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

内容紹介

本書は主にサーバーサイドを専門に開発してきた著者が、仕事でゼロからフロントエンドを開発する中で、現場で実際にReactを使って学んだ情報やTipsをまとめたものです。

実際にはじめてReactを使って開発していく際、ページのUI(コンポーネント)をどのように組み立てていけばよいのか、create-react-appに頼っていたフロントエンドのビルドの裏側など、実務を通して学んだReactの「チュートリアル以外のTips」を掲載しています。

本書を足がかりに、チュートリアルなどを通じて具体的な開発に必要なAPIの情報を随時調べていくことで、初学者でもReactを使った開発を具体的にイメージしやすくなります。

書誌情報

  • 著者: 佐々木 勝春
  • 発行日: (紙書籍版発行日: 2022-05-13)
  • 最終更新日: 2022-05-13
  • バージョン: 1.0.0
  • ページ数: 114ページ(PDF版換算)
  • 対応フォーマット: PDF, EPUB
  • 出版社: インプレスR&D

対象読者

サーバーサイド,フロントエンド,React,TypeScript,同人誌,技術同人誌,技術書典に興味がある人

著者について

佐々木 勝春

合同会社DMM.com プラットフォーム事業本部 エンジニア。2017年、一般社団法人DMMアカデミー入社を経て2019年にDMM.comに転籍。プラットフォーム事業本部所属としてDMMのECサイト上のレビュー基盤のリプレイスやキャンペーン情報等をお知らせする通知配信基盤の開発、DMMポイントのチャージや獲得・管理できるスマートフォンアプリ「DMMポイントクラブ」のバックエンドシステムの開発とそのWeb版の開発に従事。開発ではGolang、AWS、node・Reactなどを利用。

目次

はじめに

  • 対象読者
  • 本書で紹介する内容
  • 紹介しない内容
  • 誤字脱字報告フォーム
  • 著者
  • 免責事項
  • 表記関係について

第1章 プロジェクトの作成

  • 1.1 環境構築
  • 1.2 create-react-appを使った方法
  • 1.3 Viteを使った方法
  • 1.4 自分でバンドラーなどのビルドツールを入れて設定する方法

第2章 コンポーネント開発(Component Driven Development/CDD)

  • 2.1 そもそもComponentとは?
  • 2.2 Reactでのコンポーネント作成例
  • 2.3 Component Driven Development
  • 2.4 Storybook
  • 2.5 Storybookの導入
  • 2.6 Storybookの内容
  • 2.7 その他・コンポーネント間のデータの受け渡しの設計

第3章 unitテスト入門

  • 3.1 Jest
  • 3.2 JavaScript関数のテスト
  • 3.3 コンポーネントのレンダーのテスト
  • 3.4 React Hooksのテスト
  • 3.5 内部に関数呼び出しがある場合のコンポーネントのテスト
  • 3.6 スナップショットテスト

第4章 E2Eテスト

  • 4.1 E2Eテストとは?
  • 4.2 Cypress
  • 4.3 Cypressの機能
  • 4.4 Cypressのインストール
  • 4.5 Cypressのデフォルトのフォルダー構成
  • 4.6 Cypress公式サンプルアプリケーション
  • 4.7 Cyperssのテストを実行
  • 4.8 IDE Intelligent
  • 4.9 Mocha
  • 4.10 cy.visit()
  • 4.11 cy.get()
  • 4.12 コマンドのチェーン
  • 4.13 cy.type()
  • 4.14 should()関数
  • 4.15 アサーション
  • 4.16 cy.focused()
  • 4.17 カスタムコマンド
  • 4.18 カスタムコマンドの呼び出し
  • 4.19 カスタムコマンドのログ設定
  • 4.20 ログのコマンド実行対象のハイライト表示の設定
  • 4.21 cy.check()
  • 4.22 cy.uncheck()
  • 4.23 cy.clear()
  • 4.24 Continuous Integration
  • 4.25 Dashboard
  • 4.26 Cross Browser Testing

第5章 ビルド入門

  • 5.1 ビルド内容
  • 5.2 トランスパイル
  • 5.3 バンドル
  • 5.4 ビルドツールの紹介
  • 5.5 esbuildを使った具体例
Home 書籍一覧 実践入門 はじめてのReact開発 ▲ ページトップへ戻る