P2Pブラウザ「Beaker」のドキュメント(ようこそ、初級編)を和訳してみた


Beakerは、https://beakerbrowser.com/ にて公開されているHypercoreと呼ばれるピアツーピアのプロトコルを用いたブラウザです。このHypercoreと同様のものとしてIPFS(Interplanetary File System) https://ipfs.io/ があります。


![beaker.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/e9822ead-8714-d664-9212-45691ba51819.png)


IPFSは、Brave Browserに組み込まれていてHypercoreと比較し知名度が高いと思われます。著者もIPFSの方を先に知っていました。会社勤めを辞めたおり、Hacker NewsにてこのBeakerを知り、IPFSと比較して日本語の記事がまるで検索されなかったので、暇つぶしも兼ねて https://beakerbrowser.com/ にて公開されている記事を和訳してみた次第です。

なお、
- 和訳は、[DeepL](https://www.deepl.com/) にて英語から日本語に訳し、日本語文章としておかしな部分が無いように調整した程度のものです。単語の統一性まで確認するほどの厳密な和訳作業はしていません。

- 以降の用いられる画像ファイルは、https://beakerbrowser.com/  にて公開されている画像ファイルと同一物です。

## 構成

ドキュメントの構成は、下記のとおりです。

- ようこそ
- 初級編
- [中級編](https://qiita.com/bitlonginthetooth/items/f90aef89592ce7491a6b)
- [上級編](https://qiita.com/bitlonginthetooth/items/1538d9f15f128fb88a44)
- [APIs](https://qiita.com/bitlonginthetooth/items/1768d06c40cbd95326a3)
- [開発者](https://qiita.com/bitlonginthetooth/items/66f1def43be47be22ea8)

ハイパードライブ用にMarkdown形式で一つのファイルとして作成済みですが、**今回は「ようこそ」「初級編」部分を**以下に掲載します。
「中級編」以降は別記事を参照ください。

---
# ようこそ

## Beakerをはじめよう

ようこそ! Beakerはウェブハッカーのためのピアツーピアブラウザです。たくさんのツールが含まれています。

- 即座にウェブサイトを作成
- 内蔵エディター
- ターミナル環境
- ピアツーピアWeb API
  などがあります。

このガイドでは、Beakerのアイデアやツールに親しんでいただきます。

---
## このピアツーピアって何？
BeakerはHypercore、略してHyperと呼ばれるピアツーピアのプロトコルを使用しています。
"ハイパードライブ "はウェブサイトのようなものです。
Webページや画像、メディア、ユーザーデータなどを保存しています。
ハイパードライブは、Beakerの多くの優れた機能を支えています。

「ハイパードライブ」とは、あなたのコンピューターがホストするフォルダーのことです。
ハイパードライブにはウェブページが保存され、閲覧や編集が可能です。
Beakerを使ってハイパードライブを作成し、共有ができます。詳しくはこちら。

ピアツーピアとは、あなたのデバイスから直接データをホストすることです。

ピアツーピアの楽しい特性の1つは、「共同ホスト」です。
これは、データを保存し、他のユーザーに帯域幅を提供することで、ハイパードライブのオンライン維持に貢献するものです。
ハイパードライブへアクセスしたときに一時的に発生しますが、気に入ったサイトでは恒久的にオンにできます。

他の人のハイパードライブを「ホスト」して、ハイパードライブのオンライン維持と帯域幅の提供を支援できます。詳しくはこちら。

---
## FAQ

### なぜBeakerは違うのですか？

BeakerはChromiumで作られているので、他のウェブブラウザとまったく同じように使えるはずです。
大きな違いは、Beakerがウェブサイトをホストできることです。


Webサイトのホスティングは、従来はクラウド上の専用コンピューターである「サーバ」で行われていました。サーバーを動かすにはいろいろなスキルが必要で、それを簡単にする素晴らしいサービスもありますが、私たちは何か新しいことに挑戦したいと思いました。誰でも自分のノートパソコンでウェブサイトをホストできたらどうだろう、と考えたのです。

私たちは、このようなセルフホスティングサイトを "ハイパードライブ "と呼んでいます。

"ハイパー "は魔法のようなものだからで、そして
ファイルの集合体だから "ドライブ"。
単なるハードドライブではなく、ハイパードライブなのです。

Beakerからハイパードライブを作成し、あなたのウェブサイトのHTMLを追加したら、ハイパードライブのリンクを他のBeakerユーザーと共有できます。まるでクラウド上でサーバを動かしているかのように、相手のコンピューターはあなたのコンピューターに直接接続されます。



### Beakerは他のブラウザより何が優れているのでしょうか？
Beakerはウェブサイトを奇妙なほど簡単に作ることができます。内蔵のエディター、ウェブサイトとフォルダーを同期させるツール、ウェブサイト内のファイルを読み書きするためのとても楽しいAPIを備えています。

もしあなたがデジタル教室の先生で、とくにウェブ開発を教えているのなら、Beakerは本当に便利です。生徒たちはGitやコマンドライン、その他サーバー管理の一部を学ぶ必要はありません。Beakerをダウンロードすれば、すぐにWebサイト構築の仕事に取りかかることができます。

開発チームも、サイトのプロトタイプを作るのにBeakerが便利だと思うかもしれません。プロトタイプをBeakerにロードして、hyper://リンクを社内で共有するだけです。もし誰かが変更したければ、そのサイトをフォークして、自分のバージョンを共有すればいいのです。

### Beakerは、サイトのホスティングから面倒な仕事を取り除いてくれるのです。

ピアツーピア」ブラウザは何を可能にするのか？
Beakerで採用したのは、「Peer to Peer Networking」と呼ばれる技術で、しばしば「P2P」と略されます。P2Pは何十年も前からあるものですが、いつもあまり使われていません。Beakerでは、P2Pの新たな利用シーンを発見しています。

P2Pの最大のメリットは、ホスティングが簡単にできることです。基本的にどんなデバイスでも、いつでもP2Pサイトのホスティングを開始できます。これは素晴らしいことです。

もう1つの利点は、P2Pによってプライベートな共有が可能になることです。ハイパードライブを作成し、そのリンクを共有すると、そのリンクを持つ人だけがサイトを見ることができます。ビジネスの知的財産や家族のアルバムなど、クラウドで共有したくないものを作っている場合は、P2Pがオススメです。

### 「非中央集権的なウェブ」というのはどういうものなのでしょうか。
基本的に「分散型ウェブ」または「dweb」は、企業によって完全にコントロールされないデジタルライフを送ることを意味します。非中央集権的な人たちは、独立して生活したいと考え、FacebookやGoogleがインターネットのすべてをコントロールしたときに何が起こるかを心配しているのです。

やや活動家的な雰囲気もありますが、私たちの雰囲気でもあります。なぜなら、ピアツーピアとは、ネットワークを運営する仲介者がいないということだからです。私たちは常に中央集権的なソフトウェアとピアツーピアのソフトウェアを組み合わせて使っていますが、それはそれでいいのです。心配なのは、中央集権型のソフトウェアしか選択肢がない場合です。



---

# 初級編
## 新しいハイパードライブの作成

ハイパードライブはいくつでも作成できます。各ハイパードライブは独自のURLを持ちます。URLを共有することで、他の人がハイパードライブへアクセスできるようになります。

ハイパードライブの作成者だけが、そのファイルを変更できます。訪問者はドライブを表示することしかできません（ただし、ハイパードライブをフォークして自分のコピーを作成することは可能です）

新しいハイパードライブを作成するには、ブラウザの右上にあるハンバーガー メニューをクリックします。

![open-browser-menu.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/a2788c00-2137-2dbf-fa0b-d2384a5c4c6d.png)


次に、"New Hyperdrive... "を選択します。

![new-hyperdrive.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/61ccb601-1112-ea4f-7bda-878c24d90a33.png)

タイトルと、オプションで説明文とタグを入力するよう促されます。これらはハイパードライブを識別するために使用されます。(タグは非公開ですが、タイトルと説明文は公開されます）。

![new-hyperdrive-prompt.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/7c811f67-38c5-a86a-7f48-f7ae1eefe933.png)


新しいハイパードライブに案内されますが、そこは（ほとんど）空っぽです。

![fresh-hyperdrive.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/fe009a86-5e3b-c129-38c8-64d4e677048c.png)

これでハイパードライブが編集できるようになりました。以下のプロンプトをクリックすると、新しいindex.md（Markdown用）またはindex.html（HTML用）を作成できます。

次に、エディターを使用してハイパードライブを開発します。

---
## ドライブのタイトルやサムネイルを変更する

すべてのハイパードライブには、タイトル、説明、サムネイルがあります。

これらを変更するには、「Drive Properties」ダイアログを開き、変更を加えます。

![drive-properties-dialog.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/b1d022e8-581b-4ee0-94fd-e85c0fbfb4c4.png)


このダイアログには、複数の方法でアクセスできます。

### サイト情報ボタンから

ドライブにアクセスし、［Site Info］ボタン（アドレスバーの左側にある青いボタン）をクリックします。その後、「Tools」をクリックし、「Drive Properties」を選択します。

![drive-properties-in-siteinfo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/ffa613e8-3e9e-98ac-24e4-04b37ee8cb09.png)


### "マイライブラリー"から

新しいタブを開き、右上にある「My Library」のリンクを探します。「Hyperdrives」セクションで、ターゲットドライブを右クリックし、「Drive Properties」を選択します。

![drive-properties-in-my-drives.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/9a82681c-e841-072b-9030-851f77f42f3f.png)


---
## エディターの使用
内蔵のエディターは、ハイパードライブのソースコードを素早く表示・編集します。


エディターを開くには

- ページ上で右クリックし、［Edit Source］を選択するか、または
- Cmd+B (macOS) または  Ctrl+B (Windows / Linux) を押してください。

### ファイルの保存

作業内容を保存するには、エディターにフォーカスがある状態で「Save」ボタンを押すか、Cmd+S (macOS) または  Ctrl+S (Windows / Linux) を押してください。ページは自動的に更新されます。

![editor-save.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/b72e801b-6eeb-ddf7-f765-2fadb8cc0411.png)

### ハイパードライブ内のファイル移動

現在のハイパードライブのファイル一覧を表示するには、左上の省略記号アイコンをクリックします。

![editor-list-files.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/7538971b-a33a-9834-78c9-476ee8b42a02.png)


---

## ファイルやフォルダーの作成

### エディターで

ハイパードライブにアクセスし、エディターを開きます。次に、省略記号のアイコンをクリックして、ファイルリストを展開します。

![editor-list-files.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/707fd1da-e60f-4b61-d259-c81fe393260d.png)


ファイル一覧で右クリックし（ただし、ファイル上ではありません）、「New file」または「New folder」を選択します。

![editor-new-file-folder.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/bdfe8ab4-7d8e-80e2-7f9d-70f670f9b300.png)


ファイルまたはフォルダーの名前を入力する画面が表示されます。名前を選択すると、ファイル/フォルダーがリストに表示されます。

### ファイルエクスプローラーで
ハイパードライブにアクセスし、右クリックで「Explore Files」を選択して、ファイルエクスプローラーを開きます。

![open-files-explorer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/5dd41e3e-43c8-d70b-08af-e0a53e1428e2.png)


ファイル一覧で右クリックし（ただし、ファイル上ではありません）、「New file」または「New folder」を選択します。

![files-explorer-new-file-folder.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/d961aef4-e762-2894-9951-8ef3420295dc.png)


ファイルまたはフォルダーの名前を入力する画面が表示されます。名前を選択すると、ファイル/フォルダーがリストに表示されます。


---
## ファイルのインポートとエクスポート

### エディターで

ハイパードライブにアクセスし、エディターを開きます。次に、省略記号のアイコンをクリックして、ファイルリストを展開します。

![editor-list-files.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/57dcf464-5fdc-7ceb-b30b-b4f7ebea3c0c.png)

ファイル一覧で右クリックし（ただし、ファイル上ではありません）、ファイルやフォルダーをインポートする場合は「Import file(s)」または「Import folder(s)」、ドライブ内のすべてのファイルをエクスポートする場合は「Export files」を選択します。

![files-explorer-import-files.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/38abc337-62f6-2014-42a8-b5445e05e397.png)


ファイル上で右クリックし、「Export.」を選択すると、個々のファイルやフォルダーをエクスポートできます。

---
## ハイパードライブの共有
ハイパードライブにはそれぞれ固有のURLがあります。このURLを共有することで、他の人がそのハイパードライブへアクセスできるようになります。

アドレスバーの左側にあるサイト情報ボタンをクリックして、「Copy URL」を選択すると、URLをコピーできます。
![copy-url.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/76f81fa3-1f36-235e-2987-38cdcfe4479f.png)


ハイパードライブはパソコンから共有されます。アドレスバーのピアカウントを見れば、何人がドライブに接続しているかがわかります。

![peer-count.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/fe7c937a-b88c-30fd-41cf-791bc7287c3a.png)


---
## ハイパードライブのホスティング
帯域幅を提供することで、他の人のハイパードライブをオンラインに保つのを助けることができます。これは「ホスティング」と呼ばれます。

ドライブをホストするには、そのドライブにアクセスし、アドレス・バーの右側にあるピアカウントをクリックします。すると、トグルが表示されます。これを緑の「オン」状態に切り替えます。

![host-drive.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2520265/b942d50b-c68e-1523-5075-156daf0c68a6.png)


もう一度ボタンをトグルすると、ホスティングをオフにできます。