こんにちは。私は東京世田谷区に住んでいる「用賀じゅんちゃんおじさん」です。
生成AIプログラミングは完全に実用レベルになっています
2026年8月現在、生成AIをつかったプログラミングは完全に実用レベルに達しています。
普通のひと、プログラミングをしたことがない一般の人はびっくりおどろくレベルに進化しています。
おおげさではなく、まったく勉強なんかする必要なく誰でも自然な日本語でプログラミングができる環境が無料で提供されているのが現在の状況で、それをみんなはまだ知らないだけです。
本当になんでも自由に自分がかんがえたプログラムがつくれます。
しかしそう言われても、それだとなにから手をつけてよいか迷ってしまい思考も手も止まってしまうので、
とりあえず私（じゅんちゃんおじさん）の考えた例題をいっしょにみながら、
さっそくためしてみましょう！
今回は Google という会社の生成AI【 Gemini 】をつかいます。
（無料です。ブラウザから使えます。ログインしなくても使えます。ログインすると生成結果が残せたり、AIの品質を選べたりします）
生成AIの使用、無料提供されているWebサービスの利用は、使用条件、使用許諾、免責事項について各自でかならず確認して問題がないか納得してから使用してください
Gemini の最初のページに表示されている「Geminiに相談」とかいてある入力欄に、以下の日本語文章を貼り付けます
（直接その場で入力しても大丈夫ですが、ほかのメモ帳などの場所に書いておいて文章を完成させてから、コピー貼り付けするほうが良いです）
そして決定キー（return）を押します（または↑送信ボタン）
はじめての一番簡単なAIプロンプト
あなたはWebプログラマーです。JavaScriptが埋め込まれたHTMLファイルを作成してください。
JavaScript のコードは、
1.「あなたの名前は？」 と質問する入力ボックスと決定ボタンを表示します。
2. 決定ボタンが押されたあと、いま入力された名前と「さん は かわいい です！」
という文字を組み合わせた一行テキストにして画面に表示します。
さっき使用した入力ボックスと決定ボタンは消去します。
生成されたHTMLファイル ↓
◆ 「生成結果1」が実際に動作しているページ→https://junji.jp/net/junchan01.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>名前入力アプリ</title>
<style>
body {
font-family: sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
background-color: #f9f9f9;
}
.container {
text-align: center;
background: #ffffff;
padding: 30px;
border-radius: 8px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
input[type="text"] {
padding: 8px;
font-size: 16px;
margin-right: 8px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
padding: 8px 16px;
font-size: 16px;
background-color: #ff69b4;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #ff1493;
}
#result {
font-size: 20px;
font-weight: bold;
color: #333;
}
</style>
</head>
<body>
<div class="container">
<!-- 入力フォームエリア -->
<div id="form-area">
<label for="nameInput">あなたの名前は？</label>
<br><br>
<input type="text" id="nameInput" placeholder="名前を入力">
<button id="submitBtn">決定</button>
</div>
<!-- 結果表示エリア（初期状態は空） -->
<div id="result"></div>
</div>
<script>
// DOM要素の取得
const submitBtn = document.getElementById('submitBtn');
const nameInput = document.getElementById('nameInput');
const formArea = document.getElementById('form-area');
const resultDiv = document.getElementById('result');
// 決定ボタンがクリックされたときの処理
submitBtn.addEventListener('click', function() {
const name = nameInput.value.trim();
// 名前が入力されているかチェック
if (name === '') {
alert('名前を入力してください！');
return;
}
// 入力ボックスと決定ボタンを削除する
formArea.remove();
// 「[名前] さん は かわいい です！」というテキストを表示する
resultDiv.textContent = `${name} さん は かわいい です！`;
});
</script>
</body>
</html>
指示を追加してプログラムらしくしてみる
生成AIのプログラミングは、生成された結果に対してすこしづつ何度も修正指示を追加してつづけていくやり方もありますが、今回はわかりやすくするために新規の最初の1回目の指示（AIプロンプト）を書き直す方法にしています。
最初に書いたプロンプトの吹き出しのところに「プロンプトを編集」というボタンがありますので、前回の内容を消して、今回の内容を貼り付けて実行してみましょう。
あなたはWebプログラマーです。JavaScriptが埋め込まれたHTMLファイルを作成してください。
JavaScript のコードは、
1.「あなたの名前は？」 と質問する入力ボックスと決定ボタンを表示します。
2. 決定ボタンが押されたあと、いま入力された名前と「さん は かわいい です！」
という文字を組み合わせた一行テキストにして、画面内のランダムな座標に30回表示します。
1回の表示に0.2秒かけます。
そのとき、さっき使用した入力ボックスと決定ボタンは消去します。
◆ 「生成結果2」が実際に動作しているページ→https://junji.jp/net/junchan02.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ネームメッセージ表示</title>
<style>
body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
font-family: sans-serif;
background-color: #f9f9f9;
display: flex;
justify-content: center;
align-items: center;
}
#form-container {
text-align: center;
background: white;
padding: 30px;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
input[type="text"] {
padding: 8px;
font-size: 16px;
margin-right: 8px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
padding: 8px 16px;
font-size: 16px;
background-color: #ff69b4;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #ff1493;
}
.floating-text {
position: absolute;
font-size: 20px;
font-weight: bold;
color: #ff1493;
white-space: nowrap;
pointer-events: none;
opacity: 0;
transition: opacity 0.2s ease;
}
</style>
</head>
<body>
<div id="form-container">
<label for="username">あなたの名前は？</label><br><br>
<input type="text" id="username" placeholder="名前を入力">
<button id="submit-btn">決定</button>
</div>
<script>
const submitBtn = document.getElementById('submit-btn');
const usernameInput = document.getElementById('username');
const formContainer = document.getElementById('form-container');
submitBtn.addEventListener('click', () => {
const name = usernameInput.value.trim();
if (!name) {
alert('名前を入力してください！');
return;
}
// 入力フォームを消去
formContainer.remove();
let count = 0;
const maxCount = 30;
// 0.2秒ごとにランダムな座標へテキストを表示
const timer = setInterval(() => {
if (count >= maxCount) {
clearInterval(timer);
return;
}
const textElement = document.createElement('div');
textElement.className = 'floating-text';
textElement.textContent = `${name} さん は かわいい です！`;
// 画面内のランダムな座標を計算（はみ出し防止のためマージンを考慮）
const maxX = window.innerWidth - 300;
const maxY = window.innerHeight - 50;
const randomX = Math.max(10, Math.floor(Math.random() * maxX));
const randomY = Math.max(10, Math.floor(Math.random() * maxY));
textElement.style.left = `${randomX}px`;
textElement.style.top = `${randomY}px`;
document.body.appendChild(textElement);
// 少し遅延させてフェードインさせる
setTimeout(() => {
textElement.style.opacity = '1';
}, 10);
count++;
}, 200);
});
</script>
</body>
</html>
プログラムを拡張。さらにいろいろ付け足してみる
あなたはWebプログラマーです。JavaScriptが埋め込まれたHTMLファイルを作成してください。
JavaScript のコードは、
1.「あなたの名前は？」 と質問する入力ボックスと決定ボタンを表示します。
2. 決定ボタンが押されたあと、いま入力された名前と「さん は ＠＠＠ です！」
という文字を組み合わせた一行テキストにして、画面内のランダムな座標に30回表示します。
1回の表示に0.2秒かけます。文字の大きさはすこし大きめ。色もランダムに変えます。
そのとき、さっき使用した入力ボックスと決定ボタンは消去します。
テキストの ＠＠＠ の部分は以下の単語のうちの一つをランダムで使います。
「 天才 えらい かわいい かっこいい すてき 素直 こころがきれい やさしい 純粋 まじめ 」
画面の左上に「 1/30 」という形で回数を表示し、表示するたびにカウントを増加させます。
30回表示が終わったら、画面中央に大きなひときわ目立つ文字で「おしまい」と表示し、
クラッカーが鳴り、紙吹雪が舞い、拍手喝采の画面演出効果を表示します。
◆ 「生成結果3」が実際に動作しているページ→https://junji.jp/net/junchan03.html
ここまですべて、自然な日本語による「指示」だけでプログラム開発がすすんでいるのが理解できたと思います。HTMLの知識も、JavaScriptの知識も、まったく用いていません。
驚きのさらに上をいく。生成AIが「提案してくれる」
指示（プロンプト）をあたえてhtmlが生成されたあとに、さらに生成AIが「文字を回転させたらイイ感じかもしれませんよ？」「文字が浮かび上がるような演出エフェクトもあるけどどうします？」というような「提案」をしてきてくれました。
じゃあ、「それを追加したhtmlを出力して」と指示して生成されたのがこちら
◆ 「生成結果4」が実際に動作しているページ→https://junji.jp/net/junchan04.html
これまでプログラミングを知らなかった一般の「普通の人」にこそはかりしれない大きな恩恵がある大発明。普通の人にこそ使ってほしい新しいプログラミング方法の世界
プログラミング？ なにそれ？ 知らない、わかんないし、興味ないもん 勉強したくない 🤷♀️
それでもだいじょうぶ 🙆♂️ という時代がすでにやって来ていたのです。
勉強も予習もひつよう無し。謎の英単語を半角文字で打ち込む必要もありません。
すごいパソコンも、すごい開発アプリも必要なし。
日常で話している日本語で、ほんとうにふつうの日本語だけでプログラムがつくれちゃうのです。
2026年夏、現実にそういう時代になっているのをまだ気がつかないでいるひとにむけて、
この記事を書きました。
用賀じゅんちゃんおじさん 2026年8月
用賀じゅんちゃんおじさん（すずきじゅんじ）自己紹介
はじめまして こんにちは。私は東京世田谷区に住んでいる「用賀じゅんちゃんおじさん」です。本名は「すずきじゅんじ」です。昔はゲーム業界にもいたことがあり、現在は個人アプリ開発者として仕事をしながら地元の地域活動「交通安全みまもりゴミ拾い」を毎日しています。
アプリの実績は自分ひとりで開発したものだけで世界500万ダウンロードくらいです。
「 AI 」技術全般（生成AI、AIコーディング、AIエージェント、他）には考えなければいけない問題点、警戒が必要な点が複数あります。
また、それは、立場や視点によってもいろいろ異なったり増えたりします。（国、企業、個人、教育、おとな、こども、倫理、権利、経済性、etc...）
検索するとAIについて、そのようなあれこれについて論じてくれている記事が見つかると思います。
今回は話をわかりやすくするため触れませんでしたが、今後それについてもどこかで何か書こうと思っています