はじめに：「プログラミングできないけど、作りたいものがある」
はじめまして。この記事を書いている時点での私のプログラミング経験は「CSSの微調整ができる程度」です。
2025年4月、ふと思ったんです。
「AI時代になって、タイムリーな情報か専門的な情報じゃないとブログ読まれなくない？」
そこから「じゃあ、AIに質問したやり取りを共有できるプラットフォームがあったら面白いのでは？」というアイデアが生まれました。その時のChatGPTとの会話です。
当時の私は授業でC言語やPythonを習いましたが、0からコードを書くことはできないレベル。でも、AIを使えば作れるかもと思いました。
作ったもの：Gimmy（ギミー）
Gimmy: https://www.gimmy.jp/
コンセプト
匿名でAIに質問し、その質問と回答を他のユーザーと共有できるWebアプリです。「AIとの会話をアーカイブとして残したい」「他の人がどんな質問をしているか見たい」というニーズに応えるサービスを目指しました。
匿名性を採用した理由
サービス設計において匿名性を重視したのは、以下のような利点があると考えたためです：
- 心理的ハードルの低減: 実名やアカウント情報を登録する必要がないため、初歩的な質問や些細な疑問でも気軽に投稿できます。「こんなこと聞いて恥ずかしくないか」という懸念を持たずに利用できる環境を提供できます。
- 投稿の多様性: ユーザー登録が不要なため、一見「くだらない」と思われる内容でも投稿しやすくなります。結果として、幅広いトピックの質問が集まり、サービス全体のコンテンツの多様性が向上します。
- 開発・運用の簡便性: ユーザー認証システムや個人情報管理の仕組みが不要となり、開発者側のリスクとコストを削減できます。また、個人情報漏洩のリスクも回避できます。
一方で、匿名性には荒らしやスパム投稿のリスクもあるため、適切なモデレーション機能の実装を今後の課題としています。
主な機能
- 匿名AI質問共有: ユーザー登録不要で気軽に投稿
- アーカイブ機能: 過去の会話を検索、いいね、コメント
- スコアシステム: 質問にスコアが付き、合計で特典解放（桜井政博さんのYoutubeチャンネル「桜井政博のゲーム作るには」からヒントを得ました）
- プライベート/オープンモード: 自分だけか、みんなで共有するか選択可能
- フラグ機能: 長い会話で特定の質問に素早く戻れる
- コメント機能: AIを呼び出さずに会話に参加したいときのため
- 多言語対応: 日本語/英語対応（i18n実装）
技術スタック
Frontend: HTML, CSS (一部TailwindCSS), JavaScript
Backend: Flask (Python)
Database: Supabase (PostgreSQL)
Container: Docker
AI: Gemini API, OpenAI API
Deploy: Render
すべてAIに選定してもらいました。今思えば「本当にこれがベストだったのか？」という不安もありますが、動くものができたので良しとしています。
開発環境の変遷
Phase 1: ChatGPT時代（4月〜5月）
最初は ChatGPT に「匿名でAIへの質問を共有できる掲示板のようなサイトを作りたい」と相談するところから始めました。
開発フロー:
- ChatGPTにコンセプトを伝える
- 生成されたコードをVS Codeにコピペ
- ローカルでテスト実行
- エラーが出る
- エラーログをコピペして「これ直して」
- 修正コードをもらう
- 1〜6を無限ループ
この時期は正直、何をやっているのか全く理解していませんでした。でも、動いたらOK精神でゴリ押し。
Phase 2: Github Copilot Plus時代（6月〜9月）
転機が訪れたのは6月。Github Copilot Plusに学割があると知り、即座に乗り換えました。
参考にした記事：学生向けGitHub Copilotの申請方法
使用ツール:
- Github Copilot Agent (今使っているのは、Claude Sonnet 4.5, GPT-5 Codex)
最初はAskモードで質問していましたが、プロジェクトが大規模になってからはAgentモードがメインに。複数ファイルにまたがる変更もAgent任せです。
クレジット管理について:
正直、節約はしませんでした。使い切ったら翌月まで待って開発再開。
開発の実態：1日4時間 × 5ヶ月の試行錯誤
開発時間の内訳
- 平日: 授業後に2〜3時間
- 週末: 4〜6時間
コード生成の割合
- AI生成: 90%以上
- 自分で書いた部分: CSSの微調整、色の変更、余白の調整など
恥ずかしい話、ロジックは一切書いていません。全てAI任せです。
AI活用の実践的テクニック
5ヶ月間で学んだ、AIを使った開発の実践的なコツをまとめます。
1. 基本的なフロー
AIへ指示 → テストページで動作確認 → エラーが出たら④へ → 解決したらフロントエンドを改善
2. プロンプトの進化
初期（4月）:
・スレッドカード右下にいいねボタンを追加してください。
・いいねボタンはハートのSVGアイコンを使ってください。
現在（9月）:
## chatページのユーザーメッセージに編集機能を追加実装したいです。フロントエンド・バックエンドともに
- フラグボタン、コピーボタンと並べて**編集ボタン（ペンのみのSVGアイコン）を追加**してください。
- 編集できるのは投稿したユーザーのみです。IDを照らし合わせて権限チェックをしてください。
- **メッセージを編集して、送信ボタンを押すと新規メッセージにAIが回答するようにしてください。**
## 実装イメージ
1.フロントエンド (JavaScript / HTML):
質問表示エリアに「編集」ボタンを追加する。
「編集」ボタンが押されたら、質問文を <textarea> に変えて編集可能にし、「更新」ボタンを表示するJavaScriptロジック。
「更新」ボタンが押されたら、Fetch APIなどで新しい質問文をバックエンドに送信する処理。
2.バックエンド (Flask / PostgreSQL):
リクエストから新しい質問文を受け取り、DBを UPDATE する処理。
マークダウン形式にしてから、AIの理解度が向上した気がします。マークダウン形式はGeminiに作成してもらっています。
実際、上記のプロンプトだけでは完璧に実装できなかったので、以下の「2. UI実装のコツ」、「3. エラー対処の3ステップ」にあるようなプロンプトを実行しました。
3. UI実装のコツ
デザインの指示はスクリーンショット+具体的な指示がうまくいく印象でした。
次は**編集モードでのUI/UX**を改善したいです。
- .message-wrapper.user-message .message-contentの幅を.message-wrapper.ai-message .message-contentと同じにする。
- textareaの背景は透明にする。デザインは.message-wrapper.user-message .message-contentを維持する。レイアウトは**ChatGPTを模倣**する。
- 編集ボタンの背景とエフェクトをフラグボタン、コピーボタンと統一する。
*画像1：私のアプリ
*画像２：ChatGPT（見本）
ポイント:
- クラス名を明示的に指定
- 段階的に進める（一度に全部やらない）
4. エラー対処の3ステップ
Step 1: エラーログをそのまま投げる
以下のエラーが出ました。修正してください。
[エラーログ全文をペースト]
Step 2: うまくいかない場合
- モデルを変更 (Claude ↔ GPT を切り替え)
- 指示を減らす (3つ→1つに)
-
指示を具体化 (「バグを直して」→「
get_user_data()の戻り値がNoneになる問題を修正」)
Step 3: それでもダメなら
- 新規会話を開始 (コンテキストリセット)
- Deep Research で原因調査
- 最終手段: Githubを巻き戻す (実際2〜3回やりました...)
4. 指示は小分けに、1回最大3つまで
一度に多くの変更を依頼すると、予期しないバグが混入します。
❌ ダメな例:
・ログイン機能追加
・デザイン変更
・データベース構造変更
・i18n対応
・バグ修正10箇所
⭕ 良い例:
以下の3点を実装してください：
1. Google OAuth 2.0の認証エンドポイント作成
2. 認証後のリダイレクト処理
3. セッションへのユーザー情報保存
5. コンテキストの管理
1つの会話は、最初の要望が完成するまでが基本。
- 新規機能追加: 必ず新規会話で開始
- バグ修正: 既存会話で対応可
- 機能が完成したら: すぐに会話を終了し、次の機能は新規会話で
苦労した実装トップ3
1位: 多言語対応（i18n）
英語対応を実装しようとしたとき、予想以上に大変でした。
- 日本語前提で書かれた既存コードの全文言洗い出し
- 動的に生成されるテキストの翻訳
- ユーザーの言語設定を保持する仕組み
結局、AI に「全ファイルを解析して、ハードコードされている日本語を抽出して」と依頼し、3回に分けて対応しました。
2位: Google認証のエラー
OAuth 2.0 の実装で、リダイレクトURIのミスマッチエラーが延々と出続けました。
AIの提案通りに実装してもダメで、結局:
- Google Cloud Consoleの設定を見直し
- 環境変数の確認
- Flaskのルーティングを再確認
という地道な作業で解決。この辺は自分で調べるしかなかったです。
3位: AIの文脈に沿った回答
「前の会話を踏まえて回答してほしい」という機能で、コンテキストウィンドウの管理に苦戦。
- 長い会話履歴をどうAPIに渡すか
- トークン数の制限をどう回避するか
- パフォーマンスの劣化をどう防ぐか
最終的には、
- 新しい質問を確実にコンテキストに含める
- システムプロンプトを超具体的に修正
- 入出力トークンの上限を引き上げ
で解決できました。
コストの実態：ほぼ0円運用
内訳
| 項目 | コスト | 備考 |
|---|---|---|
| Supabase | 無料 | Free Tierで運用中 |
| API利用料 | 数円/月 | テスト投稿のみ |
| ドメイン | 約200円/月 | お名前ドットコム（初年無料、2年目以降年2,000〜3,000円） |
| Github Copilot Plus | 無料 | 学割適用 |
| Render | 無料 | Free Tierで運用中 |
| 合計 | 約200円/月 | ユーザー増加後は要見直し |
現在MAU15人（ページ閲覧のみ）なので、このコストで運用できています。目標の100人に達したら、API利用料が跳ね上がるかも...？
データ収集とプライバシーへの配慮
個人開発でも、データの扱いは慎重にすべきだと考えています。
収集しているデータ
Gimmyでは以下のデータを収集しています：
- 匿名セッションID: ブラウザのCookieに保存される64文字のランダムな識別子（個人特定不可）
- 投稿内容: 質問、コメントなどのテキスト
- 技術情報: アクセス日時、ブラウザ種別などの基本情報
- IPアドレス: スパム・不正アクセス検知のみに使用（一時的にキャッシュで保持、DBには非保存）
- 広告配信関連データ: Google AdSense等が取得する閲覧履歴の一部
データ保持期間
- 投稿から90日以上アクセスがないデータは削除対象として検討
- 具体的なルールは今後明文化予定
セキュリティチェック
実施頻度: 月1回
方法:
- 2つのAIモデル（GPT-5 Codex & Claude Sonnet 4.5）でコードレビュー
- OWASP TOP10に照らした静的チェック
- 依存関係の脆弱性確認
使用ツール:
- pip-audit
- Bandit
- Trivy
- gitleaks
- semgrep
- OWASP ZAP（公開環境）
ただし、これで完璧というわけではないことは理解しています。今後、ペネトレーションテストや第三者監査も検討中です。
脆弱性報告（Responsible Disclosure）
もし脆弱性を発見された場合は、以下のメールアドレスまでご連絡ください：
再現手順と影響範囲を添えていただけると助かります。報告を確認次第、優先的に対応します。
AI開発の未来：アイデアが全て
5ヶ月の開発を終えて思ったことがあります。
学習目的でない限り、AIを信頼して良い。
もちろん、セキュリティやライセンスへの責任は自分にあります。でも、アマチュアの個人開発なら、完璧を目指すより形にすることを優先して良いと思います。
AI がさらに進化する未来では、重要なのはアイデアと実行力。深い専門知識より「広く浅い知識」の方が価値を持つかもしれません。
現在の課題：宣伝に苦戦中
正直に言います。全然使ってもらえてません😭
現在の状況:
- MAU: 15人（ページ閲覧のみ）
- 実際に投稿してくれたユーザー: 数名
- 目標: MAU 100人
この記事も、実は宣伝目的だったりします（笑）
もし興味を持っていただけたら、ぜひ試してみてください。フィードバックは X（Twitter）でお待ちしています！
まとめ：諦めなければ、誰でも作れる
プログラミング知識ゼロでも、AIを活用すれば本格的なWebサービスは作れます。
重要なのは：
- 諦めずに試行錯誤を続けること
- AIを適切に信頼しつつ、責任は自分で持つこと
- 完璧を目指さず、まず形にすること
- セキュリティとプライバシーは継続的に改善すること
もし「作りたいものはあるけど、プログラミングできないから...」と諦めている人がいたら、この記事が背中を押せたら嬉しいです。
2025年、アイデアさえあれば誰でも開発者になれる時代です。
Gimmy: https://www.gimmy.jp/
X（フィードバック大歓迎）: https://x.com/konegi_dev
ぜひ使ってみてください。そして、感想を聞かせてください！
参考リンク
#AI開発 #個人開発 #非エンジニア #GithubCopilot #Flask #Supabase #駆け出しエンジニアと繋がりたい