ザッカーバーグのハーバード卒業式スピーチが感動的だったのでアプリ作った。
はじまり 5月下旬
英語が話せる友達と飲み会に行く途中こんな話になった。
「どうやったら英語話せるようになる？」
「Helloは聞き取れるでしょ？ でもちょっと難しい文になると途端に聞き取れなくなる」
「Helloと同じくらい自然に聞き取れる文を自分の中に増やすといいよ」
とても当たり前なことを言われたがその時、なるほど。と思った。
ハッピーアワーの時間は料金が半額なのでブリティッシュパブによく来る。
到着すると先に着いていた別の友だちが、外国の人と英語で談笑していた。
カッコイイなあと思った。
飲み会も中盤の時、彼がザッカーバーグの動画観た？面白かったよ。と話していた。
帰ってからツイッターを見てると、
ザッカーバーグのハーバード卒業式スピーチが感動的だったので日本語訳した。
の記事を見つけた。読んでいくうちに本人が喋ってる動画を見たくなりYoutubeを開いた。あんまり聞き取れなかったけれど、話してる姿を見て「この人の言ってることを英語の音声のまま理解したい」と強く感じた。
そういえば、英語を聞き取れるようにしなければ と思う機会がこの頃多かった。
中国から来てる研究室の美人のドクターと話した時もまじで何言っているか全然聞き取れなかったし、rebuild.fmを聞いて いつかは海外で働きたいなと思っても英語が聞き取れなからスタートからまず無理だと思った。
普段からプログラミングのドキュメントは英語で読んでいるけど、聞き取りと話すことが全くできない。なんとかしなきゃと思っていたので、丁度いいきっかけだ。
英語が聞き取れるようになりたい。でも参考書や普通の教材でやっても続かない。
ただ、僕はザッカーバーグの英語が聞き取れるようになりたい。そう初めは思ったので、ザッカーバーグの動画から英語を学べる環境を作ることにした。
制作
その次の日から開発に取り組み１週間弱かかって完成した。
バックエンドは冒頭の英語が話せる友達に作ってもらった。センテンス解析でpython、クライアントからのリクエスト処理でRailsを使ったらしい。
僕はフロント担当で今回はreact nativeを使ってみた。作りやすくて速く書けてプロトタイピングに適していると思う。アプリの機能自体はまだまだだと思うけど、一旦リリースしてこれからもアップデートしていきたい。
作ったもの
「Helloは聞き取れるけれど、ちょっと難しい文になると途端に聞き取れなくなる。
そんな人は、自分の中にHelloレベルに聞き取れる文を増やそう！それもかっこいいの憧れの人から！」
使ったツール等
react native はFacebook,Messenger,Airbnb等のモバイルアプリでも使われている、アプリを作るツールです。
```
react 16.0.0-alpha.6
react native v0.44.2
react-native-router-flux 3.38.0
react-redux 5.0.4
redux-thunk 2.2.0
axios 0.16.1
react-native-vector-icons 4.2.0
react-native-youtube 1.0.0-alpha.4
react-native-admob 1.3.0
```
これらのnode packageを使った時生じたエラーの対処法等をQiitaに書いた。
react nativeを始めてから特に参考になったページ等
Getting Started Quick StartではなくBuilding Projects with Native Codeでやる
React Native / JS.coach ざっと見るだけでもおすすめ
【React Native】良さげなコンポーネント紹介 - Qiita これも上の記事のような
Getting Started with Redux - Course by @dan_abramov @eggheadio reduxを学ぶ時に一番分かりやすかったページ（動画で教えてくれる。英語が聞き取れなくてもコードを見れば大体分かると思う。）
GitHub - gaearon/redux-thunk: Thunk middleware for Redux 簡単なアプリなのでredux-thunkで良いと思った。
React.Component - React ライフサイクルの確認でよく見る
Using React-Native-Router-Flux with Redux – Ian Mundy – Medium わかりやすかった
ReactNativeのより良いリスト、FlatListについて。これまでのListViewとの違い。 - Qiita
http://www.gakusmemo.com/?p=794 action内でstateを確認する方法もある
