<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>AIコーディング | IMEER LAB｜Excel・AI・自動化ブログ</title>
	<atom:link href="https://lab.imeer.jp/tag/ai%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0/feed/" rel="self" type="application/rss+xml" />
	<link>https://lab.imeer.jp</link>
	<description>VBA・ChatGPT・WordPress、ときどき猫。</description>
	<lastBuildDate>Mon, 18 May 2026 14:46:31 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	

<image>
	<url>https://lab.imeer.jp/wp-content/uploads/2026/05/cropped-847f523550b64f03abd735470ce0664c-32x32.jpg</url>
	<title>AIコーディング | IMEER LAB｜Excel・AI・自動化ブログ</title>
	<link>https://lab.imeer.jp</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>AIに丸投げしないWebアプリ開発ログ</title>
		<link>https://lab.imeer.jp/ai-webapp-development-log/</link>
					<comments>https://lab.imeer.jp/ai-webapp-development-log/#respond</comments>
		
		<dc:creator><![CDATA[Nori]]></dc:creator>
		<pubDate>Mon, 11 May 2026 15:22:44 +0000</pubDate>
				<category><![CDATA[AI活用]]></category>
		<category><![CDATA[ChatGPT活用]]></category>
		<category><![CDATA[GPTs活用]]></category>
		<category><![CDATA[AIコーディング]]></category>
		<category><![CDATA[ChatGPT]]></category>
		<category><![CDATA[Codex]]></category>
		<category><![CDATA[GPTs]]></category>
		<category><![CDATA[Webアプリ開発]]></category>
		<category><![CDATA[個人開発]]></category>
		<guid isPermaLink="false">https://lab.imeer.jp/?p=609</guid>

					<description><![CDATA[今回は、CodexとGPTsを使ってWebアプリを作ったときの実践ログです。 最初は、AIに任せればWebアプリ開発はかなり楽になると思っていました。 実際、Codexを使えばコードはどんどん出てきます。GPTsに相談す [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>今回は、CodexとGPTsを使ってWebアプリを作ったときの実践ログです。</p>



<p>最初は、AIに任せればWebアプリ開発はかなり楽になると思っていました。</p>



<p>実際、Codexを使えばコードはどんどん出てきます。<br>GPTsに相談すれば、設計や改善案も返ってきます。</p>



<p>ただ、しばらく進めてみて感じたのは、<strong>AIに任せっぱなしにすると、少しずつ方向性がズレていく</strong>ということでした。</p>



<p>コードは動く。<br>でも、最初に作りたかったものとは少し違う。</p>



<p>指摘もそれっぽい。<br>でも、全部反映すると逆に複雑になる。</p>



<p>そこで途中から、CodexとGPTsの役割を分けて使うようにしました。</p>



<p>この記事では、Webアプリ制作で実際に試した次の流れをまとめます。</p>



<ul class="wp-block-list">
<li>GPTsで設計する</li>



<li>Codexで製造する</li>



<li>GPTsでレビューする</li>



<li>人間が指摘事項を確認する</li>



<li>Codexで修正する</li>
</ul>



<p>AIに丸投げするのではなく、<strong>AIを使いながら、人間が方向性を補正していく開発ログ</strong>として読んでもらえればと思います。</p>




  <div id="toc" class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-2" checked><label class="toc-title" for="toc-checkbox-2">目次</label>
    <div class="toc-content">
    <ol class="toc-list open"><li><a href="#toc1" tabindex="0">最初は「Codexに作ってもらえば早い」と思っていた</a></li><li><a href="#toc2" tabindex="0">AIに任せるほど、人間の判断が必要になる</a></li><li><a href="#toc3" tabindex="0">実際に使った開発フロー</a></li><li><a href="#toc4" tabindex="0">やってみて感じたメリット</a></li><li><a href="#toc5" tabindex="0">逆にハマったポイント</a><ol><li><a href="#toc6" tabindex="0">「いい感じに直して」は危険だった</a></li></ol></li><li><a href="#toc7" tabindex="0">まとめ：AIは作業者、人間は判断者</a></li><li><a href="#toc8" tabindex="0">次に試したいこと</a></li><li><a href="#toc9" tabindex="0">関連リンク</a></li></ol>
    </div>
  </div>

<h2 class="wp-block-heading"><span id="toc1">最初は「Codexに作ってもらえば早い」と思っていた</span></h2>



<p>Webアプリを作るにあたって、最初に期待していたのはCodexでした。</p>



<p>ざっくり仕様を伝えれば、画面や処理を作ってくれる。<br>エラーが出ても、貼り付ければ修正案を出してくれる。</p>



<p>自分でゼロから書くより、かなり早く進められそうだと感じました。</p>



<p>実際、初速はかなり速かったです。</p>



<p>特に、画面のたたき台やフォーム作成のような「ゼロから作ると面倒な部分」は、かなりスムーズに進みました。</p>



<p>ただ、進めていくうちに少しずつ違和感も出てきました。</p>



<ul class="wp-block-list">
<li>動くけど、ちょっと意図と違う</li>



<li>修正してもらったら、別の場所まで変わっている</li>



<li>便利そうな機能が追加されたけど、今回はいらない</li>



<li>コードは増えたけど、保守しにくくなってきた</li>
</ul>



<p>こういうズレが、じわじわ増えていきました。</p>



<h2 class="wp-block-heading"><span id="toc2">AIに任せるほど、人間の判断が必要になる</span></h2>



<p>このあたりで、少し考え方が変わりました。</p>



<p>AIを使うと、作業スピードは上がります。<br>でも、スピードが上がるぶん、判断しないまま進む危険もあります。</p>



<p>たとえば、AIが出してきた改善案は、ぱっと見かなり正しそうに見えます。</p>



<ul class="wp-block-list">
<li>この処理は分離したほうがよい</li>



<li>エラーハンドリングを追加したほうがよい</li>



<li>UIを改善したほうがよい</li>



<li>状態管理を見直したほうがよい</li>



<li>共通化したほうがよい</li>
</ul>



<p>どれも間違ってはいません。</p>



<p>ただ、今回の規模や目的に対して本当に必要かは別です。<br>全部反映すると、かえって大げさな作りになることもあります。</p>



<p>そこで考え方を変えました。</p>



<p><strong>AIに判断まで任せるのではなく、AIには役割を与える。</strong><br><strong>そして、最後の判断は人間が持つ。</strong></p>



<p>この形にしたほうが、Webアプリ制作は安定しました。</p>



<h2 class="wp-block-heading"><span id="toc3">実際に使った開発フロー</span></h2>



<p>最終的に落ち着いた流れは、次のような形です。</p>



<figure class="wp-block-image size-large"><img fetchpriority="high" decoding="async" width="1024" height="377" src="https://lab.imeer.jp/wp-content/uploads/2026/05/image-2-1024x377.png" alt="" class="wp-image-619" srcset="https://lab.imeer.jp/wp-content/uploads/2026/05/image-2-1024x377.png 1024w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-2-300x110.png 300w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-2-768x283.png 768w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-2.png 1355w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p>ポイントは、<strong>Codexだけで完結させないこと</strong>です。</p>



<p>Codexに作らせる。<br>その結果をGPTsに見せる。<br>GPTsの指摘を人間が確認する。<br>必要な指摘だけ整理してCodexに戻す。</p>



<p>この流れにすると、AIの出力に流されにくくなりました。</p>



<h2 class="wp-block-heading"><span id="toc4">やってみて感じたメリット</span></h2>



<p>この流れにしてから、開発はかなり安定しました。</p>



<p>特に良かったのは、次の3点です。</p>



<ul class="wp-block-list">
<li>開発の初速がかなり上がる</li>



<li>GPTsを設計役にすると迷子になりにくい</li>



<li>レビュー役を分けると冷静に見直せる</li>
</ul>



<p>Codexが作ったコードを、自分だけで確認していると見落としがあります。</p>



<p>特に、動いてしまうと「まあいいか」と思いがちです。</p>



<p>そこにGPTsレビューを挟むと、一度立ち止まるきっかけになります。</p>



<p>自分では見逃していた命名の違和感や、処理の重複、画面構成のズレに気づくこともありました。</p>



<p>もちろん、GPTsの指摘を全部採用するわけではありません。<br>むしろ、採用しない判断もかなり大事です。</p>



<p>レビュー役として使いながら、最終的には自分で取捨選択する。<br>この距離感がちょうどよかったです。</p>



<h2 class="wp-block-heading"><span id="toc5">逆にハマったポイント</span></h2>



<h3 class="wp-block-heading"><span id="toc6">「いい感じに直して」は危険だった</span></h3>



<p>Codexに対して、</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
<p>このあたりをいい感じに直してください</p>
</blockquote>



<p>と依頼したくなる場面があります。</p>



<p>ただ、この指示はかなり危ないです。</p>



<p>AIにとっての「いい感じ」と、自分が考えている「いい感じ」は違います。</p>



<p>実際、曖昧な指示を出すと、想定より広い範囲が変更されることがありました。</p>



<p>たとえば、少しだけUIを直してほしかったのに、処理の構造まで変わっていたり。<br>一部の文言を整えたかっただけなのに、コンポーネント全体が書き換わっていたり。</p>



<p>動けば問題ないように見えます。<br>でも、あとから差分を見ると「そこまで変えてほしいわけではなかった」と感じることがありました。</p>



<p>それ以降は、なるべく具体的に書くようにしました。</p>



<ul class="wp-block-list">
<li>変更してほしいファイル</li>



<li>触ってほしくない箇所</li>



<li>修正してほしい範囲</li>



<li>期待する動作</li>



<li>変更後に確認したいポイント</li>
</ul>



<p>AIに自由度を与えすぎない。<br>これも今回学んだポイントです。</p>



<h2 class="wp-block-heading"><span id="toc7">まとめ：AIは作業者、人間は判断者</span></h2>



<p>CodexとGPTsを使うことで、Webアプリ開発のスピードはかなり上がりました。</p>



<p>ただ、実際にやってみると、<strong>AIにすべて任せればうまくいく</strong>という感じではありませんでした。</p>



<p>むしろ、AIを使うほど、人間が方向性を持っておくことが大事になります。</p>



<p>今回うまく回った流れは、次の形です。</p>



<figure class="wp-block-image size-large"><img decoding="async" width="1024" height="166" src="https://lab.imeer.jp/wp-content/uploads/2026/05/image-3-1024x166.png" alt="" class="wp-image-621" srcset="https://lab.imeer.jp/wp-content/uploads/2026/05/image-3-1024x166.png 1024w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-3-300x49.png 300w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-3-768x124.png 768w, https://lab.imeer.jp/wp-content/uploads/2026/05/image-3.png 1352w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p>この流れにしたことで、AIの回答をそのまま採用するのではなく、方向性を補正しながらWebアプリを作ることができました。</p>



<p>AIに丸投げしない。<br>でも、AIはしっかり使う。</p>



<p>今のところ、個人開発でAIを使うなら、このくらいの距離感がいちばん続けやすいと感じています。</p>



<h2 class="wp-block-heading"><span id="toc8">次に試したいこと</span></h2>



<p>最初は、「AIがコードを書く時代なら、人間は何をするんだろう」と思っていました。</p>



<p>ただ、実際にやってみると、必要だったのは「AIを使いこなすこと」だけではなく、<strong>AI同士の役割分担を設計すること</strong>でした。</p>



<p>AIに全部任せるのではなく、AIごとに役割を分けながら、人間が方向性を持つ。</p>



<p>今後の個人開発では、この考え方がかなり重要になっていく気がしています。</p>



<p>次は、CodexとGPTsを使った開発で「どこまで設計書を作るべきか」や、「AIレビューの指摘をどう取捨選択するか」も試してみたいところです。</p>



<h2 class="wp-block-heading"><span id="toc9">関連リンク</span></h2>



<p><a href="https://note.com/nori_tech/n/n9626f9e2580d">AI開発をする上でのITエンジニアの意義とは？｜nori</a></p>
]]></content:encoded>
					
					<wfw:commentRss>https://lab.imeer.jp/ai-webapp-development-log/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
