意外に簡単！ ドキュメント翻訳で始める OSS コントリビュート @ UV Study: Vue.js LT会

意外に簡単！ ドキュメント翻訳で始める OSS コントリビュート 2024.10.22 @ UV Study: Vue.js LT 会

初 LT！🥳

自己紹介 jay-es （じぇいえす） ● フロントエンドエンジニア ● Vue.js & Vite 日本語ドキュメントメンテナー ● Vue.js 日本ユーザーグループスタッフ

誕生日！🥳

コントリビュート略歴 ● 2018/11 Vuex ドキュメントの誤訳を修正（初めての OSS） ● Vue 3, Nuxt 2, Svelte のドキュメント翻訳 ● ライブラリーなどにも PR を送るように ● 2021/03 Vite 日本語ドキュメント → 2021/06 メンテナーに ● Solid ドキュメント全翻訳 ● 2022/01 Vue サイトリニューアル。 メンテナー + プロジェクトリード ● Vue 3 移行ガイド翻訳、React ドキュメントのタイポ修正など

ドキュメント翻訳は難しい？

よくある誤解 1 英語がペラペラじゃないといけないのでは...😥 私も英語は話せません...😵 中学〜高校程度の英文法が分かれば大丈夫！

よくある誤解 2 技術に精通していないといけないのでは...😰 正直､全部は理解できてない！󰷺 推測で翻訳している箇所もある...

ドキュメント翻訳のメリット

ドキュメント翻訳のメリット ● 日本語で PR を出せるのでハードルが低い ○ ● OSS に慣れることができ、ライブラリーにも気軽に PR 送れるようになる もし間違えていても大変なことにはならない ○ ライブラリーのバグとは違い、どこかのサービスに不具合が出たりしない ○ レビューがあるし、すり抜けたとしても誰かが気づいて直してくれる ● たくさんの人に見てもらえる満足感 ● 技術知識・英語力が向上する

ドキュメント更新手順の実例 Vue.js, Vite の場合

ドキュメント更新手順の実例 issues 一覧ページに行く 英語版の更新に合わせて issue が自動作成されている

ドキュメント更新手順の実例 issue 詳細ページに行く リンクをクリック

ドキュメント更新手順の実例 英語版の差分が表示される 差分をコピー

ドキュメント更新手順の実例 VS Code を開き、 該当箇所に貼り付け

ドキュメント更新手順の実例 Google 翻訳と DeepL に貼り付け 訳文で全容を把握

ドキュメント更新手順の実例 原文の上の行に貼り付け 内容に相違ないか確認 （特に技術用語など） textlint エラー修正 原文を消す

ドキュメント更新手順の実例 PR 作成 CI 完了後、 プレビューのリンクをクリック

ドキュメント更新手順の実例 プレビューの表示を確認

ドキュメント更新手順の実例 レビューして問題なければ マージして完了

ドキュメント更新手順の実例（番外編） 翻訳不要な場合も多い （手軽に草を生やすチャンス）

まとめ

まとめ ● ドキュメント翻訳は難しくない！ ○ 高度な英語力や技術力は必要ない ● OSS 貢献してみたい場合は、まずドキュメントがおすすめ！ ○ 日本語でやり取りできるので、コントリビュートに慣れるのに最適