バイブコーディングで非エンジニアが自社アプリを24時間で開発した事例【Codex & Claude Code】

2025.09.28 | テックブログ

「コードはAIにすべて書かせる」

AIの急激な発達によってコーディングのあり方が劇的に変化しており、人間がAIにコードを書かせる「バイブコーディング」がかなりホットなワードになっています。

ASOLAB.でもこのバイブコーディングを積極的に導入しており、アプリケーションやサービスを多数開発し、大幅な生産性向上とコストカットを実現しています。今回はその内、非エンジニアが作業時間24時間で自社専用・自社ブランドのファイル転送サービスを開発した事例を詳細に紹介します。

この記事は全て人の手によって書かれています

バイブコーディングとは

バイブコーディングとは、人が方向性や雰囲気(Vibe)をAIに伝え、AIがコードを書いて開発していく新しいスタイルです。AIが超高速でコーディングを行い、人はその結果をレビューしてフィードバックを返していくことで、極めて短い開発期間で開発が完了します。

人の役割がプロデューサー、AIの役割はエンジニアと考えると分かりやすいです。

開発に至った経緯

業務に使用するサービスを新規導入しようと各社サービスを検討する際、必要な機能・信頼性・価格感などがすべてマッチしているサービスを見つけるのは当然のことながら至難です。

弊社でも「ファイル転送サービス」の新規導入を検討していましたが、条件とした「信頼性が高くかつ誰でも手軽に使えるシンプルなファイル転送サービス」がなかなか見つかりませんでした。市販のサービスは様々なユーザーの需要に答えるため、必ずしも必要のない機能がふんだんに盛り込まれていたり、逆に簡素すぎるケースが多いのです。

「なければ作ればいい」と思い立ってから開発完了までは一瞬でした。

作ったもの

実際に作ったサービスの画面がこちら。

シンプルなファイル・フォルダアップロード画面とアップロード履歴。フォルダアップロードではMacとWindows間でよくある文字化けと不要ファイル混入問題を解消するZIP化を実現。

開発サービスのトップ画面

アップロード画面では保存期限やパスワード設定などの必要な設定項目。

強力なパスワードを自動生成する機能を搭載することでセキュリティの担保を実現。

開発環境 | Codex & Claude Code

今回バイブコーディングには、Claude Code (Sonet4)Codex (GPT-5)を使用しました。ClaudeはPro、CodexはChatGPT Plusプランのものを使用。いずれも月額20ドルです。

基本的な開発にはClaude Codeを用いて、Codexは主に困難なバグ潰しやコードレビューに使用しました。

開発順序と今回の所要時間

1. 要件定義書の作成 (1時間)

要件定義例
Claudeが作成した要件定義書例(実際のものとは無関係です)

上記のAIは非常に優れたモデルですが、人間が適切な指示出しをしなければAIは勝手な解釈でどんどん開発を進めてしまいます。そのため、開発指示を出し始める前に目指すゴールやそのために必要な機能などをまとめておかなければいけません(いわゆる要件定義)。

この、目指すゴールや必要な機能をまとめた要件定義書の作成もAIを用います。AIとの対話を繰り返すことで自分の頭の中のイメージを言語化していきます。AIにアイデア出しを求めてもいいでしょう。

プロンプト例:アイデア出し
要件定義書の内容を踏まえて、さらにサービスを便利にしたり有効な機能についての提案をしてください。

2. 技術スタックの決定 (1時間)

要件定義書を作成したら開発に進んでいきますが、サービスの実現にはどんな技術を使っていくかを決定する必要があります。

例えば今回のようなファイル転送サービスを実現するためには、ファイルを保存するオンラインストレージや、アップロードしたファイルの情報を保存しておくデータベースが必要です。WEBサービスとして表示するためのフレームワークも必要です。

非エンジニアがこのような技術スタックを自分で決定するのは難しいですが、AIに選択肢を出させたり提案させたりして、比較検討しながら進めていきます。

