仕事とテクノロジーの一覧へ
別々のWebアプリケーションを表す3つのすっきりしたUIダッシュボードを積み重ね、その上にコーディングツールを配したモダンなフラットデザイン
仕事とテクノロジー

AI時代のスピード:数週間で3つのプロダクトをつくった方法

かつてソフトウェアプロダクトのローンチには、何か月もの開発が必要でした。AIを使って、3つのデジタルプロダクトを数週間で設計・開発・リリースした方法を紹介します。

成長中v1.0バージョン公開 2026年6月18日→ 更新 2026年6月18日

長いあいだ、プロダクトのアイデアから本番ローンチまでの道のりはマラソンのようなものでした。個人開発者なら、ソフトウェアプロダクトをつくるには、何週間もかかるボイラープレートのセットアップを覚悟しなければなりませんでした。データベースの設定、認証の構築、APIルーティングのエンドポイントづくり、レスポンシブなレイアウトの作成、そしてバリデーション用スクリプトの作成です。

プロダクト独自の価値の核となる部分をようやくコーディングする段階にたどり着くころには、もうへとへとになっていたのです。

でも2026年半ばの今、ものをつくるスピードは根本から変わりました。私は4週間で、3つのまったく異なるWebアプリケーションを設計・開発・リリースしました。

  1. SentryPost:オーディエンスのエンゲージメントログをもとに配信時刻を最適化する、SNSの自動予約投稿ツール。
  2. Tabulate:PDFのレシートを解析し、項目を構造化された経費シートに直接マッピングするデータベースユーティリティ。
  3. DailyList:毎日届くメールのアップデートを1つのダッシュボードに要約する、ミニマルなニュースレターアグリゲーター。

私は10xエンジニアではありませんし、週100時間働いてこれらのソフトウェアを書いたわけでもありません。そのかわりに、標準化したスタック(Next.js、TailwindCSS、Supabase)を使い、ボイラープレート、レイアウト、連携ロジックをまるごとAIコーディングエージェントに任せたのです。

ここでは、思考のスピードでものをつくるなかで学んだワークフロー、アーキテクチャ、そして開発者としての教訓を振り返ります。


標準化されたスタック:スピードのための設計図

AIで速くつくるには、アーキテクチャのばらつきをなくさなければなりません。プロジェクトごとにデータベースのプロバイダーやバックエンドのフレームワーク、CSSのアプローチを変えていると、AIコーディングエージェントが混乱します。規約がごちゃまぜになり、コンパイルエラーが一気に増えてしまうのです。

私は3つのプロダクトすべてで、ひとつのシンプルなスタックに統一しました。

  • フレームワーク:Next.js(App Router、TypeScript)
  • スタイリング:TailwindCSS(ユーティリティクラスですばやくレイアウトを組むため)
  • データベースと認証:Supabase(メール認証が組み込まれたPostgreSQL)
  • デプロイ:Vercel(プレビューデプロイを自動化するため)
+-------------------------------------------------+
| Next.js App Router (TypeScript)                 |
|                                                 |
| [Frontend UI: Tailwind]  <-->  [Backend API]    |
|                                     |           |
|                               (Supabase Client) |
|                                     v           |
|                              [Supabase DB /     |
|                               Authentication]   |
+-------------------------------------------------+

スタックを同じにしておいたことで、モデルのコンテキストはすべてのプロジェクトでぶれずにそろっていました。データベースのスキーマ、クライアントのラッパー、認証ガードを、リポジトリをまたいで再利用できたのです。新しいプロジェクトのターミナルを立ち上げて「Supabase認証のクライアントラッパーをセットアップして」と頼むと、AIは以前のコードベースの規約にぴったり合ったラッパーを生成してくれました。


ステージ1:スキーマの下書きとデータベースのセットアップ

アプリをローンチするうえで最初のボトルネックになるのは、データベース設計です。UIを書く前に、テーブル、キー、外部キーによるリレーションを定義しなければなりません。

私はSQLを手で書くかわりに、シンプルなMarkdownの表でデータベーススキーマを設計しました。たとえばSentryPostでは、次のような記述を下書きしました。

