はじめに
私は客先常駐で働いていて、勤務時間を自分で管理する必要があります。そのために作った勤務時間アプリなど、自作の Android アプリがいくつかあります。
これらを Google Play で公開しようとしましたが、「テスター12人・14日間」のクローズドテストを満たせず、公開まで進めませんでした。
そこで、自分のアプリを紹介・配布するサイトを、自分で作ることにしました。この連載では、その作る過程を順番に書いていきます。
この記事は連載の1回目です。「なぜ作るのか」「どんな作りにするのか」をまとめます。コードは2回目から出てきます。
連載の予定
- 構想編：なぜ自分で配布サイトを作るのか（この記事）
- 環境構築編：Next.js と Vercel で公開するまで
- データベース編：Supabase にアプリ情報を入れる
- 一覧・詳細ページ編
- 管理者ページ編：ログインと追加・更新・削除
- APK 配布編：リリース署名と GitHub Releases
- プライバシーポリシー・仕上げ編
- 振り返り
Google Play の「テスター12人・14日間」とは
2023年11月以降に作った個人のデベロッパーアカウントでは、アプリを一般公開する前に、クローズドテストを行う必要があります。
- 12人以上のテスターが参加する
- テスターが14日間続けて参加している
この2つを満たさないと、本番公開を申請できません。身近に Android を使っていて、14日間付き合ってくれる人を12人集めるのは、個人には意外と大変でした。
Google Play 以外で配る方法を考えた
Android は、Google Play を通さなくても、APK ファイル（Android アプリのインストール用ファイル）を直接配れます。そこで、配り方をいくつか比べました。
| 方法 | よい点 | 気になった点 |
|---|---|---|
| Google ドライブで共有 | すぐ配れる | 確認画面が出る。ダウンロードの回数に上限がある |
| GitHub Releases だけで配る | 無料・安定している | アプリの紹介ページとしては見づらい |
| 紹介サイト＋GitHub Releases | アプリの説明や画面を見せられる。APK は GitHub に任せられる | サイトを作る手間がかかる |
最後の「紹介サイトを作り、APK 本体は GitHub Releases に置く」形にしました。サイトを作る手間はかかりますが、作る過程そのものを学習と記事のネタにできると考えました。
どんなサイトにするか
利用者向けのページ
| ページ | 内容 |
|---|---|
| アプリ一覧 | アプリがカードで並ぶ（アイコン・名前・ひとこと説明） |
| アプリ詳細 | 説明・画面の画像・バージョン・対応 OS・ダウンロードボタン |
| インストール方法 | APK の入れ方を手順と画像で説明 |
| プライバシーポリシー | サイトとアプリが扱う情報の説明 |
管理者ページ（自分だけが使う）
- ID とパスワードでログイン
- アプリの追加・更新・削除
- アイコンと画面の画像のアップロード
アプリを増やすたびにコードを書き換えるのは面倒なので、最初の版から管理者ページを入れることにしました。
全体のしくみ
利用者 ──見る──▶ サイト（Next.js / Vercelで公開）
│
├─ アプリ情報を読む ──▶ データベース（Supabase）
│
└─ ダウンロード ──▶ APKファイル（GitHub Releases）
管理者（自分）──ログイン──▶ 管理者ページ ──追加・更新・削除──▶ データベース
使う技術と、選んだ理由
| 役割 | 使うもの | 費用 |
|---|---|---|
| 画面 | Next.js（App Router・TypeScript・Tailwind CSS） | 無料 |
| 公開 | Vercel（無料プラン） | 無料 |
| データベース・ログイン・画像置き場 | Supabase（無料プラン） | 無料 |
| APK の置き場所 | GitHub Releases | 無料 |
Next.js と Vercel
- React を学び直したかったからです。最近は AI にコーディングを任せることが多く、書き方を忘れてしまっていました
- Vercel は Next.js を作っている会社のサービスで、GitHub に push するだけで公開まで進みます
Supabase
管理者ページを作るには、次の3つが必要になります。Supabase なら、1つのサービスでまかなえます。
| 必要なもの | Supabase の機能 |
|---|---|
| アプリ情報を保存する場所 | データベース（PostgreSQL） |
| 管理者のログイン | Auth |
| アイコン・画面の画像の置き場所 | Storage |
APK は GitHub Releases に置く
Supabase の無料プランは、ファイル置き場が 1GB までです。APK は1つ数十MBあり、バージョンを上げるたびに増えていきます。そこで APK は GitHub Releases に置き、データベースにはダウンロード用の URL だけを入れることにしました。
リポジトリは、次のように分けます。
| リポジトリ | 公開設定 | 中身 |
|---|---|---|
| サイト本体 | 公開 | このサイトのソースコード |
| アプリのソースコード | 非公開 | アプリのプログラム本体 |
| 配布専用 | 公開 | Releases に APK を置くだけ |
配布専用のリポジトリを公開にするのは、非公開だと GitHub にログインしていない人が APK をダウンロードできないためです。複数のアプリを1つのリポジトリで配るので、Releases のタグにはアプリの ID を付けて区別します（例：sample-todo-v1.0.0）。
費用は0円
Vercel・Supabase・GitHub とも、無料プランの範囲で収まる見込みです。
ただし、次の2点には注意が必要です。
- Vercel の無料プラン（Hobby）は、個人の非営利目的に限られます
- Supabase の無料プランは、1週間アクセスがないとプロジェクトが一時停止します
サイト本体のソースコードは公開する
記事からコード全体へ案内できるように、サイト本体のリポジトリは公開します。
公開するうえで、次のことに気をつけます。
- 秘密の鍵（Supabase の secret key など）は
.env.localと Vercel の環境変数だけに置き、GitHub には上げない - Supabase の publishable key（公開用の鍵）はブラウザから見える前提の鍵なので、守りはデータベース側の RLS（行ごとの権限設定）で行う
- 管理者ページのしくみが見えても困らないように、「コードを隠すこと」ではなく「パスワードと RLS」で守る
今後やりたいこと
最初の版ができたら、PC アプリ（Windows・Mac）の配布や、Web アプリの紹介にも対応したいと考えています。
おわりに
次回は、Next.js のプロジェクトを作り、Vercel で公開するところまでを書きます。
ソースコードは GitHub で公開しています（作りながら更新しています）。
サイトは、APK を配れるようになった段階（連載の第6回ごろ）で公開する予定です。