エンジニア達の「完全に理解した」Talk #42

1.3K Views

June 29, 23

スライド概要

MDN Web Docs の翻訳を完全に理解した
MDN Web Docs 翻訳を解説します。

profile-image

フリーランスプログラマです。 Angular, CHIRIMEN Open Hardware, MDN Web Doc 推しの人です。

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

MDN Web Docs の翻訳を 完全に理解した エンジニア達の「完全に理解した」Talk #42

2.

自己紹介 akihiko.KIgure a.k.a グレさん 日比谷とグンマー帝国の2拠点でフロントエンド開発をしています。

3.

質問 Web の技術のドキュメントはどこを見ていますか?

5.

今日お話する事 ● MDN Web Docs の簡単な歴史 ● 翻訳で、皆さんが気になる事 ● MDN Web Docs の翻訳フロー

6.

What is MDN Web Docs?

7.

MDN Web Docsは、ウェブ標準 及びMozillaプロジェクトの開発文書のための Mozillaの公式ウェブサイトです。 2017年 MDN Web DocsはGoogle、サムスン電子、Microsoft及びMozillaのウェブ技術の統 一文書となった[8][9]。 MicrosoftはMSDNからMDNへのページのリダイレクトを開始した[10]。 Wiki 出典

8.

ウェブ技術の統一文書となった ウェブ技術の統一文書となった ウェブ技術の統一文書となった

9.

大事なことなので、3回言いました

10.

MDN のあゆみ(インターネット老人会的知識) ● Netscape DevEdge ● MediaWiki 最初の Wiki エンジン ● DekiWiki ● 2 つ目の Wiki エンジン ● Kuma ● 3 つ目の Wiki エンジン ● Yari ● 現在のMDN Webドキュメントプラットフォーム ● Wiki ベースの編集からGithub, MarkDown 形式編集へ変更

11.

翻訳にあたり、みんなが(多分)心配している事 ● 英文が読めない(訳せない) ● 英検?級の語学力が必要? ● TOEICの語学力が必要?

12.

翻訳にあたり、みんなが(多分)心配している事 ● 英文が読めない(訳せない) => とりあえず気にしない ● 英検?級の語学力が必要? => あれば越した事はない ● TOEICの語学力が必要? => あれば越した事はない

13.

必須 日本語の文章を正しく書ける事

14.

Q ぢゃぁ〜どうすれば良いの? (意訳:翻訳出来るの?)

15.

A 文明の利器(翻訳ソフト)を使おう!

16.

注意 著作権に抵触しない様に使いましょう

17.

Google 翻訳 https://translate.google.com/ DeepL翻訳ツール https://www.deepl.com/ja/translator

18.

本題 翻訳はどうやって始めるの?

19.

Mozilla Japan コミュニティに参加しよう! (推奨)

20.

翻訳ガイドを見てみよう!(必須)

21.

翻訳までの流れ(準備編) ・Mozilla Japan コミュニティに参加(推奨) ・月1回の翻訳イベントに参加(推奨) ・翻訳ガイド査読(必須) ・Github アカウント作成(必須、既に作成済み人は不要) ・翻訳環境を準備(必須) ・Node.js, Yarn のインストール

22.

翻訳に関係するリポジトリ① https://github.com/mozilla-japan/translation

23.

翻訳に関係するリポジトリ② https://github.com/mdn/content このリポジトリは、フォークします。

24.

翻訳に関係するリポジトリ③ https://github.com/mdn/translated-content このリポジトリは、フォークします。

25.

翻訳作業の流れ 1. 記事を選定する 2. 作業を宣言する 3. fork リポジトリを用意する 4. fork リポジトリを clone する 5. 日本語記事ページを新規作成する 6. 日本語記事ページを編集する 7. Pull Request を作成する

26.

1. 記事を選定する 翻訳作業を始める初心者の方にお勧めなのは、記事の文章量 が比較的少ない「用語集」ページです。

27.

用語を訳すだけでも翻訳です!

28.

2. 作業を宣言する ・翻訳コミュニティでは、日本語翻訳作業用の GitHub リポジトリを用意しています。 ・翻訳作業に関するタスクは、このリポジトリの Issues に記録しています。 ・翻訳作業の対象ページが決まったら、作業内容を 書いた Issue を作成してください。

29.

2. 作業を宣言する ・https://github.com/mozilla-japan/translation/issues/

30.

宣言例

31.

3. fork リポジトリを用意する① https://github.com/mdn/content このリポジトリは、フォークします。

32.

3. fork リポジトリを用意する② https://github.com/mdn/translated-content このリポジトリは、フォークします。

33.

4. fork リポジトリを clone する

34.

content をローカル起動しておく

35.

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/ 配下 ※翻訳されていない場合、フォルダとファイルは存在しません

36.

mdn/content 内にある原文(英)をフォルダごと mdn/translated-content の 同じディレクトリ位置へコピー

37.

原文が追加された時

38.

6. 日本語記事ページを編集する メタデータ部分(Front-matter)の編集 日本語版では、title と slug 以外を削除し、l10n を追加します。 ・tags, translation_of, browser-compat, spec-urls などは全て削除してください。 ・l10n は「エル10エヌ」です。アイではありません。 ・localization:エルとエヌの間に10文字あるから、l10nと表記します。

39.

sourceCommit のハッシュ値は、編集作業時点の content リポジトリの当該記事ページのファイル(英語版)の 最新コミットハッシュ値を記述します。 下図の様にリポジトリのリンクから取得することも可能です。

40.

翻訳をしてみる 原文 To solidify what we‘ve learnt so far by working through a complete toolchain case study. Google 翻訳 完全なツールチェーンのケーススタディに取り組むことで、これまでに学んだことを定着させるため。 DeepL 翻訳 完全なツールチェーンのケーススタディを通して、これまで学んだことを固める。 修正文章 ツールチェーンのケーススタディの演習を完了して、これまでに学んだことを確実に理解します。

41.

翻訳作業イメージ(ブラウザ確認) 原文(英語) 翻訳文(日本語)

42.

翻訳作業イメージ(エディタ) ※画像は、VS Code を使用しています(お好みのエディタで作業して下さい)

43.

コミット単位はセクション毎に

44.

7. Pull Request を作成する 例

45.

よくある指摘例

46.

Pull Request 例

47.

マージされると・・・?!全世界に公開されます!

48.

皆さんも翻訳にチャレンジしてみませんか?(提案

49.

次回は、【第59回】2023年7月22日(土)に開催します! ご興味のある方、お待ち申し上げます!(勧誘

50.

mozilla-japan/translation slack mdn/content twitter mdn/translated-content Discord

51.

まとめ ほんやくできるよ、にんげんだもの ぐれを

52.

ご静聴ありがとうございました!