「Claude Codeを使えば、プログラミング初心者でもアプリを作れるらしい」
そんな話を聞いて興味を持っても、実際に始めようとすると、
「そもそも何をインストールすればいい？」
「黒い画面に文字を入力するのが怖い……」
「プログラミング経験がなくても本当に使える？」
と不安になる人もいるのではないでしょうか。
私自身もプログラミング初心者です。普段から生成AIは使っていますが、自分でコードを書いてWebアプリを作った経験はありませんでした。
そこで今回、Windows PCにClaude Codeを導入し、実際にWebアプリを作るところまで挑戦してみました。
作ったのは「業務改善効果計算アプリ」です。
改善前後の作業時間と1カ月の作業回数を入力すると、どれだけ作業時間を削減できるのかを計算できます。さらに途中で機能を追加し、時給から削減金額まで計算できるようにしました。
しかも、私自身がHTMLやJavaScriptのコードを書いたわけではありません。
Claude Codeに日本語で「こんなアプリを作って」と伝えて作成しました。
もちろん、最初から順調だったわけではありません。
Claude Codeが起動しなかったり、途中でAPI Error 400が表示されたりと、初心者には「これは何？」と思う場面もありました。
この記事では、そんな失敗も含めて、プログラミング初心者がClaude Codeを導入してWebアプリを作るまでに実際に行ったことを紹介します。
※Claude Codeは更新が速いため、画面や手順が変更される可能性があります。本記事は2026年9月14日にWindows環境で実際に操作した内容をもとにしています。
Claude Codeを始める前に「結局いくらかかるの？」と気になる方は、Claude Codeの料金とPro・Maxの違いを別記事で詳しくまとめています。
Claude Codeとは？初心者向けに簡単に説明
Claude Codeは、AIを使いながらプログラミング作業を進められるツールです。
名前だけを見ると「プログラマー向けの難しいツール」という印象を受けるかもしれません。私も最初はそう感じました。
普段使うClaudeのチャットでは、質問すると文章やコードなどを回答として返してくれます。
一方、Claude Codeでは、パソコン上のファイルを読み込んだり、新しいファイルを作ったり、既存のコードを修正したりしながら作業を進めてもらえます。
今回も私はコードを自分で書くのではなく、Claude Codeに日本語で、
「業務改善の効果を計算できる簡単なWebアプリを作ってください」
と指示しました。
するとClaude Codeが必要なコードを考え、index.htmlというファイルを作成してくれました。
そのファイルをブラウザで開くと、実際に入力・計算できるWebアプリとして動きます。
さらに「時給から削減金額も計算できるようにして」と伝えると、すでに作ったファイルを修正して機能を追加してくれました。
実際に触ってみて感じたのは、「プログラミングのコードをAIに質問するツール」というより、「作りたいものを伝えて、一緒に作業を進めてもらうツール」に近いということです。
ただし、プログラミングの知識がまったく必要ないという意味ではありません。
今回も途中で「PATH」「ディレクトリ」など、初心者には分かりにくい言葉が出てきました。
この記事では、難しい用語をできるだけかみ砕きながら、私が実際に進めた順番で紹介していきます。
Claude Codeを始めるために準備したもの
今回、私がClaude Codeを試した環境はWindows PCです。
特別な開発用パソコンを用意したわけではなく、普段使っているWindows PCから始めました。
操作には「Windows PowerShell」を使用しました。
PowerShellと聞くと難しく感じるかもしれませんが、簡単にいえば、Windowsに文字で命令を入力して操作するためのツールです。
私も普段の仕事でPowerShellを使ってプログラムを作っているわけではありません。
実際、最初に黒い画面が表示されたときは、
「ここに何を入力すればいいんだろう？」
という状態でした。
また、Claude Codeを利用するためにClaudeのアカウントも使用しました。
初回起動時にはログイン方法を選択する画面が表示され、私は自分が利用しているClaudeアカウントで進めました。
料金プランや利用条件については変更される可能性があるため、これから始める場合は最新のClaude公式情報を確認してください。
ここまで準備したら、Claude CodeをWindows PCにインストールしていきます。
Claude CodeをWindowsにインストールしてみた
まずWindows PowerShellを開き、Claude Codeを起動しようとしました。
ところが、いきなり赤い文字でエラーが表示されました。
claudeが認識されなかったPowerShell画面プログラミング初心者の私にとって、最初から大量の赤い文字が表示されると少し焦ります。
「もう何か間違えた？」
というのが最初の感想でした。
そこでClaude Codeのインストールを進めます。
PowerShellでインストール用のコマンドを実行すると、
「Claude Code successfully installed!」
と表示され、インストール自体は完了しました。
ただ、インストールに成功したからといって、私の場合はそこですぐ使えたわけではありませんでした。
表示内容を確認しながら進め、最終的にはClaude Codeを起動することができました。
ここまで来れば、ひとまずClaude Codeの起動は成功です。
プログラミング経験がない私にとっては、このWelcome画面が表示されただけでも「とりあえずここまではできた」と安心しました。
初心者なのでClaude Code専用の練習フォルダを作った
Claude Codeでは、指定したフォルダ内のファイルを読み込んだり、編集したり、新しいファイルを作ったりできます。
便利な反面、初心者の私には少し不安もありました。
「操作を間違えて、普段使っているファイルまで変更されたらどうしよう？」
と考えたからです。
そこで今回は、Claude Codeを試すためだけの**「claude-practice」**という練習用フォルダを作りました。
PowerShellからそのフォルダへ移動し、Claude Codeを起動します。
初めてその場所でClaude Codeを使うと、フォルダを信頼するかどうかを確認する画面も表示されました。
今回は自分で練習用として作ったフォルダなので、内容を確認したうえで進めました。
練習専用フォルダを作ることが絶対に必要というわけではありません。
ただ、初めてClaude Codeを触るのであれば、私は**「ここなら試しても大丈夫」と分かっている場所から始めた方が安心**だと感じました。
準備ができたところで、いよいよWebアプリを作ってもらいます。
プログラミング初心者がClaude CodeにWebアプリを作ってもらった
せっかくClaude Codeを試すのであれば、単に文字を表示するだけではなく、自分の仕事にもつながりそうなものを作ってみたいと考えました。
そこで今回作ることにしたのが、
「業務改善効果計算アプリ」
です。
製造業の仕事では、「この改善によって作業時間が何分短くなったのか」「1カ月や1年間ではどれくらいの効果になるのか」を考える場面があります。
そこで、
改善前の作業時間、改善後の作業時間、1カ月の作業回数を入力すると、削減できた時間を自動で計算してくれるWebアプリを作ってみることにしました。
とはいえ、私はWebアプリを作るためのコードを書けません。
そこでClaude Codeには、プログラミング用語を使わず、日本語でやりたいことをそのまま伝えました。
ここで私が意識したのは、
「HTMLでこうして」
「JavaScriptでこの処理をして」
といった技術的な指示をしなかったことです。
私が伝えたのは、
「何を入力したいのか」
「何を計算したいのか」
「どんなものを作ってほしいのか」
という完成形のイメージです。
それでもClaude Codeは必要なコードを考え、Webアプリを作るためのファイルを作成してくれました。
ところが、ここで問題が発生します。
途中で「API Error: 400」が出て止まった
Webアプリの作成を進めている途中で、突然**「API Error: 400」**というエラーが表示されました。
プログラミングに詳しい人なら、表示内容から原因を推測できるのかもしれません。
しかし、初心者の私は、
「何が悪いの？」
「設定を間違えた？」
「最初からやり直すの？」
という状態でした。
今回の操作では、表示されている内容や状態を確認しながら進め、最終的には再びClaude Codeを使える状態になりました。
ここで感じたのは、Claude Codeを使えば、分からないことやエラーがすべてなくなるわけではないということです。
日本語で指示するだけでコードを作ってくれる一方、パソコンの設定やエラーなど、初心者には意味が分からない場面もあります。
それでも、今回のように途中でエラーが出ても、そこでWebアプリ作成を諦める必要はありませんでした。
本当にWebアプリが完成した
エラーを乗り越えて作業を進めると、Claude Codeがindex.htmlを作成してくれました。
そのファイルをブラウザで開いてみると、画面には先ほどお願いした**「業務改善効果計算アプリ」**が表示されました。
実際に、
改善前：60分
改善後：15分
月の作業回数：20回
と入力して計算すると、
1回あたり45分
1カ月あたり15時間
1年間で180時間
の削減になることが表示されました。
ここまで私は、Webアプリのコードを自分で書いていません。
「こういうものを作りたい」と日本語で説明し、Claude Codeが作ったファイルをブラウザで開いただけです。
プログラミング初心者の私にとって、ここが一番、
「Claude Codeってこういうことなのか」
と実感できた瞬間でした。
コードそのものを生成してもらうだけでなく、実際に自分のパソコン上で動くものができたからです。
「時給から削減金額も計算して」と追加してみた
最初のWebアプリが完成したところで、もう一つ試してみたいことが出てきました。
作業時間を「年間180時間削減できる」と表示するだけでも改善効果は分かります。
しかし仕事で改善効果を考えるなら、
「その時間を金額にすると、どれくらいの効果になるのか？」
まで分かると、さらに使いやすそうです。
そこでClaude Codeに、
「時給から削減金額も計算できるようにして」
と追加でお願いしました。
ここでも、コードをどのように変更するかは指定していません。
するとClaude Codeは、すでに作成していたファイルを確認し、時給を入力する欄と削減金額を計算する機能を追加してくれました。
ブラウザで確認すると、最初のアプリにはなかった「時給」の入力欄が追加されています。
たとえば、
改善前：60分
改善後：15分
月の作業回数：20回
時給：1,300円
と入力すると、削減時間に加えて、
月19,500円
年間234,000円
の削減効果まで表示されました。
このときに感じたのが、Claude Codeの便利さは**「最初のアプリを作ってくれること」だけではない**ということです。
一度作って終わりではなく、実際に触ってから、
「この機能も欲しい」
と日本語で伝えて、少しずつ改善していけます。
最初から完璧なアプリの仕様を考えられなくても、作りながら修正していけるのは、プログラミング初心者にとって大きなメリットだと感じました。
実際に使って分かった「簡単だったこと」と「難しかったこと」
今回、プログラミング初心者の状態からClaude Codeを導入してWebアプリを作ってみると、想像していたより簡単だった部分と、やはり難しかった部分の両方がありました。
簡単だったのは、作りたいものを日本語で伝えられたことです。
私はHTMLやJavaScriptの書き方を指定していません。
「改善前後の時間を入力したい」「年間の削減時間を出したい」「時給から削減金額も計算したい」と、欲しい機能を日本語で伝えました。
特に、一度完成したアプリに追加の要望を出すと、Claude Codeが既存のファイルを修正してくれたことには驚きました。
一方で難しかったのは、Claude Codeを使える状態にするまでや、エラーが出たときの対応です。
PowerShell、PATH、フォルダ、index.htmlなど、普段プログラミングをしない私には馴染みのない言葉も出てきました。
さらに途中ではAPI Errorも発生しています。
そのため、
「Claude Codeならプログラミング知識は一切必要ない」
と考えるより、
「分からないことは出てくるけれど、初心者でも実際に作りながら覚えていける」
というのが、今回使ってみた実感に近いです。
私自身、Claude Codeを使う前は「プログラミング経験がほとんどない自分でも本当に使えるのか？」という不安がありました。実際に使って分かった、非エンジニアでもできたこと・難しかったことについては、以下の記事で詳しくまとめています。
関連記事：Claude Codeは非エンジニアでも使える？Webアプリ開発未経験の会社員が実際に試した感想
Claude Code初心者が最初から全部理解する必要はない
今回の作業中には、意味が分からない言葉が何度も出てきました。
私自身、最初からPowerShellやHTMLの仕組みを理解していたわけではありません。
それでも最終的には、自分のパソコン上で動くWebアプリを作るところまで進めました。
ここで感じたのは、最初からすべてを勉強してからClaude Codeを使おうとしなくてもいいということです。
もちろん、本格的なWebアプリを作ったり、仕事で使うシステムを開発したりするなら、セキュリティやプログラミングなどの知識も必要になってくるでしょう。
しかし最初の一歩としては、
簡単なものを作ってみる → 分からないところが出てくる → 必要になったことを調べる
という順番でもいいのではないかと感じました。
今回の私も、Webアプリ開発を一通り勉強してからClaude Codeを使ったわけではありません。
まず実際に触ってみたことで、
「Claude Codeを使うと、こういうことができるのか」
と具体的にイメージできるようになりました。
Claude Codeをもっと使えるようになるには何を学べばいい？
簡単なWebアプリを一つ作れたことで、「これならプログラミングを勉強しなくても大丈夫」と思うかもしれません。
しかし、実際に使ってみた私はむしろ逆でした。
Claude Codeがコードを書いてくれても、
「この変更をして大丈夫なのか」
「エラーが出たときに何が起きているのか」
「もっと複雑なアプリを作るにはどう指示すればいいのか」
と、新しい疑問が出てきたからです。
Claude Codeを仕事や副業で本格的に使っていくなら、AIへの指示方法だけでなく、Webアプリの基本的な仕組みやファイルの扱い方、エラーへの対処方法なども少しずつ理解していく必要がありそうです。
一方で、最初から専門書を何冊も読んでから始める必要があるとも感じませんでした。
今回のように、まず小さなものを一つ作ってみる。
そこから「次は何を知れば、もっとできるようになるのか」を考えていく方が、プログラミング初心者の私には取り組みやすい方法でした。
今後このサイトでも、Claude Codeでできることや初心者向けの学習方法、独学でどこまでできるのかなどを、実際に試しながら紹介していきます。
Claude Codeを始めたあと、「何から勉強すればいい？」と迷っている方は、私が初心者として実際に試した独学方法をこちらの記事でまとめています。
→ 「Claude Codeは独学できる？プログラミング初心者の私が実際に使って分かった勉強方法」
まとめ｜プログラミング未経験でもClaude Codeで最初のWebアプリを作れた
今回は、プログラミング初心者の私がWindows PCにClaude Codeを導入し、「業務改善効果計算アプリ」を作ってみました。
最初から順調だったわけではありません。
Claude Codeを起動できなかったり、途中でAPI Errorが出たりと、「これはどうすればいいんだろう」と止まる場面もありました。
それでも最終的には、自分でコードを書くことなく、日本語でやりたいことを伝えてWebアプリを完成させることができました。
さらに、
「時給から削減金額も計算できるようにして」
と追加でお願いすると、最初に作ったアプリを修正して機能を増やすこともできました。
今回試してみて分かったのは、Claude Codeを使えば何の知識も必要なくなるということではありません。
それでも、「プログラミングができないから、自分にはアプリ開発なんて無理」と最初から諦める必要はないと感じました。
私自身もまだClaude Codeを使い始めたばかりです。
これから実際に使いながら、「初心者でもどこまでできるのか」「仕事にどう活用できるのか」「何を勉強すればもっと使えるようになるのか」を検証していきます。
コメント