突然ですがReact Hooks APIをゲームを作りながら学べる教材をTechpitさんより
「スネークゲーム🐍を作って学ぶ React Hooks API での状態管理」
をリリースさせて頂きました。
スネークゲーム 🐍 を作って学ぶ React Hooks API での状態管理
Techpitさんはサービスを作りながら学べるプログラミング学習教材をオンラインで販売している会社さんです。
この度、4月末頃から自身が運営しているブログ経由で連絡を頂き執筆させて頂けることとなりました。
他のフリーランスの仕事や学校の宿題などの合間を見ながらせこせこと作業し11月10日（火）に無事リリースができました。
教材執筆のきっかけ
執筆のきっかけはTechpitさん側から声かけを頂いたところが一番大きかったのですが、普段からMENTAなどのサービスでプログラミングについて教えていたりするところもあるので常日頃から自分の知識や経験を提供することで価値を提供できる機会があれば進んで参加したいと思っていたのでお話を頂いた時に「面白そう」ということで執筆を開始させて頂きました。
[ HTML/CSS, JavaScript, React, Redux ] フロントエンドエンジニアとして実務レベルの実力を身につけたい方をサポートします。 | MENTA
題材を「React Hooks API」「スネークゲーム」とさせて頂いたところについてはTechpitさんの担当者さんと相談しながら決めていったのですが、元ネタはこちらの記事で二年ほど前にReactの学習がてら面白そうだったのでスネークゲームを作って公開していました。
この記事の中にもあるようにちょうど海外のデベロッパーさんが実装しているのを見て面白そうで作って見たところ、自分でも実装していて案の定面白かったので記事にしてみたという流れです。
そこから月日がたちHooks APIも出始めてクラスコンポーネントで書かれたそのスネークゲームはすっかり古くなってしまい「そろそろアップデートしたいなぁ」とぼんやり考えていました。
そんなことを考えた矢先、教材執筆のお誘いがあったのでそこで「React Hooks API」と「スネークゲーム」というところが繋がり担当さんに提案をしてこれまでゲームのようなものを作った例がほとんどないということだったので作ると決めました。
教材を執筆してみて
教材はまだReactに追加されてから日の浅い（徐々に浸透していきてる感じもありますが）Hooks APIを解説するような教材になります。
下記のような懐かしのスネークゲームを作りながらHooks APIの使い方を学んでいきます。
一口にHooks APIといっても useState のようなステート（状態）を扱うフックから、useContextのようにステートをより広いスコープで扱うフックやuseEffectなどレンダリング間の副作用を扱うようなフックまで色々ありますが、この教材では
- useState
- useEffect
- useCallback
- useMemo
など普段よく使うフックを主に解説しています。
スネークがぬるぬる動いた瞬間の感動も捨てがたいものかとは思いますが、 それと同時にスネークを動かすにはl小刻みにステートを変化させて、再レンダリングを起こしということをやるのでReactを理解する上で重要なステートとレンダリングについて学べる教材になっているかと思います。
わかりづらい部分にはイラストも入れて説明を加えたり、なるべく読者の方が理解しやすいように作っているつもりです。購入者の方が実際にどういったフィードバックをくれるかはドキドキなのですが、幸い教材リリース後に Techpitさんの社内で「わかりやすい」という評価も頂けたよなのでひとまずホッとしています。
肝心の執筆についてですが、当初一二ヶ月で終わるだろうと完全に舐め切っていました。
チュートリアルのコードと記事の文章の整合性を保ちながら書き進めたり、複雑な概念をテキストで説明することやそれをイラストで図示してあげたりという作業が思いのほか発生して、かなり大変でした。
普段自分で技術に関する文章を書く際はブログの記事を書くことが多いので、始めた当初はそれとあまり遠からずで慣れたものかと思っていました。
が、普段書く文章はある程度事前知識をもった人を想定して書いていたので今回はある程度広い範囲のレベルの人をカバーしながら文章を書いていくというのに苦労しました。
ここまで、とつとつと苦労ばかり書いていますがこれは決してわるいことでなく勉強になったと思っています。普段自分の書いた文章を自分で校閲して公開することはあっても人にレビューされながら商品として作り上げるというなことはなかったので非常に良い経験になったかと思います。
今後のブログや教材執筆の時にも役立つ経験かと思ったので本当にやってよかったと思っています。
最後に
この記事はお知らせが主体なのであまり長く書くつもりもないので、ここらで終わりにしようかと思います。
初の教材執筆とリリースということと、教材執筆がなかなか歯応えがあったので今のところ達成感に浸っていますが、もうすでに5~10本ほど教材を購入頂いているようです。購入して頂いた方ありがとうございます。
もし、教材を無事終えましたら各種SNSやブログ、サイトのレビューなどで感想を頂けると嬉しいです。Techpitさんの教材はUdemyなどと違いテキストベースのチュートリアルなので、フィードバックを受けて教材をブラッシュアップできたりなどできるので感想頂けると嬉しいです。
最後にまた繰り返しにはなりますが、興味ある方は是非下記リンクから教材の詳細ご確認お願いします。
スネークゲーム 🐍 を作って学ぶ React Hooks API での状態管理
では。
