英語が話せるようになりたい。でも、市販のアプリは何度も挫折してきました。

48歳、英語は中学初級レベル。発音アプリ、単語アプリ、会話アプリ……試した数だけ「自分にはちょっと合わない」と感じて続きませんでした。

でも実は、ゲーミングPCがあればYOLOが拍子抜けするほど簡単に動くのと同じで、いま「自分専用の学習アプリ」もコードをほとんど書かずに1時間で作れる時代になっています。

この記事では、私が Claude Code という開発エージェントだけを使って、自分の弱点に最適化された英語学習アプリを Azure 上にゼロから1時間で公開した、その流れをそのまま紹介します。

技術ブログというより「体験記」です。コマンドや設定の話はほとんど出てきません。代わりに、「AIに何をどう伝えれば、ここまでやってくれるのか」という肌感覚をお持ち帰りいただくのが目的です。

この記事のポイント（メリット）

• 「自分専用アプリ」を1時間で作って公開できる時代の手触りが分かる
• Claude Code（バイブコーディング）が”普通の人”にもどこまで効くか分かる
• 月額0〜数百円のクラウド構成例が分かる
• 学校の授業や、社内研修の題材としても使えるイメージが湧く

実物のURL：https://green-ground-0221e2500.7.azurestaticapps.net

※完成品は私の自分用なので、公開は予告なく止めるかもしれません。

前提：英語アプリが続かなかった48歳の話

私の英語レベルは、本当に中学初級です。たとえば外国の方に道を尋ねられて、「Where do you want to go?」がスッと口から出てきません。

仕事柄、英語の論文や仕様書を眺めることはありますが、リスニングは正直つらいです。「読めば分かる」のに「聞いたら分からない」のは、要するに 単語を音として把握できていない からだと、自分では分析していました。

これまで色々なアプリを試しました。ある程度続いた時期もあります。でも、

• 例文が「自分の生活では絶対に出てこない」シチュエーション
• 単語テストの出題順が、自分の苦手なところと噛み合っていない
• 「お手本→マイクで発音→採点」が欲しいのに、機能が別アプリに分かれている
• 進捗が見えにくくてモチベが続かない

など、細かい不満が積み重なって離脱してしまうのです。

そこで腹を括りました。「自分にちょうどいい英語学習アプリは、自分で作るしかない」と。

ただ、これまでなら「フルスタックで作るのは重い」「Azureのインフラ立てるだけで丸一日」という判断になっていたはずです。今回はそうなりませんでした。Claude Code に丸投げしたら、本当に1時間で公開まで終わった からです。

そもそもバイブコーディングとは？

最近よく聞く言葉ですが、初めて聞く方のために超ざっくり説明します。

バイブコーディング（Vibe Coding）は、開発者が「気分（Vibe）」だけを伝えて、コードはAIに書かせる開発スタイルです。

従来の開発が「設計書を書く → コードを書く → テストする → デプロイする」と段階を踏むのに対し、バイブコーディングは「やりたいことを自然な日本語でAIに伝える」だけ。AIがコードを書き、ファイルを作り、コマンドを叩き、エラーが出たら自分で直して、また進めます。人間は「何を作りたいか」「何が違うか」だけ言えばいい。

私が今回使った Claude Code は、Anthropic 社が出している開発エージェントです。ターミナルから claude と打つと立ち上がり、自然言語で指示するだけで、ファイル編集、コマンド実行、Azure CLIの呼び出し、Gitの操作まで全部やってくれます。

ポイントは、ただ「コードを生成するAI」ではなく、自分のPCで実際に手を動かしてくれる同僚のような存在になっていることです。

「Azureにリソースグループを作って、Static Web Apps と Functions と Cosmos DB と Speech と OpenAI を立てて、Next.js のプロジェクトを置いて、Functions に API を3本書いて、ビルドしてデプロイして」と一気にお願いしても、淡々とこなしてくれます。途中でハマっても、自分で原因を調べて、直して、進めてくれます。

これが、バイブコーディングが今ホットな理由です。

用意したもの（驚くほど少ない）

今回使ったのは、これだけです。

