React難しいなあ。今日は一日向き合ってみようと思って書いている。概念的には理解しても、実際書いてみるとかなり悩む。まずどこから書いていくと考えやすいのかが難しい。依存の無い純粋なものから書いていくのが楽なんだけど、React、Reduxの構成の場合どこが純粋なのか…。
とりあえず一画面書いてみた感じだと、ReactComponentから書くのが楽だった。ReactComponentには画面構成に必要なものがどこかから渡されて this.props に束縛されているという前提でザクザクと書いていける。ReactComponentのdefaultPropsに this.props の初期状態を書くんだけど、開発中はここにテストデータをハードコーディングしちゃうと楽だった。画面を作ったらライフサイクルを設計しておく。マウントされた瞬間に this.props に何か束縛して欲しいなら componentWillMount() で this.props.onMount() を呼ぶようにしておく。ライフサイクルに沿った命名規則を決めておいて、他のライフサイクルも this.props にその名前で関数が束縛されている、というルールを決めておくのが良いだろう。そのあとはreact-reduxの connect() と ReduxのActionとReducerを書くかな。この3つは絡み合っているので同時に考えていったほうが良さそうだ。
ICONIXプロセスと相性が良いのではないか、という仮設があったから試してみたけど、あんまりワークしないなあ。ReactComponentを作りながら this.props を作り込んでいって、「このイベントが起きたときはこのpropsがこうわかるな」という感覚を養ってからRedux側の実装を行うのが最も効率が良さそうだ。
という感じで書いていったらいちおう一枚の画面は作ることができた。これはなかなか骨が折れるなあ。Material-UIを使っているけど見た目は正解がないからこだわりすぎてしまう。ピュアReactで画面だけデザイナーさんに作ってもらってからReduxをエンジニアが作り込むのはどうか。まあチームにデザイナいないんだけど…。
新しい技術学ぶとき仕事で使うのが一番だよ、とどっかで読んだけど、まさにそのとおりという感じがする。単純に投資できる時間が増えるのと、わかりやすく使う先があるのが良い。「このフレームワークのこの昨日は、いまから実装しようとしているもののこういうときに使うんだな〜」というのを想像するし、実際に実装もやるし、社内に強いひとがいればレビューももらえる。でも新しいことだけやっていても仕方がないので得意とするところで爆速で仕事を片付ける必要もある。がんばろう。
