こんにちは、AQフロントエンドエンジニア飲み会担当のハナペイです！

AQでは日夜さまざまな勉強会が開催されているのですが、

そんな勉強会の中で、今回は「Vue.js」についての勉強会をご紹介します！

Vue.jsとは

フロントエンドに馴染みのない方でもJavaScriptはなんとなく聞いたことがある方が多いと思います。

Vue.jsはそんなJavaScriptのプログレッシブフレームワークです。
UI構築などのフロントエンドが担当するコードをコンポーネント思考を元に設計することができ、ReactやAngularと並んで2018年現在もっとも勢いがあるJSフレームワークの内の一つです。

Vue.jsは公式サイトが非常に丁寧に作られており、日本語化もされているので詳しくは公式サイトを参照ください！
Vue.js

勉強会スタート！！

今回勉強会を開催してくれたのは、17年新卒のフロントエンドエンジニア かめぽんこと、石亀くんです。

若くしてVue.jsの知見が深いかめぽんがVue.jsについてを分かりやすく解説してくれました。
（実はQiitaでVue.jsに関する記事を書いてくれています〜）
https://qiita.com/isihigameKoudai/items/eee3eb6a435675fdfd73

タイトルは、

「Vueで始める脱jQueryサイトコーディング」

jQueryで苦労した経験がある人には非常に刺さるタイトルです！

こんなことを解説してくれました

• 環境周りの話
• 最近追っているVue周りのこと
• jQueryで辛いこと、Vueにすると良いこと
• 実例紹介

環境周りの話

冒頭は、Vue.jsについてあまり知らない人にも分かるようにVue.jsについての説明と環境構築について説明してくれました！
フレームワーク関連で躓きやすい環境構築についての説明が非常に分かりやすかったです。

最近追っているVue周りのこと

Vue.js周りとしてSSGとNuxt.jsについて解説してもらいました。

Nuxt.jsは環境構築が超簡単に出来るということで実際にコードを書いて環境を構築してくれたのですが、数行のコードで環境が出来てしまい、Nuxt.jsの凄さを身を以て体感することが出来ました！

jQueryで辛いこと、Vueにすると良いこと

ここが今回の勉強会のメインとも言えるセクションでした。

jQueryは使い勝手の良いJavaScriptライブラリとして非常に多くの案件で使われています。
とはいえ、DOM構造に依存するjQueryは冗長な書き方になってしまったりコードとしての見通しが悪くなってしまうことがあります。
そんなjQueryが持つ辛い部分をVue.jsを使うといかに解消することが出来るかを実演を交えながら解説してくれました！

実例紹介

最後はかめぽんが作成しているサイトを参考に、より実践的なVue.jsの使い方や考え方を解説してくれました。

ここに注目！

今回は他社の方にも参加して頂き、会社を超えた交流を持つことが出来ました！

発表の後は質疑応答の時間を用意して、一方通行ではなく双方向的な勉強会を行うことが出来ました！

具体的なコードを参考にしながらの勉強会だったので非常に分かりやすく、今後はハンズオン形式の勉強会も計画しています！

終わりに

エンジニアの勉強会以外にもロジカルシンギングやRPAについての勉強会など多種多様で、普段自分が触れることがない領域にについてもフランクに参加することが出来ます。

自分1人だとなかなか勉強のモチベーションが上がらないのですが、こうして皆んなで集まって集中した時間を過ごすことで、モチベーションも高く保てるかなと思います！

社内外問わず勉強会・もくもく会などでどんどん交流する文化を促進しているので、一緒に盛り上げていきましょう！
（一部社内限定の勉強会もあります。）