• Claude Code（Opus 4.7）：開発エージェント本体
• Azure CLI：Azureのコマンドラインツール（Claude Codeから呼ばれる）
• GitHubアカウント：コードを置く場所＋自動デプロイ用
• Azureアカウント：無料枠＋従量で月数百円の構成

Azureを選んだのは、無料枠が広く、Static Web Apps + Functions + Speech + Cosmos DB + OpenAI が 全部”ほぼ無料”で使えるから です。「とりあえず動かす」のに最適です。

なお、エディタも、コードの知識も、フレームワークの知識も、この1時間ではほぼ使いませんでした。横に置いていたターミナルにClaude Codeを立ち上げて、私が日本語で「英語が話せるようになりたい。中学初級レベル。聞く・話す・読むに特化したアプリにしたい」と打ち込んだ。最初の指示はそれだけです。

1時間でやったこと（時系列）

ここからが本題です。実際の1時間を、5つのフェーズに分けて振り返ります。

0〜10分：要件のキャッチボール

最初の10分間、Claude Codeとの会話はずっと「何を作りたいのか」の擦り合わせでした。

私の最初の指示はざっくりこうでした。

「英語が話せるようになりたい。48歳で中学レベル初級。音声で発話する機能や、英語が表示されてその日本語訳が回答として分かるアプリ。書けなくていい。聞く・話す・読むに特化。Azureにデプロイしてどこでも勉強できるように。習熟度に合わせて徐々にレベルを上げてほしい」

これに対して Claude Code は、要件を整理し、技術スタックの提案を返してきました。「フロントは Next.js でどうですか」「音声は Azure AI Speech、翻訳は Azure OpenAI、データは Cosmos DB、ホスティングは Static Web Apps が無料枠の組み合わせとして最適です」というように、選定理由つきで。

ここで人間がやることは、提案を読んで「OK、それで」と返すだけ。選定理由をAIが言語化してくれるので、後でブログに書くのも楽です（実際、この記事もそうやって作りました）。

10〜25分：Azure基盤がゼロから立ち上がる

OKと答えた瞬間から、Claude Code は Azure CLI を叩き始めました。

リソースグループを作り、Static Web Apps を作り、Speech リソースを作り、Cosmos DB（Serverless）を作り、Azure OpenAI に gpt-4o-mini をデプロイし、必要なキーを取って、SWAの環境変数にセットして……ここまで全部、私はターミナルで「OK」と返した数回以外、何もしていません。

途中、Windows の Git Bash 特有の罠（パス変換でCosmos DBのパーティションキー指定が壊れる、というちょい厄介な問題）にぶつかりましたが、Claude Code が自分で原因を特定し、MSYS_NO_PATHCONV=1 を頭に付けて回避してくれました。

このあたり、もし自分でAzure CLIを叩いていたら 間違いなく半日溶かしていた 場面です。AIに任せると、こういう”環境固有の罠”の調査時間がほぼゼロになるのが、一番ありがたい点でした。

25分後、ローカル開発環境が整い、まっさらな Next.js のページが Azure 上で表示されている、というところまで進みました。

25〜45分：5つの学習モードが揃う

次の20分で、アプリの中身が一気に出来上がりました。

私が指示したのはこういう内容です。

「ホーム画面に進捗カードを置いて、5つのモードに飛べるようにしてほしい。Reading（読む）はタップで日本語訳が出る。Listening（聞く）は音声を流して4択で答える。Speaking（話す）はお手本を再生して、マイクで真似して、発音を採点する。Conversation（会話）はAIと役割を分けて会話練習。Vocabulary（単語）はLeitner方式の間隔反復」

Claude Code は淡々とファイルを作り、ボタンを置き、Azure Speech SDK を組み込み、Functions に「Speechトークンを発行するAPI」「対話を生成するAPI」「進捗を保存するAPI」を3本書いて、Cosmos DB のスキーマを設計して、保存して、デプロイしてくれました。

私の役割は、できあがった画面をスマホで開いて触り、「お、ここはちゃんと音声出るな」「うわ、Listeningが英文丸見えで意味ないな」というフィードバックを言葉にして渡すこと。それだけです。

45分時点で、5つのモードがそれぞれ一応動く状態にはなりました。

45〜55分：自分で触ってフィードバック

