React Native 1ヶ月半やってみての棚卸し
これまでに学んだことの棚卸し。
作ったアプリ↓↓
React Native自体について
constで定義したコンポーネントをclassで定義し直すことが多かった。
装飾がメインの役割のものはconstで定義して、props.childrenを表示するのが良さそう。
propsなのかthis.propsなのかがよく分からなかった。
あと、class内でconstを定義できないのもよく分からなかった。クラスのメソッド内なら定義できたけど。
ListViewクラスのdatasouceはコピペで乗り切ってしまった感がある。
reduxでactionのエラーをキャッチしようとすると、そのキャッチの範囲がコンポーネントの再描画あたりまで行き届いてしまう。
（action→reducerで値を書き換え→propsに変更→コンポーネント再描画、までtryの中ってことらしい）
iOSについて
http通信を許可するためにinfo.plistに書き込まなければいけないのに気がつくのに時間がかかった。
(info.plist自体も複数あって、どれに書き込むのかよく分からなかった。)
こんな感じにした↓↓
Appetizeにアップロードするまでに時間がかかった。
ローカルのjsbundleを参照させるのに苦労した。公式ドキュメントに当たる癖をつけたい。
ローカルのjsbundleを参照すると、シミュレーターでは出なかったエラーが出る。
（それまでcatchで気づかずに握りつぶしていたもの？）
今後の課題
* Expoのアプリ側でのリロード方法が分からない。
* Navigator関連が分からない（俺はreact-native-router-fluxを使っている）
* reduxとasyncStorageを一緒に使うとき、どのタイミングで書き込むのがベストか分からない
* Expoを使うべきなのかreact-native init [アプリ名]でやるべきか迷ってる
オープンデータの使用事例が知りたい
オープンデータを使ったアプリで、いい感じのアプリって本当にあるのかしら？
ハッカソンに出る中で疑問を持つようになったので、調べてみました。
調べ方としてはこんな方法が考えられると思います。
1. オープンデータの使用事例をまとめているサイトから探す。
例: Open Data Impact Map の Use cases
2. オープンデータを公開しているサイトに行き、その中で「使用事例」のページを探す。
例1: LinkData.org の 公開アプリ一覧
例2: data.gov.uk の Latest apps
3. そのほか、ブログの記事などから探す
例: Open Data Use Cases In Five Cities |
1. と 2.の方法だと見つかるものが玉石混交になっているので、
今回の目的（いい感じのアプリがあるかどうか知りたい）から行くと、人力で選んでくれている3. の方法が良さそう。
で、そのブログで紹介している内容が以下。
************
イギリス、ロンドン
Apps & Analysis – London Datastore
ロンドンのオープンデータをまとめたサイト。
ユースケースっていうよりプラットフォームだよね。
アメリカ、シカゴ
地域の情報を検索して地図上にマッピングできるサイト
例えば映画のロケ地とか、通行止になっている場所とか
アメリカ、ニューヨーク
地下鉄マップにかざすと、地下鉄の現在位置や混雑状況がARでマッピングされるアプリ！
オランダ、アムステルダム
アムステルダムのいろんな地理情報を地図にマッピングしたものを集めたサイト。
ソフィア、ブルガリア
こちらはユースケースではなく、最近オープンデータの取り組みを始めた国の紹介。
************
一番すごいな、と思ったのがニューヨークの地下鉄マップを使ったARアプリ。
気がついたこととしては、地図にマッピングするアプリが多い気がするな〜。
結論としては、かっこいいオープンデータの使用事例はありました。
npmとかyarnとかとの戦い、3日目にして終結
react-nativeのアプリにライブラリ追加したらsimulatorがレッドスクリーンになった。
どうも依存性とかいうのが悪いらしい、
npmとかyarnとかわからないことが多すぎるのでここで棚卸ししたい。
初日(2017-06-11)
react-nativeのプロジェクトとreact-native自体のバージョンが違ってると出るらしいエラー発生。
困ったら次の通りやればいいって知見を得た（それで解決するわけではない）
rm -rf node_modules
npm cache clean --force
npm install
コマンド&オプション
listとversionsとかの違いが未だに覚えられない
依存性でつまづいてる時はnpm listでエラーが出るっぽい
このころは--saveがよく分からなかった。
っていうか-gは未だによく分かってない。grobalに入れてくれるの？なんか依存性とか大変そう...
npm iがinstallの略らしいということに気がつき、node文化は省略が多い気がする
2日目(2017-06-12)
知人のreact使いに --saveすると packageに入るってことを教えてもらった
俺も仕事で使いたいよーreactとかそういうの
パッケージの追加インストールが依存性をぐちゃっとしたらしい仮説に気がついたのが２日目
yarn.lockとpackage.jsonとpackage-lock.jsonの違いが分からん
後yarn add (ライブラリ名)とnpm install (パッケージ名)の違いもわからん
yarnの方がクールということは分かった。俺は雰囲気でnode.jsをやっている...
コマンド&オプション
npm install --save react-native@latest を
npm install --save react-native latest にして
latestという名前のライブラリがインストールされた笑
友達のインフラエンジニアが言ってた、環境周りは手打ちをするなと...可能な限りコピペするのだと...
create-react-native-appとreact-native initの２種類があることも知った
前者の方がイケてるらしい
3日目(2017-06-13)
stackoverflowで優しい人が教えてくれた...
https://stackoverflow.com/questions/44489330/undefined-is-not-an-objectecaluating-reactinternals-reactcurrentowner/44503337#44503337
しかもすでに見たはずのgithubのissueにあったやつ
ちょっとマヌケじゃないか自分...
第一次産業ハッカソン 〜Tinder流行りすぎとちゃいます？〜
今日はREAPRA VENTURESさんとスローガン株式会社さん共催のハッカソンにいました。
Tinderクローンの「八百マッチ」というアプリを作って（僕コーディングしてないけど）アグリゲートさんの企業賞をいただきました。
ところがなんと。Tinder風アプリが12チーム中３チームもあった🔥
僕のチームは「お店に入荷した野菜とお客さんとのマッチング」を謳うTinderで、魚業界の課題にトライしたチームは「マイナーな魚料理とお客さんのマッチング」、花き業界のチームは「花とお客さんのマッチング」でした。
Tinder率、高くないですか？どうしてですかね？
暇な女子大生効果か、という仮説は一旦棄却するとして🗑マッチングサービスが随所で求められてるんじゃないかってのは妥当な感じがすると思ってます。
第一次産業の場合は、高付加価値を実現するためにスーパーには無い多様な品揃えをする戦略が当たっていて、それがTinderのUIとマッチするわけです。
これは他の業界にも言えると思うんですよね。例えば図書館ハッカソンとかあったら、本と利用者のマッチングをするTinder作ったら優勝（一般的な意味で）できると思います
旅行会社のハッカソンがあったら「旅のプランとお客さんをマッチングするTinder」とか。映画Tinder、歌舞伎Tinder、大学Tinder、なんでもありです。
ただそれが急に流行りだしているのだとしたら...やっぱり暇女効果なんですかね。笑
react初心者さわら、react-nativeを試す
目次
* なぜやったか
* 何をやったか
* 結論
# なぜやったか
SPAJAMに出場することになりました！...が、メンバーほぼ全員スマホアプリ未経験者です
今回swiftかreact-nativeかを学ぶので、swift経験がちょっっとだけある僕が選定をすることになりました。
# 何をやったか
reactとreact-nativeのチュートリアルをやったよ。
* react
http://qiita.com/okamuuu/items/1b94ab69d1bc3fb82d27
* react-native
https://facebook.github.io/react-native/docs/getting-started.html#content
### やった感じ
* react-nativeの学習コストはswift同じくらい"ではない"気がする。
react未経験、モダンなjavascriptも未経験だと無名関数とかアローとか多用されてて辛い
* xcodeでアプリ作ったことがないと構成が分からなさそう（まだ多画面のチュートリアルしてないけど）
* ソース置換するだけでビルドし直さなくていいらしい（その恩恵を感じるレベルに達していない）
* iOSとアンドロイド両方作れるのは、少なくともハッカソンには関係ないんだよな
* Facebook公式ガイドがreact未経験者に優しくない（それはそうだ）
* Qiitaが少ない！！！！！
### 学んだこと
チュートリアルやる前にnode.jsとnpm updateをするべし
reactもreact-nativeも、アプリの雛形を自動で作ってくれる。
npm installは-gでgrobal、--saveでpackage.jsonへの記載をしてくれる
# 結論
react-nativeはモダンなjavascriptよく分からない人には難しい！
でも個人的に未来を感じたのですごいやりたい
サンノゼ休暇:反省編
もしもう一度今回の旅行をプランし直せるなら...
# 人
* 誰かと一緒に行くといい。Uberが相乗りで割安になるから。
# 期間
* 予約2週間前は遅い。チケット代が馬鹿にならなかった。とはいえ、何もしないGWより全然よかった。
* ステイ5日間は短い。駆け足で名所を見て回るならともかく、コワーキングスペースとかに入り浸るなら全然足りない。1週間欲しかった。
# 場所
* サンフランシスコにステイすればよかった！サンノゼとサンフランシスコは遠い。その上、日本ほど公共交通網が整備されていないので、移動時間の長さは日本での感覚以上になる。
* 名所のマッピングは事前にもっとやれた。Yelpの評価高い店をGoogleMapのマイマップにプロットするだけで全然違う。
# 観光
* Noisebrdge（次点でGalvanize co-working）はマスト。行ってよかった。
* シリコンバレーの観光地は広い範囲（東京と千葉と神奈川を合わせたくらい）に点在しているので、今日はどのエリア、というのを事前に決めておかないと厳しい。
# その他
* UberとLyftのアクティベーションを国内でやっておくべし
* データ通信量が1日100MB以内に収まるように国内でスマホの設定を調整しておくべし。バックグラウンド通信にかなり持って行かれて通信量でウン千円払うことになった。
* プリペイドSIMは電話もできるプランの方がいい。（現地で何かサービスに加入することになったら、SMS認証が必要かもしれない）
ま、なんにせよ行ってよかったけどね！
サンノゼ休暇5日目
ちょまどさんがシアトルにいるらしい。シアトルといえばサンフランシスコと同じく西海岸だが、距離は東京-稚内間くらいある（1400kmくらい）
いずれ目の前に立って対等な立場でお話ししたいとか思っている。
今日は実質の最終日で、サンフランシスコはNoisebridge（ノイズブリッジ）でコーディングをしていた。寄付金で成り立つコワーキングスペースだけど、雰囲気はワークショップと言ったほうが正しいと思う。
ハッカー文化丸出しで最高にクールだった。
部屋の入り口からして最高。
寄付金で運営されている。立ち寄ったらちゃんとdonateしような
奥にはおなじみオライリーの動物本も。
ガラス瓶で出来てる。
ハードオフみたいだ。
生物の実験もできるらしい。
ビル自体の入り口の場所がわかりづらい上、チャイムを押しても中の人が面倒がって出てくれないこともある。
新人には常連がツアーするのが慣例らしく、僕が昼に入ってから夕方に出て行くまで新人が3組来て案内を受けていた。うち本当にコーディングしに来たのは1組で、2組は観光客だった。
Do-ocracyというのがここの精神らしく、要はいちいち許可を求めないで手を動かせということらしい。素敵かよ...。
観光施設じゃないから万人受けはしないと思うけど、エンジニアならオススメ。
ちなみにコーディングはthreejsをいじっていた。フロントで立体モノをささっと作りたいと思っている。
