「AIとペアプロしてサクサク個人開発!」
……なんて華々しいSNSの投稿を見るたび、「いやいや、現場はそんなスマートにいかないから!」と心の中でツッコミを入れたくなる今日この頃です。
今回は、このRui Toolsの開発中に直面した、笑っちゃうくらい地味で、だけど当事者としては「マジか…」と頭を抱えたトラブルと、その泥臭すぎる回避劇をシェアしたいと思います。同じようにAIツールと格闘しながら個人開発をしている仲間の参考(あるいは笑い話の種)になれば嬉しいです。
1. 事件の発生:スマートにいかないAI開発
事件が起きたのは、Rui Toolsの開発ルールやエージェント用の指示書をGeminiで策定していたときのことでした。
Geminiが出力してくれたMarkdownドキュメントが完璧だったので、「よし、これをコピペして設定完了!」と意気揚々とコードブロック右上の「コピー」ボタンをポチッと押したんです。
で、エディタを開いてペーストしてみたら……あれ?
後半に書かれていたはずの超重要なルールが、ごっそり消えている。
「え、クリップボード壊れた?」と思ってチャット画面を二度見しました。
すると、とんでもない光景が目に入ったのです。
なんと、コードブロックの黒い枠が途中でプツリと千切れ、本来ならコード枠の中に収まっているはずの後半部分が、枠の外に『普通のWebテキスト』としてドバッと漏れ出していたのです。完全にチャットUI側のMarkdownパーサーが誤作動を起こしていました。
コピーボタンは「黒枠の中身」しか拾ってくれません。枠外に漏れ出た後半部分がクリップボードに入らないのは当然です。
「じゃあ手動でドラッグして選択コピーするか」とマウスでなぞってみたものの、チャットUIのレイアウト崩れに引っ張られて選択範囲がガタガタに……。画面上で全文をコピーすることすら許されない、地味に精神を削られる状況に陥りました。
2. 泥臭い救出作戦:Googleドキュメント経由ハック
せっかくAIが吐き出してくれた長文の完璧な指示書です。ここで「もう一回出して」とプロンプトを打ち直すのも負けた気がするし、同じバグが再発する未来しか見えません。
そこで私がとった行動がこれです。
- 回答ブロック下部にある「Googleドキュメントにエクスポート」を実行。
- 別タブでGoogleドキュメントを開く(枠から漏れ出たテキストもすべてドキュメント内に流し込まれている)。
- メニューから「ファイル ➔ ダウンロード ➔ Markdown(.md)」でローカル保存。
- 落ちてきた
.mdファイルをエディタで直接開いて全文を救出!
ローカルでファイルを開き、無事に全文が揃っているのを確認した瞬間、画面の前で思わず苦笑いしてしまいました。
「最新の生成AIを駆使して最先端の開発をしているはずなのに、やってる作業、めちゃくちゃ泥臭くないか!?」と。
でも、個人開発の現場なんていつだってこんなものです。動けば正義、救出できればこちらの勝ちです。
3. 原因の特定とスマートな解決策:犯人はお前か
無事にテキストを救出した後、冷めた頭でコードブロックを観察してみました。
「そもそも、なんであの位置でコード枠が突然千切れたんだろう?」
千切れた境界線の直前をじっくり見てみると……いました、犯人が。
セクションの区切り線として使っていた、半角ハイフン3つの水平線記号(---)です。
チャットUI側のMarkdownパーサーが、コードブロック(バッククォート3つの内側)にあるはずの --- を、Markdownのブロック区切り命令として過剰に解釈し、コード枠を強制終了させてしまっていたのです。
原因さえ分かってしまえば、解決策は拍子抜けするほどシンプルでした。
指示書内の区切り記号を、パーサーが水平線と誤認しにくい ===(イコール3つ) に変更する。
修正したテンプレートで再度Geminiに出力させてみると……見事にコードブロックは千切れることなく、最初から最後まで1つの黒枠の中にすっぽり収まりました!
コピーボタンを一発押すだけで、全文が綺麗にクリップボードに入ってきた瞬間は、思わずデスクで「よしっ!」と小さくガッツポーズしてしまいました。
4. まとめ:現場の泥臭い工夫こそ、個人開発の醍醐味
AIツールを使えば、コードもドキュメントも一瞬で生成できる時代になりました。
けれど、実際にツールを組み合わせてプロダクトを形にしようとすると、今回みたいなUIパーサーの気まぐれや、レンダリングの不具合といった「現場のリアルな落とし穴」に必ず足を取られます。
でも不思議なことに、あとから振り返って一番面白くて愛着が湧くのって、こういう泥臭いトラブルシューティングの瞬間だったりするんですよね。
教科書通りのスマートな開発なんてどこにもなくて、みんなどこかで笑っちゃうような裏技を使いながら前へ進んでいるのだと思います。
もしあなたも、GeminiやAIチャットのコード枠が途中で千切れて「コピーボタンで後半が取れない!」と画面の前で頭を抱えたときは、ぜひコード内の区切りを === に変えてみてください。
それだけで、あの不毛なGoogleドキュメント経由ハックとおさらばできるはずですから!