ここが今回、いちばん面白かった10分です。

実際に自分でスマホで触ってみたら、完成しているはずなのに「うっすら違和感」がありました。Claude Code に率直にぶつけました。

「読むと聞くが同じ機能ですよね？　録音中は判定に入っているのか分からん。AIと会話練習も他と何が違うのか？　単語テストがあった方が良いですか？」

Claude Code は、これを 教育設計の問題として整理し直して くれました。「Reading は文字を見て意味を取る、Listening は耳の聞き取り、Speaking は口の動き、Conversation はその統合、Vocabulary は語彙――1モード=1技能で再設計しましょう」と。

そして、Reading から音声を削除し、Listening は答えるまで英文を見せないように改造し、Speaking は録音中の状態が見える可視化を入れ、Conversation は本当のロールプレイに作り直し、Vocabulary を新設してくれました。

機能がただ並んでいるアプリから、意図のあるアプリ に変わった瞬間でした。

55〜60分：弱点が単語に流れ込むループまで実装

最後の5分、もう1つ要望を出しました。

「まず、聞く力を身につけたい。でもそのためには単語も理解してないとダメですよね？　聞き取りで間違ったところから、単語の練習に反映できると良い。100点近く取れるようになったら、徐々にレベルを上げていく」

これに対するClaude Codeの応答は痺れました。「Listeningで不正解になった文を単語に分解して、まだマスターしていない単語だけ自動的に復習キューの先頭に入れる仕組みにしましょう」と提案してきて、その場で実装してくれたのです。

これで、「聞き取れない → 単語の復習に流れ込む → 単語が分かるようになる → 聞き取れる文が増える → レベルが上がる → また知らない単語に出会う」という 学習ループ がアプリ内に完成しました。

時計を見たら、ぴったり1時間でした。

出来上がったアプリでできること

具体的に、どんなことができるアプリになったかをご紹介します。

📖 Reading（読む） 英文をタップすると日本語訳が出るシンプルなモード。音声はあえて出ません。「黙読で意味が取れたか」だけにフォーカスしています。

🎧 Listening（聞く） 大きな🔊ボタンだけが画面にあって、音声を聞いて4択で意味を答えます。ゆっくり再生ボタン付き。答えるまで英文は見せません。耳だけで取る練習に集中できます。間違うと、その文に含まれる単語のうち、自分がまだ習得していないものが自動的に単語の復習リストに追加されます。

🎤 Speaking（話す） お手本を聞いてからマイクで真似して、Azureの発音評価機能で採点します。録音中はリアルタイムで「いま自分の声が何と聞こえているか」が画面に出るので、「録音されてる感」がしっかりあります。結果は単語ごとに緑/黄/赤で色分けされて、どこの発音が弱いか一目で分かります。

💬 Conversation（会話） AIが相手役（B役）になって音声で話しかけてきます。私はA役として、画面に出ている英文を音読し、発音を採点される。3技能（聞く・話す・読む）を統合したモードです。

📝 Vocabulary（単語） Leitner方式という、5段階のボックスで間隔反復する単語学習モード。正解すると次のボックス（次の復習は先になる）、不正解だとボックス1（10分後にまた出る）に戻ります。Listeningで間違えた文の単語が、ここの先頭に流れ込みます。

そして全モード共通で、レベル（Lv1〜6）が 直近の正答率に応じて自動で上下 します。「85%以上で次のレベルへ」というように。萎えない閾値設計をAIに考えてもらいました。

スマホで開けば、画面下にタブが並んでいて、5つのモードを行き来できます。ブラウザで開くだけのPWAなので、アプリストアからインストールする必要もありません。

ハマりどころと、AIに任せるという感覚

正直に書きますと、1時間まったくスムーズだったわけではありません。

途中でハマったのは、たとえばこんなところです。

• Windows の Git Bash で Azure CLI を叩くと、パスが勝手に変換される問題：パーティションキーの /level が C:/Program Files/Git/level に変換されて、Cosmos DB のコンテナ作成が失敗していました
• /node_modules の .gitignore が浅かった問題：ルートだけ書いていたら、サブディレクトリ（api/node_modules）がGitに乗ってしまっていました
• Speech SDK が約1MBあって初期表示が重い問題：ボタンを押した瞬間に動的importする方式に切り替えました

