リモート期間でもReact勉強会をやりきった！

フルリモート期間も含めてReact勉強会（全4回）を社内で行ったのでその内容を紹介していきます！

始めたきっかけと目的

現在プロダクトが２つありReactをゴリゴリ書けるエンジニアがそれぞれ1名ずつしかいないためタスクが集中してしまったり開発の進度がフロントの進捗に依存してしまうことがあった。そのため通常業務でみんなReactを使用できるようになろうということで導入として社内で勉強会を実施しました！

第1回 React入門 Reactって何？

- Reactのディレクトリ構造について
- ReactComponentについて
- stateとprops
- ClassComponentとFunctionComponent
- イベントハンドラ
- ToDoList作成
  …etc

第2回 hooksの使い方 componentの分割方法について

- useEffectとは
- Presentational ComponentとContainer Componentについて
- SHOP COUNTERで使われているcomponentを実装してみる

第3回 Reduxの考え方について

- Reduxの基本的な考え方
- よく使用されるものに関しての説明
 ・actionCreater
 ・action
・store
・reducer
サンプルコードを用いた説明

第4回 三目並べアプリのライブコーディング

- 今まで勉強会で学んだことを元にライブコーディング

参加した人からの声

- 実際のアプリケーションでどう使うかがわかると理解が進むし疑問も沸いてくる
- 業務中に強制的に勉強する時間が割り当てられたお陰で、他のタスクを言い訳にして勉強する機会を先延ばしできなくなってよかった
- 週一ペースというのも、学んだことを自分なりに噛み砕いて解釈するのにちょうどいい期間だった
- Reactの発想は斬新だったので、教えられたことを自分が持ってる知識と紐付けるのに苦労した

勉強会の反省点

- 見たり聞いたりするだけではなくアウトプットとして実際にコードを書く時間を作って毎回何かしら書いてもらうようにした方がよかったかも、、？

やって良かった点

- 教えることによって相手に伝わるような言語化をする必要があったため自分自身のReactに対しての理解力が深まった。
- 実際に業務の中でReactを使用するをタスクをバックエンドエンジニアが実装する機会も出てきた。

今後

- 今回基本的なReactの部分は話したので、あとは実際に業務で使ってもらいレビューを繰り返して技術力の向上に繋げていく形でReactに触れ続けてもらいたい。
- 今回はReactでやりましたが誰かが得意な分野を担当して定期的に勉強会を開く文化ができれたら様々な知見も貯められるのでやっていきたい。

このようにカウンターワークスではプロダクト開発に対してOne Teamになる意識で誰か1人にタスクが集中してしまう状況をなくすべく勉強会を実施したり、リモート期間中はslack callを繋いだ状態にして新卒で入社してくれた人たちが質問をしやすい状況を作るなど働きやすい環境を試行錯誤しながら作っているところです！

カウンターワークスではReactやRails、Laravelでゴリゴリ開発をしたいといった意思のあるエンジニアを絶賛募集中です！
https://www.counterworks.jp/recruit/