今後のフロントエンド開発で必須知識となるReact v18の機能を丁寧に理解する

Description

React v18の登場で何が変わるのか。しっかり理解できているかどうかで2022年以降のフロントエンド開発についていけるかどうかが確実に左右されます！

しかしReactが目指す世界や、追加された機能というものは非常に複雑です。

公式のドキュメントや解説記事はありますが、ほとんどの学習者にとって難易度の高いものとなっています。

そんな中、なるべく多くの人にReactの新機能や今後のフロントエンド開発についてなるべくやさしく丁寧に理解してもらおうと本コースを作成しました。

単に機能の説明だけではなく、その本質や周辺知識についても解説しているので受講いただくことで初学者〜中級者の方まで今後のフロントエンド開発に活かせる知識を得られるかと思います。

■本コースでは以下の内容を取り扱います

1. React18の破壊的変更

   React18にバージョンアップすることで起きる破壊的変更（既存コードの修正を伴うような変更）について、React18のプロジェクトとReact17のプロジェクトをどちらも作成し比較しながら解説していきます。

2. Automatic Batching

   State更新をReactが自動で１つにまとめることでパフォーマンス向上の効果があるバッチ処理について、React18で何が変わったのかについて解説します。React17とReact18以降ではバッチ処理される箇所が変わったのでしっかりおさえておきましょう。

3. Transition

   これまでのReactアプリケーションだとどのような問題があって、それがReact18で登場したTransitionを使うことでどのように解決できるのかについて、実際にサンプルアプリを作りながら解説していきます。また、新しく登場したuseTransitionとuseDeferredValueの違いや使い分けについても紹介します。

4. Suspense - その1（文法編）

   React18の目玉機能であるSuspenseについて、実際にコードを書きながら使い方を学んでいきます。Suspenseは以前からも存在しましたが、React18で別物になったのでその点も解説します。シンプルな例の解説から始め、複数のSuspenseを組みわせる例やTransitionと組み合わせることでどのようなユーザー体験をもたらすことができるかも体感していただきます。

5. Suspense - その2（本質編）

   Suspenseの使い方を紹介するにとどまっている記事が多いですが、Suspenseの本質はそこではありません。「SSR」「Streaming HTML」「Selective Hydration」このあたりのキーワードを中心にSuspenseを使うことで裏側で何が起きていて、今後どのようなフロントエンド開発になっていくのかについても解説します。

6. 【おまけ】その他新しく追加されたHooks

   おまけ的にReact18で追加された新しいフックについて、コース内で紹介したもの以外も簡単に紹介しています。

   
   

■それ以外の本コースの特徴

• セクション毎の最後にQ&Aコーナーを設けており、事前に受講生の方々から募集した質問について回答する息抜きのコーナーがあります

• コード入力時は画面を拡大する等、編集も工夫しているためスマホでもストレスなく閲覧できます

• 収録音声にも気をつかっているのでイヤホン等で視聴しても不快ではないです(声の好みは分かりませんが...)

  
  

TAKE THIS COURSE