React/Redux開発入門

概 要

Webサービスにおいて広く利用されているReactとReduxの両方の基礎を演習を交えて一気に学べるコースです。

Reactは、Facebook製のUI構築用JavaScriptライブラリです。 他にはない先進的な開発アプローチ（JSX・VirtualDOM・データフロー）を採用しています。 このコースでは、JavaScriptの学習経験がある方に向けて、Reactの導入方法から基本的な作り方・コンポーネントの作成・サーバーサイドとの連携・画面遷移（ルーター）までを、随時ハンズオンと演習を織り交ぜながら学んでいきます。 このコースを受講することで、サーバーサイド連携や画面遷移を行える基礎的なアプリケーションを作成できるようになります。

※当コースは株式会社カサレアルが主催するコースとなります

対 象 者

• 今後Reactを使用してフロントエンドのWebアプリ開発を担当する方
• これまで、フロントエンドのWebアプリ開発（jQuery・Backbone.js・AngularJS）をしたことがあり、Reactの導入に興味がある方

前 提 条 件

• HTMLおよびCSSを利用して簡単なWebページを記述できる方
• JavaScriptを利用して簡単なWebアプリケーションを記述できる方
• 『しっかり学ぶモダンJavaScript -関数、モジュール、DOM、ECMAScript2019-』コースをご受講いただいた方もしくは、同等の技術を習得している方

受講後目標スキルレベル

• Reactを使ってコンポーネントを作成し、基礎的なアプリケーションを構築できる
• サーバーサイドと連携しデータを取得および保存できるアプリケーションを作成できる
• Reduxを使用し、コンポーネント間の連携を行える

カリキュラム

• Reactの概要
• Reactとは
• UIComponent
• Componentの合成
• VirtualDOM
• React導入
• JSX定義
• JSX属性の定義
• 関数型Component
• クラス型Component
• Componentへの分割
• イベントへの反応
• WebAPI利用
• Web APIとは
• 外部ライブラリ（axios）の利用
• async/awaitの利用
• ライフ・サイクルメソッド
• POSTによる登録処理
• Router
• react-router
• Redux導入
• Reactアプリの規模拡大時のネック
• Redux
• Store
• 状態変更(入力)フロー
• 状態変更(出力)フロー
• React-Redux
• connect関数
• Provider Component
• ActionType、ActionCreatorの共通化
• Reducer利用
• ActionCreator利用
• Redux-WebAPI
• Middleware使用例(WebAPIアクセス)
• 非同期Middlewareの定義

※最新でより良い内容をお届けするため、一部の学習項目を予告なく変更する可能性がありますのでご了承ください。

実 行 環 境

• Windows 7以降
• React v16以降
• Node.js v8以降
• Webブラウザ（Chrome）
• テキストエディタ（Visual Studio Code）

※使用するソフトウェアおよびバージョンについては予告なく変更する可能性がありますのでご了承ください。

受 講 期 間

19.5時間(3日間)

日 時

• 2020年3月23日～2020年3月25日（3日間）9時30分～17時00分

会 場

カサレアル泉岳寺トレーニングセンター

受 講 料 金

141,075円（税込）※受講料にはテキスト代も含まれます。

※knowledge-ex.co.jpドメインのサーバで運用されています