React と React Native のスレ (481ﾚｽ)
上下前次1-新
367: 2022/09/27(火)17:25 ID:fOqsMNTu(1/3) AAS
Reactに関しては関数コンポーネントしか使わないけど、それ以外の部分では臨機応変に使うのみよ。まぁそれでもclassの出番はかなり限定されるけど……
368(1): 2022/09/27(火)17:28 ID:YFL0VkhR(1) AAS
プロジェクトメンバーにどうして混在してるのか聞いてみた？
369: 2022/09/27(火)17:29 ID:fOqsMNTu(2/3) AAS
jsにおけるclassの出番って、大量に作成し、なおかつ副作用があるオブジェクトがある場合くらい……。
370: 2022/09/27(火)18:13 ID:dJevJ7EZ(1/2) AAS
クラスコンポーネントは公式に非推奨扱いじゃね
371: 2022/09/27(火)18:15 ID:397xSubl(1) AAS
話の流れで関数コンポーネントかクラスコンポーネントかの話は終わってるのは分かるっしょ
372: 2022/09/27(火)18:20 ID:dJevJ7EZ(2/2) AAS
Reactなので将来容赦なくクラスコンポーネントが無くなるかサポート切ると思う
373(2): 2022/09/27(火)20:04 ID:CMfXpwKQ(4/5) AAS
>>368
うん
「本当はよくないんですけどね～～」
的なことを言ってたよ
他にも
・propsのバケツリレー
・コールバック関数使って 子→親へのprops逆流（これが一番酷い）
・アロー関数とnamed functionの混在
・typeとinterfaceの混在
・mui使ってるのに無駄にemotionでカスタムコンポーネント作成
等々………
どの現場もこんな感じなのかなぁとは思ったりするけど
やっぱ立ち上げ段階でコーディングルールやら設計やらある程度固めとかないとスパゲッティ化するんだね
374(1): 2022/09/27(火)20:20 ID:6DdS+dLy(1) AAS
プロジェクトメンバーが現状を問題と捉えてるならどういう方針でコードを
書いていけばいいかお伺いを立ててそれに従うべきでしょ
もちろん自分の意見があるならそれも伝えて
375(1): 2022/09/27(火)20:22 ID:fOqsMNTu(3/3) AAS
>>373
Java屋PHP屋Cobol屋の混成チームでコーディングルールも設計もフワフワとか地獄やん……。
PMがフロントエンド舐めてたのかな。
376: 2022/09/27(火)20:39 ID:CMfXpwKQ(5/5) AAS
>>374
リモートだけどSESだから元請けに当たる人に対して
ガチでWEB開発業務1ヶ月目の俺からは意見しにくいんよ、、(笑)
スタイリングぐちゃぐちゃだったのはさすがに言ったけど
でも言うとこは言ったがいいね。ありがとう。
>>375
アジャイルってこんなもんなんじゃないの？知らんけど(笑)
でもしっかりしたreact案件でちゃんと現場のこと学びたいとは思うわ
377: 2022/09/27(火)22:23 ID:/UUTRmF2(1) AAS
>>362
jsでクラス使わないことは多いが、だからといって今時 __proto__ なんて直接使わないから
プロトタイプベース云々は関係ない。
378: 359 2022/09/27(火)23:17 ID:oW3s344K(1/2) AAS
>>373
React実践の教科書、2021
基礎はこの本で良い。3日で読める
propsのバケツリレーは、
グローバルState である、useContext を使うと書いてある
これ以上に複雑なものは、Redux, Recoil, Apollo Client など
useMemo など、use何々にはどういう機能があるか、すべて見た方がよい
379: 359 2022/09/27(火)23:29 ID:oW3s344K(2/2) AAS
Reactビギナーズガイド ――コンポーネントベースのフロントエンド開発入門
Stoyan Stefanov, 2017
この本には、createClass と書いてあるけど、
2017年6月には非推奨になっている
var MyComponent = React.createClass({
render: function() {
return React.DOM.span(null, "カスタムコンポーネント");
}
});
380: 2022/09/27(火)23:53 ID:BMrl8a7V(1) AAS
なんでそんなにクラスコンポーネントの話にこだわるの？
381: 2022/09/28(水)20:45 ID:KHG5QcXL(1) AAS
presentationalとcontainerに分けて書くといいよ、って本かなんかで読んだことある。今のプロジェクトでも実践されてる。
で、その辺の構成の都合上、仕方なくコールバック関数使ってpropsの値を子→親に伝播させてるけど普通なの？
一般的には状態管理ライブラリ使うべきだと思ってるけど認識違う？
382(1): 2022/09/28(水)21:57 ID:Km2fmn1T(1) AAS
プレゼンテーショナルとコンテナに分けるのはRedux全盛時代の流行でhooks以降は廃れた
それとは別に親から子にコールバック渡すのは極めて普通
useReducerなんかそういう使い方がほとんどだろ
その親がほとんどルート(いわゆるAppコンポーネント)に近いくらい上位にいるならそれはグローバルステート
383: 2022/09/28(水)22:11 ID:0Dahyjoe(1) AAS
グローブステートにRxで変更通知でどうですか？
384: 2022/09/28(水)22:46 ID:HuYE1qae(1) AAS
>>382
へー！なるほど！
その経緯は知らんかったわ！ありがとう
propsの大原則として親→子→……
があって、それを解消するためのグローバルステートと状態管理ライブラリ、という理解なんだけど
グローバルステート使わずに普通にコールバックして直接、
子→親、孫→親みたいな渡し方してるのに違和感感じてたのよ
現場では割と普通のことなのね
385(1): 2022/09/28(水)23:33 ID:N1fcW8jX(1) AAS
え、一つのコンポーネントを表示とロジックに分けるやつもう廃れたのか…
今はどういうのが流行りなの？
386(1): 2022/09/28(水)23:38 ID:QcgKtZxa(1) AAS
ひょっとしてReact Routerって仕組み上ブラウザキャッシュ効かない？
387(1): 2022/09/29(木)01:06 ID:6obmiat7(1/4) AAS
>>385
ロジックはhooks
データ取得もhooks (swrやReact Query)
そのデータ取得hooksはデータを表示するコンポーネントで呼び出す
これは特にGraphQLではフラグメントコロケーションと呼ばれる
GraphQL以外でもRemixがコロケーションを実現してる
総じて変に分類するより凝集度を高くする方向に進化してる
388(1): 2022/09/29(木)01:29 ID:ffAnOOZb(1) AAS
>>387
例えば複雑な条件と処理に応じた多様なウンコの画像表示するコンポーネントShowUnkoがあったとして
その条件や処理をShowUnkoの中に全部書くのが流行りなん？
presentationalとcontainerの例だと
複雑な条件と処理をcontainerに記述して
算出した結果をpresentationalに渡してウンコの画像が出るけど
今の流行りは色々なライブラリ駆使してそれらを一つに纏める、ってこと？
…まぁ少なくとも個人開発してる頃は後者のが全然やりやすかったけど
389: 2022/09/29(木)07:28 ID:+pwL/l2M(1) AAS
>>386
くっそ短絡的だった。サイズがデカイjsファイルだけURL固定すりゃ良いだけだったわ……
390(1): 2022/09/29(木)07:40 ID:6obmiat7(2/4) AAS
>>388
いやいやいやロジックはhooksって書いたじゃん
複雑な条件や処理とやらはuseUnkoに書いてShowUnkoはそれを使う
391: 2022/09/29(木)08:51 ID:DUgkcSyO(1/2) AAS
Ruby on Rails では、コントローラーの肥大化を防ぐために、
Skinny Controller, Fat Model を推奨した。
その結果、モデルが肥大化した
そこで今度は、モデルの処理を減らすために、
Form Object, Service Object へ処理を分けた
また表示処理は、Presenter へ分けた。
それで、Form Presenter, Model Presenter が出来た
392(1): 2022/09/29(木)08:54 ID:vsyIBCv9(1/2) AAS
>>390
コンポーネントにロジックを記載するのではなく
カスタムhooksとして切り出すってこと？
理解力乏しくてすまん
393(1): 2022/09/29(木)09:34 ID:6obmiat7(3/4) AAS
>>392
そういうこと
394: 359 2022/09/29(木)09:39 ID:DUgkcSyO(2/2) AAS
React実践の教科書、2021
この本には、カスタムフック・自作のHooks も書いてある
ロジックをコンポーネントから分離し、複数コンポーネントで再利用する。
共有ロジック
395(1): 2022/09/29(木)09:52 ID:clewMKt/(1/2) AAS
>>393
hooks限定である必要はないと思うが...
396: 2022/09/29(木)10:45 ID:6obmiat7(4/4) AAS
>>395
元々コンテナコンポーネントに書く必要がないようなロジックの話をしてるつもりはないんだよなぁ
React無関係なロジックを普通の関数に切り出す話ならReactスレで話さなくていいだろ
状態やライフサイクルなどReactに依存したロジックを切り出すならuseStateやuseEffectを使う関数になりそれはカスタムhooksと呼ばれるということ
上下前次1-新書関写板覧索設栞歴
あと 85 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ
ぬこの手 ぬこTOP 0.009s