PWAをアプリにしようとして、最初につまずいたこと ―「マニフェストがありません」と、本当に欲しかったもの

「ホーム画面に追加」で、アプリになった

2026年4月1日の夜、私は生まれて初めてアプリを作ってもらいました。血圧を記録するアプリです。そのときの話は最初のアプリの記事に書きました。

作ってもらった直後に、私は「このアプリを自分のスマホにインストールする方法を教えてください」と頼みました。

AIが最初に勧めたのは、PWA という方法でした。アプリをインターネット上に置いて、スマホのブラウザで開き、「ホーム画面に追加」を押す。それだけで、ホーム画面にアイコンができて、アプリのように使えます。無料で、インストールファイルも要りません。

AIが用意してくれた ZIP ファイルには、5つのファイルが入っていました。

ファイル	役目（私の理解）
`index.html`	アプリ本体
`manifest.json`	アプリの名前やアイコンを、スマホに伝える名札
`sw.js`	一度開いたあと、ネットにつながらなくても動くようにする仕組み
`icon-192.png`／`icon-512.png`	アイコンの画像（大小2つ）

これを無料の置き場所（Netlify Drop）に置いて、スマホで開いて、ホーム画面に追加しました。最初のアプリが、自分のスマホに入った瞬間でした。

翌日、欲が出ました。

オフラインでアプリを使えるように、スマホ本体にアプリをインストールしたいです。アプリのインストールファイルを作成してスマホにインストールできるようにしてください。

ホーム画面に追加しただけのものは、なんとなく「ちゃんとしたアプリ」ではない気がしていたのだと思います。

AIの答えは、まず「できません」でした。この会話の中では、Android のインストールファイル（APK）は作れない。 作るには、Android 用の開発道具や Java などが要る、と。

そのうえで、現実的な方法を3つ挙げてくれました。その1つが PWABuilder という無料のサービスです。インターネット上に置いたアプリの住所（URL）を入れると、Android のインストールファイルに変換してくれる、というものでした。

さっそく試しました。手順3まで進んだところで、エラーが出ました。

PWABuilder の手順３まで進めたところ、ウェブアプリのマニフェストがないというエラーメッセージが出ました。解決策を教えてください。

マニフェストは、さっきの表の「名札」です。ZIP の中に、ちゃんと入っていました。あるのに「ない」と言われる。 最初のつまずきでした。

AIがファイルを調べると、原因は3つありました。

最初に開くページの書き方（start_url）が、相対的な書き方（./index.html）になっていた → サイトの根元からの書き方（/）に直す
アイコンの用途（purpose）の欄に、「any」と「maskable」の2つの値を1つにまとめて書いていた → 別々に分ける
スクリーンショットの欄がなかった（PWABuilder が推奨している項目）→ 足す

「ネットにつながらなくても動く仕組み」（sw.js）の中の書き方も、1に合わせて直してもらいました。直した ZIP は、その場ですぐにできました。

ファイルが「ない」のではなく、書き方がその道具の求める形になっていなかった、ということでした。

実は、AIは3つの方法を挙げたときに、こうも言っていました。

先に作ったアプリは、すでに「ネットにつながらなくても動く仕組み」が入っている。一度ブラウザで開いたあとは、オフラインでも動く。

私が最初に書いた頼みは「オフラインでアプリを使えるように」でした。それは、ホーム画面に追加した PWA で、もうできていたのです。

翌朝、私はアプリの改善を頼むメッセージの最後に、こう書きました。

スマホへのインストール方法はPWAでホーム画面に追加(無料・簡単)でお願いします。

インストールファイルづくりは、ここでいったん置きました。

「何がしたいのか」と「どうやるか」を、ごちゃまぜにして頼んでいました。

したかったのは「オフラインで使うこと」。それなのに私は「インストールファイルを作って」と、やり方のほうを頼んでいました。やり方を指定すると、AIはそのやり方で一生懸命に進めてくれます。でも、それが本当に必要だったかは、別の話でした。

これからPWAを試す方に、私の場合に効いたことを書いておきます。

まずは「ホーム画面に追加」で十分なことが多い。 sw.js のような仕組みが入っていれば、オフラインでも動きます
PWABuilder で「マニフェストがない」と出たら、ファイルが無いとは限りません。 私の場合は、開くページの書き方・アイコンの用途の書き方・スクリーンショットの欄の3つでした（2026年4月の時点の話です。道具の求める形は変わることがあります）
頼むときは、やり方より先に「何がしたいか」を書く

血圧のアプリは、その後も PWA のまま、たくさんの機能を足していきました。アップデートのときに記録をどう引き継いだかは、Netlify Drop の記事に書いています。

本当に Google Play に出すアプリを作ったのは、1か月後の、節約記録アプリでした。そのときは PWABuilder ではなく、別の方法でインストールファイルを作っています。初めて Google Play に提出した朝の話は、こちらの記事に書きました。