【Nuxt3】全6回の社内勉強会を行いました
こちらは、Mavs Advent Calendar2023の5日目の記事です！🦀
ハコザキです
今年の7月から11月にかけて、
社内のエンジニアの方々を対象にNuxt3の勉強会を行いました！
どのようにして勉強会を行ったのか、実際の勉強会の様子などご紹介したいと思います！
はじめに
この記事では勉強会の概要や所感について紹介している記事になります。
具体的なNuxt3の実装についてやヘッドレスCMSについては紹介していません..！
組織内で勉強会をやってみたいけど、どうやればいいのか困ってる人 や
マブスの勉強会について興味がある人 はぜひ最後まで読んでいただければと思います！！
開催概要
勉強会のテーマ決め
普段からブログを見ていただいた方はわかると思いますが、
弊社はVue/Nuxtを主要な技術として日々業務を行っております。
https://ma-vericks.com/service/websystem/
とはいったものの、Nuxt3に関しては自分も含め経験が少なく、
会社全体としての知見はまだまだ足りていませんでした。
また、社内でもヘッドレスCMSを使ったことのあるエンジニアは全体の半数ほどという状況でした。
そのような背景から、
ヘッドレスCMSを使ったJamstackなWebサイトをNuxt3で構築し、
実際にホスティングプロバイダと連携してデプロイするまでをハンズオン形式で行う
を勉強会のテーマとしました。
開催期間
2023/07 ~ 2023/11で大体月に1回程度、全6回
業務時間終了後に30分~45分間ほど、お時間を頂いて開催しました！
日程については、遅くても開催の1週間ほど前に全体に周知していました。
資料作成を半強制的なものにすることができ、定期的に開催することができました。
また、当たり前ですが業務時間外の時間に参加してもらっているため、
1回30分ほどで終わらせるようにしました。
（1~2時間は主催するのも参加するのも疲れてしまいます..）
資料について
勉強会の資料は、業務時間外やお昼休みのうちにコツコツ作成していました。
資料はすべてNotionで管理しました。
各回の概要はこのようなページを作成し、
管理しやすいよういくつかのセクションに分けました。
Nuxt3の他にもAWSのLambdaなど各種サービスやアクセシビリティについてなど、
マーベリックスでは大体月に1,2回ほど様々な勉強会が行われています。
勉強会の資料はいつでも見返せるようになっているため、
当日参加できなかった人や今後入社される方でも自己学習できるようになっています。
サポート体制について
ソースコードについてはGitHubで管理しました。
前回動かなくて参加できない..で悩んでる人を減らすこと目的とし、
回ごとにブランチを作成し、動作を保証するコードをpushしました。
このchapterブランチは意外と活用いただいていたみたいで、
やっておいてよかったな..!と思いました。
また、勉強会中にでた質問に対して、基本的にはその場で答えるようにしていましたが、
正確な回答ができない場合は、次回までに回答をまとめておくなどもしていました。
勉強会の内容
具体的にどのような勉強会を行ったのか、アウトライン形式でご紹介します！！
第1回：
- 勉強会の成果物について
- Nuxt3になって何が変わったのか
- Nuxt3環境構築（インストールまで）
第2回：
- 環境構築（ESLint, Prettier）
- UIライブラリーの導入（Tailwind CSS, DaisyUI）
- 静的ページの表示
- Nuxt3のレンダリングモードについて
第3回：
- Tailwind CSSについて
- ヘッダーの実装
- Aboutページの実装
- TOPページの実装
- Newtについて
第4回：
- Newt（ヘッドレスCMS）の構築
- Newt + Nuxt3の連携
- 記事一覧の実装
第5回：
- 記事詳細の実装
- お問い合わせページの仮実装
- Vercelへのデプロイ作業
第6回：
- お問い合わせフォームの実装
- より充実したサイトにするための実装アイデアなど紹介
勉強会の様子
勉強会の様子は大野さんが写真を撮ってくれていました！ご紹介します！！
資料を事前共有し、サクサク進められる人は自分のペースで、
補足や大事なことを話しつつハンズオン形式でも進める形で行いました。
おわり
業務優先のため、参加は任意としていましたが、
多くの方に参加いただき嬉しかったです。
WEBエンジニアにおいて、 身につけた知識のアウトプットは、
以下のように下にいけばいくほどハードルが高いと思っています。
- 社内チャットへの投稿
- XなどSNSへの投稿
- 技術ブログの投稿
- 社内勉強会・社内LT会の開催
- 社外イベントでの発表・登壇
今回社内勉強会の開催を行うことで、
自分としてもすごく勉強になったためこういった活動は定期的に行っていきたいなと思いました！
