以前に書いた久しぶりにReact教育のテキストをアップデートしたが大変だったの続きです。
近々React教育を行いますが、またテキストをアップデートしています。
EY-Officeの教育では最新のソフトウェアに対応して教育の内容(テキスト)をアップデートしています。
Bing Image Creatorが生成した画像です
前回のテキストのアップデート
前回のテキストのアップデートでの大きな変更、React開発環境をcreate-react-appからNext.jsのcreate-next-appへの変更したことでした。
ただし、この時点ではNext.jsは、以前からのPages Routerを採用しました。
すでにNext.jsではApp Routerをサポートしていましたが、App Routerを使うとReact Server Componentsが有効になり、デフォルトではサーバー側でコンポーネントが実行されてしまいます。
Reactの基本であるクラインアント(ブラウザー)で実行するには、コードの先頭に'use client'
を書かないと行けなくなりました。React開発経験の無い方に行うReact教育で、いきなりReact Server Componentsなどの話をするのは、受講者を混乱させる可能性があり'use client'
を書くのは避けたかったのです。
ちなみに前回のテキストでReact Server Componentsは、React18の新機能紹介として軽く解説することにしました。
今回のテキストのアップデート
React 19 RC(リロード候補)がリリースされReact19が直前となった現在、React Server Componentsを避ける事は出来なくなりました。React公式ページのリファレンスも完全にReact Server Componentsに対応しています。
今回のテキストのアップデートでは、開発環境はNext.jsのApp Routerに変更しました。そして前回は拒否した 'use client'
は書かなくてはいけなくなりまいました。
今回の対応では、React Server Componentsの章を後半に追加し、最初の方にあるReactの基本学習の章では'use client'
は「後で説明するので今はおまじないだと思ってくれ」と書いて進めました
(React Server Componentsが一般化した将来には 'use client'
は常識になっている事を祈っています)。
それ以外にはReact19の新機能の解説を追加しました。さらにuseActionStateはフォーム処理の新しいスタイルとして、Reactの基本の部分でも紹介するようにしました。
- 現在React 19の正式リーリースは、互換性の問題で遅れているようです。
まとめ
React Server Componentsの正式リリースはReactの歴史の中でも大きな変更だと思います、将来React Server Componentsが一般化するのかどうかは、まだ判りませんが、使われて行く事はたしかだと思います。
EY-Officeの教育では最新のソフトウェアに対応して教育の内容(テキスト)をアップデートしていますので、安心して受講してください。