book icon indicating copy to clipboard operation
book copied to clipboard

JSXのページにて、React特有のことはその旨が分かるように明記しませんか?

Open yudai-nkt opened this issue 2 years ago • 1 comments

今回のアップデートでJSXに関する個別のページが追加されたと聞いて拝見しましたが,JSX一般に関する話とReactのJSXに関する話が混在しているように感じます.たとえば,

ただし、class属性はJavaScriptの予約語であるため、代わりにclassNameを使用します。

とありますが,Preactなどに見られる通りpropsのキー名にclassを使うのは妥当なJSXです.これはJSXを脱糖するとpropsはオブジェクトになりますが,ES5以降ではオブジェクトのプロパティ名に予約語を使うことが可能だからです.ぱっと読んだところで他に気付いたのは以下の3点です.

  • 「スタイル属性はオブジェクトでなければなりません」(§スタイル属性
  • 「フラグメントは<React.Fragment>タグを使って明示的に表現することができます。」(§JSXでのフラグメントの使用
    • jsxFragmentFactoryを持ち出さずにshorthandでない記法の話を一般論に広げるのは難しそうに思うので,ここは仕方ない気もします.
  • 「map関数を使用してリストを作成する際には、各要素に一意のkeyプロパティを付与することを推奨します。」(§マップ関数内で一意のkeyプロパティを使用する
    • これは直後に「これによりReactは変更、追加、削除を効率的に適用できます。」と書かれていますが,JSX一般で必要な話ではない一例として念のため挙げさせていただきました.

まず前提としてサバイバルTypeScriptはTypeScriptの正式かつ網羅的なレファレンスではないことや「Reactなどについても扱います」と述べられていることは理解しております.JSXはReactだけのためのものではないとは言っても本書の対象読者がJSXに触れるのはReactを扱いたいのが大半だと思うので,「ここだけはおさえておけば、実務で死なない(=サバイバルできる)」という目的を踏まえてReact特有の事項にも言及すること自体は賛成です.

その一方で読者が今後ほかのライブラリでJSXを使うようになったときに混乱を招かないためにも,ReactでJSXを使うとき特有の話はその旨が分かるように明記されていると良いのではないかと思ったのですがいかがでしょうか?懸念点としては,この提案が余計なお節介で「これはJSX全般の話,あれはReactのJSXの話」などと細かく区別して書くことで情報量が増えて却って初学者が取っ付きづらくなってしまわないかが心配です.

yudai-nkt avatar Aug 02 '23 15:08 yudai-nkt

全体をお読みいただき、本書の背景を踏まえた上で詳細なフィードバックを下さりありがとうございます。

ご指摘はごもっともで、本書はReactにフォーカスはしているものの、React固有のことについてはそれぞれ「Reactでは」のような明記をしていったほうがいいと思いました。

さらに本ページの冒頭で、「React固有のことについては「Reactでは」などと明示します」などと一言いれておくことで、「Reactでは」で始まる部分には注意してもらえるように、本ページの読み方のガイダンスもしたいと思います。

React固有の話を区別して表現するだけであれば、読者がとっつきづらくなるといった心配はないと思います。

suin avatar Aug 02 '23 20:08 suin