ホームページ - EY-Office

2023-11-09

Reactの公式ページreact.devは素晴らしいので読むべきです

カテゴリー：React

以前 Reactの新しいドキュメントreact.devは期待大ですというブログを書きましたが、少し前に日本語版のreact.dev がオープンしました。おめでとうございます！🎉🎉🎉

そして、日本語ページ制作に関わった方々に感謝いたします。

react.dev Stable Diffusion(mage.space)が生成した画像です

どんな人に読んでほしいか

このページを見にくる人には、以下のような人がいるかと思います。

Reactはどんなものか知りたい人
Reactに入門したい人
Reactを正しく学びたい人

1.の人にはトップページを見れば、すでにフロントエンド開発を行った事のある人なら概要がわかると思います。

2.の人向けにはLean(クイックスタート)が用意されています。しかし、このページはHTML、CSS、JavaScriptを（だいたい）知っている向けです。jQueryなどで簡単なフロントエンドを書いた事がある人を対象にしていると思います。
したがって、今までフロントエンドを書いた事がない人は、入門書やオンライン学習の方が良いかと思います。

さて、私がお勧めなのは3.の人です。

現在Reactを書いている開発者は多数いると思われます。しかしReactを書いている全ての開発者が、Reactを正しく理解しているとは思えません。
ネットで検索したコードをコピペしたりしながら、なんとなく書いてる人も多いのではないかと思います。

そのような方は、是非recat.devを読んでください。まず、Lean(クイックスタート)でReactを復習してください。次にReactの流儀でReact流のコーディング・設計を学んでください。
さらに、 UI の記述、インタラクティビティの追加、 state の管理、避難ハッチを学んでください。

読み方は、各自の好きなスタイルで良いと思います。

サンプルコードを実行しながらコツコツと学んで行くスタイル
興味があるところや、疑問の思っていたところから読むスタイル
理解できないところがあっても読み通し、何度か読み直すスタイル
開発時に謎だと思ったとき、問題に突き当たったときに、時間を取り読むスタイル
・・・

ここまでが理解できるとReactの基本が完全に習得できた事になります。
今まで何となく書いていたコードの意味がわかり、自信をもって正しコードが書けるようなるります。また問題が発生した時の解決能力が、高くなと思います。

雑感

なぜインストールでNext.jsやRemixを薦めているのかの邪推

なぜインストールページではNext.jsやRemix等のフレームワークを推奨し、フレームワークなしで React を使うことはできますか？コラムの最後にしかViteやParcelのようなビルドツールが出てこないのでしょうか？

React 18の目玉機能は React Server Components(RSC) どと思います。今まではReactはクライアント（ブラウザー）でのみ動くライブラリーでした（SSRの事は置いておきます）。しかしRSCはコンポーネント単位で、サーバー側、ブラウザー側でレンダリングするかを選べる機能です。

ボタンに反応するコンポーネントはブラウザーでしか動かせませんが、データベースからデータを取得し一覧表を作るコンポーネントはサーバー側で動かした方が良さそうですね。
現在のようにサーバーとブラウザー間での通信ではなく、適材適所でReactコンポーネントが実行できるのは、とても未来的ですね❗

じつはRemixはサーバー・ブラウザーのシームレスな連携を実現しています → Remix関連ブログ。また、Next.jsは積極的にRSCを開発します → Next.js関連ブログ。
将来のRSCに対応出来なそうなツールを排除しているのではないかと、私は邪推しています。

CC-BY-4.0 ライセンス

react.devのライセンスはGitHubにCC-BY-4.0と書かれています。

CC-BYは、

表示 - あなたは適切なクレジットを表示し、ライセンスへのリンクを提供し、変更があったらその旨を示さなければなりません。これらは合理的であればどのような方法で行っても構いませんが、許諾者があなたやあなたの利用行為を支持していると示唆するような方法は除きます。
追加的な制約は課せません - あなたは、このライセンスが他の者に許諾することを法的に制限するようないかなる法的規定も技術的手段も適用してはなりません。

ということで、適切なクレジット表示等を行へば、社内で新人教育のテキストにそのまま、または改変して使っても問題ありませんし。教育業者がreact.devを基にテキストを作り、それで対価を取っても問題ありません。

この良いドキュメントをどんどん使い、フィードバックを送る事はreact.devの発展に繋がると思います。