テーブル:
- users: id (uuid), email (text), tier (text)
- schedules: id (uuid), user_id (ref users), title (text), content (text), send_at (timestamp), status (enum)
- metrics: id (uuid), schedule_id (ref schedules), impressions (int), clicks (int)

この表をターミナルのエージェントに渡して、次のクエリを実行しました。 claude -p "このスキーマ定義に合わせて、Supabase用のPostgreSQLマイグレーションスクリプトを生成して。ユーザーが自分のデータだけを読み書きできる行レベルセキュリティ(RLS)ポリシーも含めること。"

数秒のうちに、エージェントはマイグレーション用のSQLを生成しました。

-- schedulesテーブルを作成
CREATE TYPE schedule_status AS ENUM ('draft', 'scheduled', 'sent', 'failed');

CREATE TABLE public.schedules (
    id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
    user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE NOT NULL,
    title TEXT NOT NULL,
    content TEXT NOT NULL,
    send_at TIMESTAMP WITH TIME ZONE NOT NULL,
    status schedule_status DEFAULT 'draft'::schedule_status NOT NULL,
    created_at TIMESTAMP WITH TIME ZONE DEFAULT timezone('utc'::text, now()) NOT NULL
);

-- 行レベルセキュリティを有効化
ALTER TABLE public.schedules ENABLE ROW LEVEL SECURITY;

-- SELECT用のポリシーを作成
CREATE POLICY "Users can view their own schedules" 
    ON public.schedules FOR SELECT 
    USING (auth.uid() = user_id);

-- INSERT用のポリシーを作成
CREATE POLICY "Users can insert their own schedules" 
    ON public.schedules FOR INSERT 
    WITH CHECK (auth.uid() = user_id);

マイグレーションファイルとRLSポリシーを1つのプロンプトで生成したことで、手作業でSQLを書く何時間もの手間を省けました。RLSは構文エラーを出さずに手で書くのが難しいことで有名ですが、何千ものSupabaseの設定を学習しているAIは、ポリシーを正しく扱ってくれました。


ステージ2:TailwindとFlexboxでUIをすばやくデザインする

データベースの準備ができたら、次はユーザーインターフェースです。レイアウトをゼロからデザインするのは時間のかかる作業です。flex-wrapやpaddingの比率、ダークモード用のクラスを調整するとなると、なおさらです。

私は「レイアウトの下書き」というアプローチをとりました。インターフェースのレイアウトを、意味ベースで記述したのです。

SentryPostのダッシュボードのシェルレイアウトをつくって。
- サイドバー:ナビゲーション項目(Dashboard、Schedules、Analytics、Settings)。下部にプロフィールカード。
- メインエリア:パンくずリストと「Create New」ボタンのあるヘッダー。
- グリッド:3つの指標カード(Scheduled Posts、Sent Posts、Success Rate %)。
- リスト:予約済みの投稿をステータスバッジ付きで表示する、すっきりしたデータリスト。

このレイアウトの依頼をAIに渡すと、Tailwindのレイアウト構造を含む、よく最適化されたReactコンポーネントが返ってきました。CSSクラスをどう書くかではなく、画面に何を表示すべきかを記述することで、レイアウトの調整はAIに任せられたのです。

ボタンの配置がおかしく見えても、CSSのflexboxのルールを調べたりはしませんでした。エディタでそのブロックを選択して、「このボタンをカードの右端に寄せて、縦方向は中央、隣の入力欄と高さをそろえて」と頼むだけです。AIはTailwindのユーティリティクラスを即座に書き換えてくれました。


すばやくつくるための実践戦略

