
2021年の取り組みと次の2022年に向けて
こんにちは!
Vue.js 日本ユーザーグループ代表の kazupon です。
2020年コロナ禍な状況になってから、我々 Vue.js 日本ユーザーグループを含めた技術コミュニティの活動は、現在オンラインをベースに活動しています。
Vue.js 日本ユーザーグループは昨年 2021 年、Vue Fes Japan というオフラインでのカンファレンス活動出来ない代わり、スタッフ内で分科会をベースに、以下の班(グループ)に分かれて活動してきました。
イベント班
ワークショップ班
翻訳班
本記事では、2021年 Vue.js 日本ユーザーグループの取り組みについて、各班の活動内容について紹介して、この記事の最後に、本年度 2022 年について紹介します。
イベント班
この班の目的
イベント班は Vue.js コミュニティ向けにイベントを企画し運営することを目的に活動する班です。
活動内容
2020年、オンラインで 3 イベント開催に続き、昨年2021年も Zoom や YouTube などのオンラインリソースを使って、以下の 3 イベントを開催しました。
1. 【共同開催】LINE Developer Meetup #72 - Vue.js
イベントページ (connpass):
イベント配信 (YouTube):
2. Vue.js v-tokyo オンライン Meetup#13
イベントページ (connpass):
イベント配信 (YouTube):
3. Vue.js v-tokyo オンライン Meetup#14
イベントページ (connpass):
イベント配信 (YouTube):
今年のオンラインイベントも、オンラインの状況において、Vue.jsコミュニティのみなさんが楽しめるようなイベントを企画し用意しました。
ちょうど今年にリリースされた Vite 、そして Webフロントエンドのアプリケーション開発で度々話題になる状態管理をメインテーマに開催しました。
これらのイベントでのメインセッションは英語でした。事前にトークスクリプトをスピーカーの方からいただいて翻訳することで、イベントの当日に英語が苦手な方にも理解できるよう努めました。以下に翻訳したトークスクリプトを公開しています。
v-tokyo#13 (Vite):
v-tokyo#14 (状態管理):
また、Vue.js 日本ユーザーグループ単体のみではなく、LINE のみなさまのコミュニティといっしょに初の共同でオンラインイベントも開催しました。
LINE のみなさまの協力により韓国のVue.jsコミュニティといっしょに開催できたのは大変エキサイティングでした。海外のコミュニティが一体になってオンラインイベントを楽しめることができるのは貴重です。このイベントの実現に向けて動いて頂いた LINE の DevRel の方には大変ありがたく思います。この場をお借りして、感謝させていただきます。
今回このイベントに携わった LINE のみなさま、ありがとうございました!
ワークショップ班
この班の目的
ワークショップ班はこれから Vue を学ぶ方に向けて入門を支援するために活動する班です。
学習リソースが揃っているのになぜ?
以下に掲載している Tweet は、jQuery の使用状況について Tweet しているものです。
I reported this before, but now it's a bit clearer: jQuery did indeed peak in usage halfway through 2020, and is only *now* finally in decline.
— Mike Monster Mash Sherov (he/him) (@mikesherov) September 30, 2021
What amazing impact... peaking at *80%* penetration of the top 100K websites!
We all owe @jeresig a big debt. Write less, do more! pic.twitter.com/Ky0xoaliqO
昨年2021 年ついに jQuery の使用状況がピークを過ぎたとのことですが、これについては自分も肌感で感じていて、Vue をまだ使っていない方は日本において多数いると感じています。
そして、昨今 Webフロントエンドの技術動向は落ち着いてきて、ハイプ・サイクル的には、今後啓発、安定期に入っていくものと感じています。
Vue.js 日本ユーザーグループの活動目的の1つとして、日本における Vue 普及があります。Vue 公式ドキュメントは日本語に翻訳されていて、そして入門向けの商業・同人書籍が多数あります。
ただ、ワークショップについては、日本では海外ほどありません。こうした背景から、将来 Vue Fes Japan などのカンファレンスでの開催を見据えて、昨年2021 年から活動を始めました。
活動内容
昨年2021年はワークショップ班の立ち上げに伴い、ワークショップコンテンツの開発を開始しました。2021年10月にはベータ版のコンテンツが完成しクローズドベータの形で実際にオンラインワークショップも実施しました。2022年春頃よりオープンなワークショップを開催予定で connpass で開催をアナウンスしていきます。
コンテンツは OSS として開発し、できるだけ Vue.js とエコシステムの利用状況やトレンドに合わせるようにしていますが、初学者の方が Vue の世界に入りやすいようにできるだけ幅広く浸透している使い方やライブラリの利用を優先しています。実際の開発現場で利用が進んでいる Composition API や TypeScript そして Vite 等はまだコンテンツには取り入れていませんが、利用状況をみて徐々に取り込んでいきたいと思っています。
ハンズオンコンテンツ公開サイト:
ハンズオン用のコンテンツは VuePress で生成し、GitHub Pages 上で公開しています。コンテンツの追加・更新がすぐに反映するように、ハンズオン資料のソースコードが更新されると、リアルタイムでコンテンツも更新されるように GitHub Actions で CI/CD を組んでいます。
ハンズオンコンテンツソースコード:
コンテンツの開発は基本的に GitHub 上で行っています。サンプルコードとガイド文章はモノリポでソース管理しており、Issue や PR を通じてコンテンツの更新を実施しています。また、ガイド文章の体裁をユーザーグループ全体で統一するために、翻訳班の方で作成してくれた textlint のプリセットを使って文章を GitHub Actions でチェックするようにしています。
翻訳班
この班の目的
翻訳班は、Vue や Nuxt といった Vue とそれを取り巻くエコシステムの英語で書かれた公式ドキュメントを日本語に翻訳する班です。
Vite が新しく追加!
Vue の作者 Evan You 氏が新しく次世代フロントエンド開発ツールとして Vite を公式にリリースしました。それに伴い、これまで翻訳活動としてやってきた Vue そして Nuxt の公式ドキュメントに加えて、今年からは Vite の公式ドキュメントも翻訳しています。
活動内容
2021年から翻訳ドキュメントは vuejs.org 配下ではなく、ユーザグループ運営のもとで関わりながら、日本のコミュニティの方々が翻訳、メンテナンスしていく形をとることにしました。
そのため、翻訳そのものと一緒に、コミュニティで自発的にメンテナンスをしていくための仕組みづくりをしています。
Vue 3 公式日本語ドキュメント
2020年12月に公開してから、ガイドのほかにも、API リファレンス、スタイルガイド、クックブックなど、翻訳の対象を広げてドキュメントのほとんどを日本語でカバーしてきました。
また、英語ドキュメントでは活発に更新がされているため、活動開始時では 200 コミットくらいの差が出ている状態でしたが、更新差分の追加翻訳をしながら、後述する Ryu-cho の開発をして差分に徐々に追いつくことができました。
今では Slack の #translation コミュニティの協力のおかげで、最新版の 3.2 にも対応した鮮度の高いドキュメントの更新を保つことができています。
翻訳に協力していただいたメンバーのみなさま、ありがとうございました!
Ryu-Cho の開発
これはオリジナルの英語ドキュメントとの差分を検知する仕組みで、以前は che-tsumi という仕組みを入れていました。
前提として Vue のドキュメントはマークダウンで記述されており、オリジナルのファイルと1行1行対応させるというフォーマットで翻訳をしています。
Ryu-cho では、これをオリジナルのリポジトリから git cherry-pick して、差分があれば GitHub Issue を作成するという仕組みです。che-tsumi では、定期実行するためのホスティングが必要でしたが、これを GitHub Actions に対応して、より他のコミュニティでの翻訳活動にも展開しやすいものへアップグレードしました。
textlint-rule-preset-vuejs-jp の作成
Vue に Nuxt、2021年には Vue v3 に Vite と翻訳対象が増え、これからも多くの人が翻訳に参加されるため、一定の記述ルールを定義し直す必要がありました。
textlint は以前から導入していましたが、各ドキュメントで細かなルールの違いが出てきていたため、改めてルールのプリセットを作成しました。
Nuxt の公式ドキュメントサイトのリニューアルお手伝い
昨年初の Nuxt のカンファレンスイベントが開催され、その時に Nuxt の公式サイトがリニューアルされました。
この時、既存の Nuxt2 の日本語ドキュメントを、 Docus で構築された新しいドキュメントシステムへのマイグレーションをお手伝いしました。
2022年は何をしていくのか
ここまで、Vue.js 日本ユーザーグループの2021年度の活動状況について紹介してきました。
ここまで、読んでいただきありがとうございました!
2022年の Vue.js 日本ユーザーグループの活動ですが、コロナ禍前に開催していた Vue Fes Japan のようなカンファレンスを開催に向けて、ついに活動を再開します!
ここまで紹介した活動については、引き続き活動していきますが、オンラインカンファレンス開催に向けた活動にフォーカスする次第です。
これまでのカンファレンスは、Vue や Nuxt といった Vue エコシステムベースでしたが、2021 年、Evan You 氏によって Vite がリリースされました。それに伴い、カンファレンスは、Vite も加えた形での開催を計画しています。それに伴い、カンファレンスのコンテンツ内容は裾野が広がることが予想されます。
2022年1月に、カンファレンス開催に向けた Vue.js 日本ユーザーグループとして2022年活動するスタッフを募集を開始します。もし、活動に興味がある方がおりましたら、ぜひ、以下のリンク先のフォームでご登録ください!
2022年もオンラインベースで活動になりますので、日本地域問わず全国から活動できます。
私達といっしょに活動して楽しいカンファレンスを開催していきましょう
お待ちしております!
2021年活動していただいたスタッフへの謝辞
最後に、この場をお借りして、活動に関わって頂いた Vue.js 日本ユーザーグループのスタッフのみなさんにお礼を申し上げます。
@nal さん
@448jp さん
@kiaking さん
@naokie さん
@tutti さん
@massy さん
@treby さん
@Yuuki Ishibashi さん
@happylifetaka さん
@53 さん
@shohei さん
@robjam さん
@egurinko さん
@watasan さん
@rry さん
@nicedaichi3 さん
@rider さん
@unotovivi さん
@seiyamiyaoka さん
@lilycoco さん
2021年、ありがとうございました!