React勉強会 2016/09/10 @Gizumo-inc.
Reactの勉強会をしたよ
僕が所属している会社でReactの勉強会を行いました。
やるに至った経緯として、僕が9月いっぱいで退職をしてしまうため、社内で動いているReactで書かれているプロダクトの保守・運用が現状だと心配っていうのがあって、僕が辞める前にReactの布教をしておかねばと言うことで。
もちろん別で引き継ぎ用のドキュメントは作っているけれど、技術的に触ることができる人ってのが増えれば増えるほど安心感がある。
実際のところ、社内のプロダクトはReact + Reduxという構成なので今月中にReduxの勉強会も開くつもり。
勉強会を開くにあたって
いつも社内勉強会やるときはなんとなくで進めちゃうんだけれど、今後外に開いた形の勉強会を作っていきたいなあーとふわっと考えているので、その練習も兼ねて今回はちゃんと時間設定してそれに合わせて進めていくっていう形をとってみた。
なので事前にスケジュールをたてました。
開始時間は13:00で、16:30終了が目標。3時間半で全てを終えられるように流れを組んだ。
流れ
当日のスケジュールは以下。
- 【13:00 ~ 13:30】Reactの概要説明スライド
- 【13:30 ~ 13:40】質疑応答
- 【13:40 ~ 14:00】ツール解説＆環境構築
- Reactハンズオン
- 【14:00 ~ 14:10】hello world
- 【14:10 ~ 14:20】親子コンポーネント
- 【14:20 ~ 14:40】状態の変化(カウンターサンプル)
- 【14:40 ~ 14:50】ライフサイクルメソッド
- 【14:50 ~ 15:00】休憩
- 【15:00 ~ 15:30】Fluxの概要説明スライド
- 【15:30 ~ 15:40】質疑応答
- Fluxハンズオン
- 【15:40 ~ 16:00】カウンター
- 【16:00 ~ 16:20】todoアプリ
かなりきつきつで辛そうな雰囲気がひしひしと漂うスケジュール。
勉強会の内容について
スライドは以下になります。
リポジトリはこちら。
https://github.com/nabeliwo/simple-react-sample
まずはスライドで概要を説明して、その後リポジトリをcloneしてもらってその中にあるコードでハンズオンをしていくという流れでした。
src/app.jsx がメインのファイルになって、そこに処理を書いていく感じ。書いてほしいコードは sample/ の中に全て入れています。コピペではなく、写経していく形で進めた。
やってみて
実際にやり終えてみての感想的な話。箇条書きでいく。
- 最初に懸念してたところなんだがやはり時間通り始められなかった。20分遅れでスタート。うちの会社は基本土曜の勉強会の開始時間が守られない。
- 環境構築でWindowsの人でちょっと手こずってしまった。そもそもリポジトリcloneしたときにGet Startedに書いてたコマンドがWindowsで動かないものだったり。そこらへんの配慮が足りてなかった。まあコマンドとかを何でも使えるものだけでやらせるとかをクリアしてたとしても、個人個人が入れてるNodeのバージョンとかそういう諸々を固定したいだとかそういうとこ考え出したら、本当にしっかりやりたいのであれば今後はvagrantで仮想環境立てて〜とかでいかねばならぬのだろうか…それはそれで環境構築のコストかかりそうだが…まだ悩みどころ。
- ハンズオンパートでのスケジュールの考え方がだめだめだった。一つのパート10分くらいでいけんだろと思ってたが実際はその倍は普通にかかった。JSに慣れてない人であるとか、そもそもプログラミングを始めたばかりの人とかもいる中で、動かない〜ってなる人がたくさんいたが、それはまあ予測できることだった。大体タイポとかが原因のほとんどなので僕がいってコードを見ればすぐに解決するものではあったが、そこらへんのケアレスミスを予防する環境を作っておくべきなのだろうか。lintをリアルタイムで出してくれるエディター用意させるとか。現実的ではなさそう？
- 結果的にReactのパートだけで17:00を迎えてしまい、泣く泣くFluxのパートはまったくやらずに終了した。結果だけ見ると予定を40分超えてそして約半分しか終わらず終了っていうひどい形…。まあReact勉強会という名目なので特に問題はないが、その先を伝えたかった感はあった。なのでFlux勉強会をまた開く必要がありそう。
- まだ受講者からのフィードバックをしっかりもらってはないので正確なところはわからないが、JSの初心者の子とふわっと会話した感じでは「雰囲気はなんとなくわかった」っていう曖昧な感じだった…。今回はJSをある程度わかる人を対象にしていたからまあ仕方ない。ただそこに飛び込んできてくれた勉強しはじめの子に対してのケアとかもなんらかの形でできないものかとは思っている。思っているけれど難しい…。
今後意識すること
- 勉強会の目的と対象者をはっきりさせる
- 必ずトラブルは発生するのでそれに対応する時間をスケジュールに考慮させる
- 終わったあと必ずフィードバックをもらう
まとめ
総じてスケジュール感が甘い、状況の想定が足りてなさすぎるという感じだった。
スケジュール組んで資料を作り終わった段階で一度ロープレしてたらよかったかも。
あと当日これないけど話聞きたいって人がたくさんいて、スライドとリポジトリ共有すればまあいいかなとは思うけれど、スライドは口頭で補足することを前提に作っているからキーワード的な部分しか載せていないわけで、勉強会に来ない人も想定して作るのであればスライド内で全てを説明する必要があるなあと思ったり。
そうなると勉強会内でスライドをする意味が薄れてくるからスライドは事前共有しておいて、当日はさらーっと流す感じにしてもっとハンズオンに時間を割くべきであるかとか。。。
考え出すといろいろと止まらないけれど、前提条件として「開くことで僕が得をする」ってのだけはブレることのないように今後も勉強会の開催とかをやっていきたい。
そして少しずつ規模をでかくしていけたらいいなあ。