これらは全部、Claude Code が自分で気づいて、自分で直しました。私はターミナルを眺めていただけです。

このときに感じたのは、人間の役割は「何を作りたいか」「何が違うか」を言葉にすること に集中していくのだな、ということでした。コードを書ける／書けないの問題ではなく、自分の頭の中をどれだけ言語化できるか が、出来上がるものの質を決めます。

逆に言えば、エンジニアじゃない方でも、「使ってみたら、ここがちょっとイケてない」と言葉にできる人なら、自分専用のアプリは作れる時代に入った、ということです。

いくらかかってる？（月額0〜数百円）

ここ、気になる方が多いと思います。今回の構成の月額コストはこちらです。

• Static Web Apps：Free プラン → 0円
• AI Speech：F0（無料枠：TTS 5時間／STT 5時間/月） → 0円
• Azure OpenAI（gpt-4o-mini）：従量課金 → 数十円〜数百円（個人利用ならほぼ気にならない）
• Cosmos DB：Serverless → 数円〜数十円

ざっくり 月額0〜数百円 です。コーヒー1杯より安く、自分専用の学習アプリを持てる計算になります。

真似してみたい人への3ステップ

ここまで読んで「自分もやってみたい」と思った方へ、最短ルートを置いておきます。

ステップ1：環境を用意する Claude Code を入れて、Azure CLI をインストールして、Azureアカウント（無料枠あり）と GitHub アカウントを用意します。準備時間は10〜20分くらいです。

ステップ2：「何を作りたいか」を、できるだけ具体的に書き出す これが一番大事です。一行でもいいので、「自分が困っていること」「それをどう解決したいか」「こんなふうに動いてほしい」を日本語で書いてみてください。私の最初の指示も、たった4行でした。

ステップ3：Claude Code を立ち上げて、その文章をそのまま貼る あとはAIが返してくる提案に「OK」「これは違う」「こうしてほしい」と返すだけです。1時間タイマーをセットして、出来上がるまで横で眺めましょう。

うまくいかなくても大丈夫です。バイブコーディングの練習として、まず「自分が一番欲しいツール」を1個作ってみるのが、一番手応えが出ると思います。

まとめ：もう市販アプリには戻れない

1時間。ほぼ会話だけ。月額0〜数百円。それで、自分の弱点に完全に最適化された英語学習アプリが手元に来ました。

• 自分のレベルにピッタリの例文が出る
• 自分が間違えた単語が、優先的に復習に流れ込む
• 自分が好きなUIで、自分が一番見やすい配色で
• 自分専用なので広告もない、課金もない

正直なところ、これを体験してしまうと、もう市販の学習アプリには戻れません。「自分にとって完璧なアプリ」は、もう自分で作るのが一番早い時代に入った、と感じました。

英語学習に限った話ではありません。家計簿、タスク管理、レシピ管理、子育て記録――「市販アプリだとちょっと違う」と感じている領域があるなら、そこは全部、Claude Code で1時間ほど話し合えば自分専用のものが作れる はずです。

私自身、これからも自分の生活を観察して、「ちょっと違う」を見つけたら、その場で作る習慣をつけていこうと思っています。

【追記】これは授業の教材にもなる

最後にひとつだけ。私はAI coordinatorとして、学校・自治体向けの教材も手掛けています。今回の体験を授業に置き換えると、こんな絵が描けます。

• 中高生が「自分の苦手分野（英単語、漢字、地理、計算）」を題材に、自分用のドリルアプリを作る
• 1コマ50分の授業で「要件を書き出す → AIに渡す → 出来上がりを触ってフィードバック」を体験する
• 「自分の困りごとを言語化する力」「AIに任せる力」「結果を評価する力」が同時に鍛えられる

プログラミングを教えるのではなく、プログラミングをAIに任せる側に回る訓練 が、これからの情報・探究の授業でますます大事になっていきます。

教育機関の方で「うちの授業でこういうのを試したい」というご要望があれば、AI coordinator のお問い合わせ窓口からお気軽にご連絡ください。教材化のご相談、お受けしています。