エンジニアの勉強会へ潜入してみた〜Nuxt.js編〜

こんにちは！人事の森です。

今回は弊社のお取引先であるマーベリックス様が、弊社のためにNuxt.jsの勉強会を開いてくださるとのことでしたので、私も潜入させていただきました。

というわけで、今回はマーベリックス様主催の勉強会の様子をお届けします！

▽マーベリックス様について

プログラミング勉強会〜第1回〜（全4回を予定）

第1回目のアジェンダ
・会社紹介/スピーカー紹介
・Vue.js / NuxtJSの概要説明
・ハンズオン
・質疑応答

ハンズオンに備えて以下の事前準備を行った上で参加をします！

・Node、Yarnの環境構築
- Volta設定 → Nodeインストール
- Yarnのインストール
・GitHubアカウントの用意

登壇者のご紹介

ー 株式会社マーベリックス

CEO / Engineer
竹部 裕介 様

Manager / Backend Engineer
大野 晋太郎 様

Frontend Engineer
箱崎 一輝 様

◎勉強会の目的

弊社では定期的に社内勉強会を実施しています。

「IT/Webの力で生活をより豊かにしたり、驚きを与えられるようなものを生み出したい」「お客様のご期待に応えられるクオリティの高いサービスを提供していきたい」そんな思いからこれまでWebサイト制作のみならずシステムやアプリ開発、AI/VR/IoTなど様々なチャレンジを続けてきました。

今後も組織として様々なことへチャレンジし一つ一つ成功を収めていくためには、弊社に多く在籍する実務未経験スタートのスタッフを教育する目的はもちろん、ベテランスタッフについても新たな気づきを与える場を企業として作っていくことが重要だと考えているため、今回は弊社が課題と感じている新しい技術の習得を目指す場を作るという目的で実施をしていただきました。

◎全体の概要

株式会社マーベリックスさんがNuxt.jsで実装された身近なWebサイトの事例紹介を交えながら、Nuxt.jsを使う目的やVue.jsとNuxt.jsの違い、Nuxt.jsの動かし方などを順を追って解説してくださる形式。約1時間資料を展開しながら講義を実施してくださいました。（ちなみにど素人の私にも分かりやすかった）

その後は、休憩を挟んでいざハンズオンで実際にコードを書いてみます。

単に説明を聞いて終わりではなく、直近学んで頭に入れたことを実際にコーディングをする勉強会になっているため、腹落ちが違う！と参加者。説明とハンズオンでの実習を取り組み本日は終了！

■2回目以降の勉強会の流れ

2回目：ヘッダーの作成、Vueの基本構文について（v-if,dataなど）
3回目：Vue/Nuxtのライフサイクルについて、axiosでのAPI通信
4回目：コンポーネント化について（propsなど）、generateコマンドで静的ファイル生成（payloadなど）GitHubへソースpush→Netlifyへの自動デプロイの流れについて

今回はNuxt.jsについてでしたが、今後もメンバーの意見を反映しながらもトレンドに合わせてテーマを選定し、メンバーそれぞれが成長意欲を高めるきっかけとなるような勉強会をこれからも実施していきたいですね。

わたしもまた機会があればぜひ参加をしてみようと思います！