AIを使って Webアプリを作成することは、2025〜2026年の時点でかなり一般的になってきています。ソフトウェア開発者の多くが日常的にAIを利用しているという調査があります。65％以上が開発でAIに依存している、という報告もあります。これはコード生成・補助・効率化のためです。つまり、AIは単なる実験ではなく、現実の開発現場でかなり使われているという状況です。
AIベースツールの拡大
Google は「AIでWebアプリを作るプラットフォーム」を提供しており、プログラミング経験がなくてもアイデアを形にできるツールが登場しています。また、vibe codingのように、自然言語指示でアプリやWebサイト生成を行う開発手法が浸透し、企業でも注目されています。AIを使って最初のプロトタイプを作る、あるいはコーディングの一部をAIに任せて高速化する、という方法が業界で広がっています。ノーコード／ローコード＋AIの組み合わせで、専門知識が浅い人でもWebアプリ作成が可能になっています。
ただし「完全にAIだけで完結」はまだ課題あり
AIはコード生成や補助に強い一方で、完全自動で高品質な本番用アプリを作るにはまだ人間のチェックが必要という研究もあります（AI生成アプリの品質評価などの論文でも提示）。つまり、AIは「効率化」「プロトタイピング」「補助」で非常に一般的に使われているが、人間のエンジニアがいなくていい、というレベルまでは完全には達していない、というのが現状です。
AIでWEBアプリを作ってみよう。
ドルを円に換算するWEBアプリをAIで作成してみましょう。
円とドルの変換できるWEBアプリを作成してください。
入力ボックスは２つ
1) １ドル=[ ]円
2) [ ]ドルは？
上記１と２に入力して、「変換」ボタンを押すと、ドルを円に換算できる
ファイルは１つにまとめてください。発生したコードでHTMLファイルを作成し、ブラウザで見てみよう。
このHTMLファイルをサーバーにアップロードして、ブラウザで見てみよう。
- 入力枠のサイズを変更したり、表示を変更したりしてみよう。
- 円を入力して、何ドルかがわかる機能を付加してみよう。
簡単なゲームを作ってみよう
簡単なゲームを作って、少しずつカスタマイズしてみよう。
AとBの2人で遊べるゲームのWEBアプリを作成してください。
マス目が15ある。
一番左が1、一番右が15
1マス目には「スタート」の文字
2マス目には「ゴール」の文字
AもBも最初は１マス目にいる。
Aがサイコロを投げ、投げた数だけ左にマス目を進む。
Bがサイコロを投げ、投げた数だけ左にマス目を進む。
少ない数でゴールに到達した方が勝利。
ボタンは、AボタンとBボタンの２つ以下のようなゲームに変えるにはどのような指示をしたらよいでしょうか？
https://nishikawa.site/EducationalApp/game.html
最終課題：あなた独自のアプリを作成してみよう
この授業の最終課題は、AIを活用して、あなたの独自のアプリを作成してください。他のひとと違う独自性を示してください。
完成したファイルは、名前を myapp.html として、サーバーにアップロードしてください。
コメント