エンジニア達の「完全に理解した」Talk #42
1.3K Views
June 29, 23
スライド概要
MDN Web Docs の翻訳を完全に理解した
MDN Web Docs 翻訳を解説します。
フリーランスプログラマです。 Angular, CHIRIMEN Open Hardware, MDN Web Doc 推しの人です。
関連スライド
各ページのテキスト
MDN Web Docs の翻訳を 完全に理解した エンジニア達の「完全に理解した」Talk #42
自己紹介 akihiko.KIgure a.k.a グレさん 日比谷とグンマー帝国の２拠点でフロントエンド開発をしています。
質問 Web の技術のドキュメントはどこを見ていますか？
今日お話する事 ● MDN Web Docs の簡単な歴史 ● 翻訳で、皆さんが気になる事 ● MDN Web Docs の翻訳フロー
What is MDN Web Docs?
MDN Web Docsは、ウェブ標準 及びMozillaプロジェクトの開発文書のための Mozillaの公式ウェブサイトです。 2017年 MDN Web DocsはGoogle、サムスン電子、Microsoft及びMozillaのウェブ技術の統 一文書となった[8][9]。 MicrosoftはMSDNからMDNへのページのリダイレクトを開始した[10]。 Wiki 出典
- https://ja.wikipedia.org/wiki/ウェブ標準
- https://ja.wikipedia.org/wiki/Mozilla
- https://ja.wikipedia.org/wiki/ウェブサイト
- https://ja.wikipedia.org/wiki/Google
- https://ja.wikipedia.org/wiki/サムスン電子
- https://ja.wikipedia.org/wiki/Microsoft
- https://ja.wikipedia.org/wiki/MDN_Web_Docs
- https://ja.wikipedia.org/wiki/MSDN
ウェブ技術の統一文書となった ウェブ技術の統一文書となった ウェブ技術の統一文書となった
大事なことなので、３回言いました
MDN のあゆみ（インターネット老人会的知識） ● Netscape DevEdge ● MediaWiki 最初の Wiki エンジン ● DekiWiki ● 2 つ目の Wiki エンジン ● Kuma ● 3 つ目の Wiki エンジン ● Yari ● 現在のMDN Webドキュメントプラットフォーム ● Wiki ベースの編集からGithub, MarkDown 形式編集へ変更
翻訳にあたり、みんなが（多分）心配している事 ● 英文が読めない（訳せない） ● 英検？級の語学力が必要？ ● TOEICの語学力が必要？
翻訳にあたり、みんなが（多分）心配している事 ● 英文が読めない（訳せない） => とりあえず気にしない ● 英検？級の語学力が必要？ => あれば越した事はない ● TOEICの語学力が必要？ => あれば越した事はない
必須 日本語の文章を正しく書ける事
Q ぢゃぁ〜どうすれば良いの？ （意訳：翻訳出来るの？）
A 文明の利器（翻訳ソフト）を使おう！
注意 著作権に抵触しない様に使いましょう
Google 翻訳 https://translate.google.com/ DeepL翻訳ツール https://www.deepl.com/ja/translator
本題 翻訳はどうやって始めるの？
Mozilla Japan コミュニティに参加しよう！ （推奨）
翻訳ガイドを見てみよう！（必須）
翻訳までの流れ（準備編） ・Mozilla Japan コミュニティに参加（推奨） ・月１回の翻訳イベントに参加（推奨） ・翻訳ガイド査読（必須） ・Github アカウント作成（必須、既に作成済み人は不要） ・翻訳環境を準備（必須） ・Node.js, Yarn のインストール
翻訳に関係するリポジトリ① https://github.com/mozilla-japan/translation
翻訳に関係するリポジトリ② https://github.com/mdn/content このリポジトリは、フォークします。
翻訳に関係するリポジトリ③ https://github.com/mdn/translated-content このリポジトリは、フォークします。
翻訳作業の流れ 1. 記事を選定する 2. 作業を宣言する 3. fork リポジトリを用意する 4. fork リポジトリを clone する 5. 日本語記事ページを新規作成する 6. 日本語記事ページを編集する 7. Pull Request を作成する
1. 記事を選定する 翻訳作業を始める初心者の方にお勧めなのは、記事の文章量 が比較的少ない「用語集」ページです。
用語を訳すだけでも翻訳です！
2. 作業を宣言する ・翻訳コミュニティでは、日本語翻訳作業用の GitHub リポジトリを用意しています。 ・翻訳作業に関するタスクは、このリポジトリの Issues に記録しています。 ・翻訳作業の対象ページが決まったら、作業内容を 書いた Issue を作成してください。
2. 作業を宣言する ・https://github.com/mozilla-japan/translation/issues/
宣言例
3. fork リポジトリを用意する① https://github.com/mdn/content このリポジトリは、フォークします。
3. fork リポジトリを用意する② https://github.com/mdn/translated-content このリポジトリは、フォークします。
4. fork リポジトリを clone する
content をローカル起動しておく
5. 日本語記事ページを新規作成する 例： https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Introducing_complete_toolchain 原文のディレクトリ位置 ~/work/mdn/content /files/en-us/learn/tools_and_testing/understanding_client-side_tools/introducing_complete_toolchain 翻訳のディレクトリ位置 ~/work/mdn/translated-content/files/en-us/learn/tools_and_testing/ 配下 ※翻訳されていない場合、フォルダとファイルは存在しません
mdn/content 内にある原文（英）をフォルダごと mdn/translated-content の 同じディレクトリ位置へコピー
原文が追加された時
6. 日本語記事ページを編集する メタデータ部分（Front-matter）の編集 日本語版では、title と slug 以外を削除し、l10n を追加します。 ・tags, translation_of, browser-compat, spec-urls などは全て削除してください。 ・l10n は「エル１０エヌ」です。アイではありません。 ・localization：エルとエヌの間に１０文字あるから、ｌ１０ｎと表記します。
sourceCommit のハッシュ値は、編集作業時点の content リポジトリの当該記事ページのファイル（英語版）の 最新コミットハッシュ値を記述します。 下図の様にリポジトリのリンクから取得することも可能です。
翻訳をしてみる 原文 To solidify what we‘ve learnt so far by working through a complete toolchain case study. Google 翻訳 完全なツールチェーンのケーススタディに取り組むことで、これまでに学んだことを定着させるため。 DeepL 翻訳 完全なツールチェーンのケーススタディを通して、これまで学んだことを固める。 修正文章 ツールチェーンのケーススタディの演習を完了して、これまでに学んだことを確実に理解します。
翻訳作業イメージ（ブラウザ確認） 原文（英語） 翻訳文（日本語）
翻訳作業イメージ（エディタ） ※画像は、VS Code を使用しています（お好みのエディタで作業して下さい）
コミット単位はセクション毎に
7. Pull Request を作成する 例
よくある指摘例
Pull Request 例
マージされると・・・？！全世界に公開されます！
皆さんも翻訳にチャレンジしてみませんか？（提案
次回は、【第59回】2023年7月22日(土)に開催します！ ご興味のある方、お待ち申し上げます！（勧誘
mozilla-japan/translation slack mdn/content twitter mdn/translated-content Discord
まとめ ほんやくできるよ、にんげんだもの ぐれを
ご静聴ありがとうございました！