パンが主食

学んだことのアウトプット+ポエム

『Re:ゼロから学ぶReactNative入門』を読んだ

新たな知見、感想をまとめます。

1章

エモい

2章

  • ECMAScriptJavaScriptの中核使用を抜き出して標準化したもの

  • ReactNativeは大規模アプリに向かないらしい。何をもって大規模なんだろう・・・。弊社プロダクトは小規模?

  • ExpoはReactNativeの開発支援ツール。ネイティブのビルド処理をよしなにしてくれる。プロトタイプ向け。

3章

  • react-native run-iosでこけた。XCodeの設定が足りていなかったよう。これを見て解決。

stackoverflow.com

  • command + Dのメニューからホットリロードをオンにできる!!!!!!良い!!!!!!!!  VSCodeで自動保存してるとタイプするたびに反映されるので楽しすぎる。

  • そういえば弊社ではiosシミュレータを立ち上げるまでに、コマンドを3回ほど叩いた記憶が・・・。1度で済まないんだろうか。  そもそもそれぞれ何をしているのかよく分からない。

4章

  • アプリ実行時はルートのApp.jsが動く

  • 変数、定数の宣言は3つあれど、constを使うべし。varだけはダメだ

  • Platform.selectでOSごとに処理を分けられる。

  • コンポーネントのreturnでnullが評価されると何も表示されない。

  • render内に複雑な分岐を設けるのはやめよ。

  • propsは親から子へコンポーネント間で渡される書き換え不可能なデータ。  試しにHoge.jsで代入してみたら変わっていなかった。つまり試みてもエラーにはならないけど、書き換わりはしない。

  • stateはコンポーネント内の状態を管理するデータ。

  • stateはconstructorで初期化し、setStateを使って変更する。 子クラスでのpropsの操作同様、変更を試みてもエラーにはならないけど、書き換わりはしない。

  • constructorでは先頭でsuper(props)を呼ぶのがお約束。 忘れると、this.stateが評価された際にundefined is not an object。 this.stateもないと子クラス呼び出し個所にてReference: this hasn't been initialised super() hasn't been called

  • ButtonのimportとgetTextが文中にないので初学者戸惑う・・・

  • コンポーネントから親コンポーネントへの情報の受け渡しはコールバックを使う。 あれ、、?bindしなくてもエラーにならないぞ・・・ 文中でもgithubのコードでもbindしてる様子はない。

  • async/await、この例だけでは何が何やら・・・

  • background-colorみたいな形式ってケバブケースって言うの・・・

5章

特になし。

6章

  • 同じハマり方をするもnpm startからのreact-native run-iosで復活

stackoverflow.com

  • Stack Navigatorのところでエラー。バージョンによる違いの模様。こちらを見て解決。

qiita.com

  • list型のstateを更新する際は、オブジェクトのコピーを渡す
こうしたり
this.setState({ todoList: todoList.map(item => item) });

こうやったり
this.setState({ todoList: Object.assign([], todoList) });
  • keyは文字列としてAddTodoScreen.jsに渡しているが数値でも問題なし、何ならkeyは全ての個所において数値で扱えた。

モヤモヤ

  • async、awaitの使い方、まだまだわからぬ

  • 時折HotReloadingをONにしていても反映されなかった気がする

総括

やはり書くのが一番というわけで何度か写経した後、何も見ないで作るという工程を3〜4回ほど繰り返した。 不思議なもので何度か何も見ないで書けると完全に理解した気になれた。

github.com

NEXT

  • 『達人プログラマ

  • 『デザイン指向は世界を変える』