クリップボード パターン、ファイル パターン、アプリ パターンなど、素晴らしいアプリ向けの新しいパターンのコレクションをご覧ください。
次世代の動画編集アプリ、中毒性のあるワードゲーム、将来のオンライン ソーシャル ネットワーキング アプリなど、何を構築する場合でも、いくつかの基本的な構成要素が必要になります。
- 動画編集アプリでは、編集した動画を保存できる可能性があります。
- ゲームの進行状況を友だちと共有できるようにする。
- オンライン ソーシャル ネットワーク アプリでは、ユーザーが投稿に画像を貼り付けできる可能性が高いでしょう。
これらのパターンを実現するための普遍的な方法がない
これらは、このようなパターンのほんの一例にすぎません。ただし、これらすべてに共通する点は、実現するための普遍的な方法がないことです。
共有の進捗状況
たとえば、すべてのブラウザが Web Share API を実装しているわけではないため、Twitter の Web Intents やクリップボードへのコピーなど、別のアプローチにフォールバックしなければならない場合があります。これは、Web Share API が実装されていない Wordle で選択されたアプローチです。ふう、この問題はギリギリで解きました。
Wordle 471 6/6
⬛⬛⬛⬛🟨
🟩⬛⬛⬛🟨
🟩🟩🟩⬛⬛
🟩🟩🟩⬛⬛
🟩🟩🟩🟩⬛
🟩🟩🟩🟩🟩
ファイルの保存
保存に関しては、File System Access API を使用するのが一般的です。これにより FileSystemFileHandle が生成され、真の保存、編集、保存フローを実装できます。次善の策は、従来の <a download> にフォールバックすることです。これもユーザーがデータを保存できるようにしますが、ダウンロードのたびに新しいファイルが作成されるという欠点があります。そのため、my-video.mp4、my-video (1).mp4、my-video (2).mp4 などのファイルが作成されます。
画像の貼り付け
導入例を締めくくるために、すべてのブラウザがウェブアプリへの画像の貼り付けをサポートしているわけではないため、ドラッグ＆ドロップ API を使用するか、ファイル選択ツールを表示することをおすすめします。これは 非同期クリップボード API ほどエレガントではありませんが、少なくとも機能します。
新しいパターン
新しいパターン セクションは次のとおりです。
クリップボード パターン
さまざまなもののコピーや貼り付けなど、システム クリップボードに関連するすべてのものに関するクリップボード パターン。
ファイル パターン
ファイルとディレクトリに関連するすべての操作（保存、開く、ドラッグ＆ドロップ、受信、共有）のファイル パターン。
ウェブアプリのパターン
アプリのショートカットの提供、バックグラウンドでのデータの定期的な同期、アプリバッジの表示など、高度なアプリ機能に関するすべてのウェブアプリ パターン。
フィードバック
これらのパターンが優れたアプリの開発に役立てば幸いです。フィードバックをお待ちしております。
フィードバックは、@ChromiumDev にツイートするか、問題を報告することで送信できます。どちらの場合も、@tomayac にタグを付けてください。
謝辞
パターンの確認と編集にご協力いただいた Joe Medley 様に感謝いたします。Pete LePage、Ewa Gasperowicz、Rachel Andrew、Ken Pascal、Matthias Rohmer の技術面と組織面でのサポートと励ましに感謝します。個々のパターンの作成者である Harry Theodoulou 氏、Tony Conway 氏、Palances Liao 氏、Cecilia Cong 氏、François Beaufort 氏、Joe Medley 氏の協力なしでは、このパターン プロジェクト全体を完成させることはできませんでした。