無料

React実践 - 状態管理とデータ取得

TypeScriptでのReact開発、useEffectとデータ取得、ローディングとエラーの設計、カスタムフック、useContext、useReducer、React Routerによるページ分割までを、毎レッスン実際にコードを書き、フリマアプリ「fleama」を作り上げながら学びます。修了後は実務水準のSPAを設計・実装でき、就職ポートフォリオになるアプリが手元に残ります。

所要時間

約1ヶ月

ランク

中級

参加者

-

概要

TypeScriptでのReact開発、useEffectとデータ取得、ローディングとエラーの設計、カスタムフック、useContext、useReducer、React Routerによるページ分割までを、毎レッスン実際にコードを書き、フリマアプリ「fleama」を作り上げながら学びます。修了後は実務水準のSPAを設計・実装でき、就職ポートフォリオになるアプリが手元に残ります。

できるようになること

propsやstateやイベントにTypeScriptの型を付けて安全にReactを書ける

useEffectでAPIからデータを取得し、ローディング・エラー・空状態を設計できる

カスタムフックでロジックを抽出し、再利用できる形に整理できる

useContextとuseReducerで、共有状態と複雑な状態遷移を設計できる

React Routerで画面をページに分割し、実務水準のSPAを構成できる

前提知識・必要な環境

必須

  • React入門修了(必須)
  • TypeScript入門修了(必須)
  • 実践JavaScriptのfetchと非同期処理を書いたことがある

環境

ブラウザ完結(インストール不要)

内容

テキストでの解説

54

レッスン

コーディングの問題

0

レッスン

クイズ問題

8

レッスン

監修

ゆめさくコード編集部

プログラミング学習をもっと身近に。初心者から実務レベルまで、わかりやすいコンテンツをお届けします。

生田 陸人

ゆめさくエンジニア / 現役ソフトウェアエンジニアRuby on Rails・Nuxt.js・Next.js・CakePHPなどの実務の開発をベースに、学習コンテンツを作成しています。

レッスン