プロンプト例:外部ストレージ決定
"アップロードしたファイルを保存するために使用するストレージサービスについて、S3, R2, B2, Wasabiなどを比較した場合のそれぞれのサービスの特徴や価格、使用する場合のメリット・デメリットを調査して挙げてください。"

3. 開発を進める (18時間)

ここまで準備ができたら実際に開発を進めていきます。AIに指示を出し、開発結果を見て修正箇所があればまた指示を出します。エラーがあればエラー内容を上げれば修正してくれます。人間が行うのは頭の中のイメージをAIに適切に伝えていくことです。

AIが作成した初期のサービストップ画面がこちら。シンプルなところからステップバイステップで機能やUIを肉付けしていくと失敗が少ないです。

AIがポン出ししたサービスの画面

ログイン機能を追加。

サービスのログイン画面

ただし、すべてがAI任せとはいきません。コードは書いてくれますが、コードを管理するGitHubの設定やホスティングサービスの設定、外部ストレージの設定などは自分で行う必要があります。

バイブコーディングはコーディングに対するハードルをぐっと下げましたが、PCやWEBの専門的な知識がなければ難しい部分もまだまだ多いでしょう。

4. コードレビューを行う (2時間)

開発が完了する段階でAIにコードレビューを行ってもらいます。開発されたものが要件定義書どおりになっているか、不具合が生まれる可能性のある実装はないか、コードにおかしなところはないかなどを総合的に調査します。

今回の開発でもこのコードレビューによっていくつかの問題が見つかりました。

CodexとClaudeなど複数モデルを使用したり、モデル同士に対話させたりしてコード全体の安定性を増していきます。

プロンプト例:コードレビュー
"コード全体をレビューし、要件定義書に沿っているかどうか、不具合やバグの原因となりうる実装はないかなどの調査を行ってください。即時修正は行わずリスト化してください。"

5. セキュリティチェック (2時間)

当然のことながら、セキュリティに関しては特に念入りなチェックが必要です。

バイブコーディングという言葉が出始めた頃は、コードの品質やセキュリティに対する不安視が大きく、バイブコーディングのデメリットとして挙げられていました。

もちろんその懸念点は軽視できませんが、こちらに関してもAIの発達によって日に日に大きな問題ではなくなっているのも事実です。GitHubなど各種サービス内にもコードスキャン機能が搭載されており、コードレビューに特化したAIモデルも登場しています。

もっとも、特に非エンジニアであれば「漏れたらヤバいデータはそもそも扱わない」という意識も必要です。

プロンプト例:セキュリティチェック
"コード全体をレビューし、特にセキュリティに関する部分に関して念入りに調査検討を行ってください。脆弱性となりうる部分に関して即時修正は行わずリスト化してください。"
"ユーザーが行うべき外部サービス(GitHub, Supabase, Vercel, Cloudflare等)におけるセキュリティチェック項目をチェックリスト化してください。"

6. 人間によるテスト

当然意図しない挙動やバグが残っている場合があるので、人の手で様々な操作をしてテストします。

ここまで作業時間24時間以内で社内向けアプリケーションとして使える形になりました。

開発サービスのトップ画面

その他開発実例

360度動画を3D/3DGS作成用に多視点JPGに自動切り出しするソフトウェア。

360度動画の切り出しソフト

3DGS作成サービスのランディングページ。

バイブコーディングの開発事例

株式会社ASOLAB.について

スカイファイト松本の店舗

今回の開発では、バイブコーディングという手法をとることで超短期間で自社専用サービスを立ち上げることができました。他社有料サービスを利用する必要がなくなり、従来であれば長い期間とコストがかかる開発を大幅に縮小できたのは大きな成果と言えるでしょう。

このように株式会社ASOLAB.は、ドローン総合サービス企業でありながらAIを積極的に導入・活用することで新しい価値の創造や既存業務の改善・大幅なコストカットを実現しています。

お困りごとがありましたら下記コンタクトフォームよりご相談ください。