同僚の非サーバーサイドエンジニアと一緒にReact.jsを勉強し始めた時の話

2. じこしょーかい
なまえ：もりかわたかゆき
せいそくち：きょーとちほー
おしごと：えんじにあ
とくいなこと：ばいおりん
とくいじゃないこと：ひとまえでしゃべること
げんご：ぴーえいちぴー
かいはつかんきょー：どっかー

3. きっかけ
まず、りあくとがすごーくたのしそーだったの！
あとね、きぞんのコードもちょっとむずかしくて
フレンズたちがよむのにつかれちゃったんだ。
いままでさわっていなかったものをさわってみるのって
たーのしー！
フレンズたちにもたのしんでほしーな。

4. へーきへーき！フレンズによって得意なこと違うから。
■同僚：jQueryがとくいなフレンズ。非サーバーサイドエンジニア。
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
黒画面はあんまり得意じゃない
■いったんのゴール
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Reactを少し触った後、Material-UIを使って遊んでもらう。
まず動かして「たーのしー！」と思ってもらうことをゴールとする。
■node.js導入まで
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
基本的にはここを参考にしてもらった。
http://www.hirooooo-lab.com/entry/development/install-node

5. みちのり①
■案の定詰まるnode.jsの導入
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
ここは多分詰まるだろうなと思ったので、参考URLを送ったり、
ちょくちょくPCも借りてサポート。
■詰まってたところ①
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
node.jsの最新版インストール
$ nodebrew install-binary latest
ディレクトリがなくてエラーを吐いてたので
https://blog.yug1224.com/archives/5693a5e0fef2539c7d5b149d
を紹介

6. みちのり②
■詰まっていたところ②
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
nodeコマンドの実行パスが通っていなかった。
$ echo 'export PATH=$PATH:/Users/xxxxx/.nodebrew/current/bin' >> ~/.bashrc
一旦.bashrcの中身を確認。何度かechoを打った痕跡があった。
結局.bashrcが読み込まれてなかったことが原因だった。
参考サイトとして
http://kinacom.hatenablog.jp/entry/2015/05/28/180523
を紹介。
わからなかったらサポートする予定だったけど、
自力でがんばってくれた。えらい！

7. わーい！導入できたよー！
「多分できました。。。」との報告をもらったので、ターミナルを再起動
してからnode-vコマンドでnode.jsのバージョンを確認。
無事最新版になっている。
ここから基本的なReact×Reduxの動かし方と、Material-UIを使った
ハンズオンをやっていくつもりだったが、仕事の都合上まだ開催
できず。折を見てやりたい。

8. ここまでのふりかえり①
■過保護すぎ？
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
関心を持ってもらうことが目的なのであれば、
やり始めは過保護なくらいで丁度いいと思っている。
業務と関わりのない趣味レベルのことであれば尚更。

9. ここまでのふりかえり②
■情けは人のためならず
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
丁寧に教えることで、自分の復習にもなる。
普段触りなれない部分だったこともあり、導入には詰まっていたけれど
実際に使い始めたら色々とできるようになってくれることも全然考えられる。
逆に自分に知見をもたらしてくれるかもしれない。
（ちょっと悔しいけどｗ）