このスピードでプロダクトをつくってローンチしたいなら、開発の習慣を変える必要があります。

  • ボイラープレート用のリポジトリを使う:プロジェクトのたびにcreate-next-appをゼロから実行するのはやめましょう。Supabase認証のクライアント設定、標準的なナビゲーションコンポーネント、決済用のフック、メタデータのレイアウトが最初から組み込まれた、非公開のテンプレートリポジトリを用意しておきます。
  • データベース操作は早めにテストする:UIを書く前に、ダミーのレコードを挿入・読み出しするローカルスクリプトを書きます。見た目のフォームをつくる前に、データベースの制約、スキーマ、APIルートが動くことを確認しておきましょう。
  • 過剰設計を避ける:MVPに複雑なキャッシュやキューシステム、スケーラブルなクラスターを実装してはいけません。顧客の需要を検証できるまでは、基本的なSQLトリガー、シンプルなcronジョブ、データベースのふつうの行をキューの保存に使えば十分です。
  • フィーチャーフラグで反復する:仕上げるのが難しい機能は、フィーチャーフラグで包むか、UIのリンクを無効にしておきます。まずはコアとなるループを出すことに集中しましょう。

これからの展望:ソロプレナーのスタートアップ

これから先、ソフトウェア開発のコストはゼロに近づき続けるでしょう。

システムアーキテクチャと顧客ニーズを理解しているひとりの開発者が、以前ならベンチャーキャピタルの出資を受けたスタートアップが必要だったようなWebアプリケーションのポートフォリオを、つくって運営できるようになります。テック業界の競争優位は、コーディングの能力から、市場への洞察、顧客による検証、そして販売チャネルへと移っていきます。

未来に成功する開発者は、手書きでいちばんきれいなコードループを書く人ではありません。問題を見つけ、システムを設計し、AIエージェントを指揮して、安定したソリューションを記録的な速さでつくれる人です。


関連記事

参考リンク

  • データベースのセットアップやRLSのガイドラインは、Supabase Documentation Blogで確認できます。
  • ページレイアウトやデプロイの最適化については、Vercel Blogが参考になります。
  • ラピッドプロトタイピングとソフトウェア開発のスピードについては、GitHub Blogで読めます。

私の考えが変わったきっかけ

以前の私は、ソフトウェアの会社を始めるには、共同創業者とシードラウンドの資金調達、そして何か月にもわたる開発のイテレーションが必要だと信じていました。2023年はまるまる1年、あるSaaSのアイデアの設計ドキュメントを書き、フレームワークについて議論し、実際のユーザーがひとりも触れることのなかったローカルのデータベースモデルを最適化することに費やしました。実行の複雑さに、身動きがとれなくなっていたのです。

4週間の実験を始めるとき、私はあらかじめ構成済みのスタックだけでつくり、コードはコーディングエージェントに書かせると決めました。そして、たとえ設定ページが空っぽでも、コアとなるユーザーの導線が動いた時点で、それぞれのアプリを半ば強制的にローンチすることにしたのです。

開発からわずか6日で最初のプロダクトがVercel上で公開されるのを見て、私の世界観はまるごと変わりました。実際のユーザーが登録し、フィードバックを送り、機能をリクエストしはじめたのです。

私は気づきました。エディタで書くコードは実装の細部にすぎず、価値はユーザーのフィードバックとプロダクトの更新のあいだを回るループにあるのだと。実行の細部をAIに任せたことで、私はエディタのフォーマッターのように振る舞うのをやめ、プロダクトオーナーとして動けるようになりました。この1か月で、それまでの2年間よりも多くのコードをリリースし、人生で初めて、リアルタイムでものをつくっている実感を得ました。

更新履歴

v1.0

AIを使って数週間で3つのプロダクトをリリースした事例。

  • •複数プロダクトのリリース体験記を公開

DailySayに聞く

Related Posts

続けて読む

PMI韓国支部の教育委員会でボランティアを始めました:合格体験記のその後
仕事とテクノロジー14 min

PMI韓国支部の教育委員会でボランティアを始めました:合格体験記のその後

PMP合格後にPMI韓国支部の教育委員会でボランティアを始めた理由、支部と教育委員会の活動、一緒に勉強したい人の参加方法をまとめた、「PMP合格ロードマップ」シーズン1の最終回です。

記事を読む

残しておきたいノートを、ときどき。

プロジェクトマネジメント、AI、プロダクト、旅、そしていま作っているものについて、ときどきお届けします。

スパムは送りません。届くのはときどきのノートだけ。詳しくは プライバシーポリシー.