アプリとWebサイトの違いとは？ — Claude Codeで最初のプロジェクトを作ろう

「サイト」と「アプリ」って何が違うの？

はじめの一歩シリーズでは、Claudeを使ってWebページを作り、それをインターネットに公開するところまでやりました。

あのWebページは 「サイト」 でした。情報を載せて、見てもらう。それが目的です。自己紹介ページやブログ、ニュースサイトなんかがこれにあたります。

一方、 「アプリ」 はちょっと違います。ユーザーが何かを操作して、 データが変わる のがアプリです。

たとえば：

• TODOアプリ → タスクを追加したり、完了にしたり、削除したりする
• メモアプリ → 文章を書いて保存する
• カレンダーアプリ → 予定を登録して管理する

「ページを見る」で終わらない。使う人が操作して、何かが変わる。 それがアプリです。

今回から4本かけて、TODOアプリを一緒に作っていきます。

このシリーズで身につくこと

TODOアプリって、シンプルに見えますよね。でも実は、アプリ作りの基本がぎゅっと詰まっています。

この4本で体験すること：

1. 今回 — Claude Codeのセットアップ、プロジェクトの立ち上げ
2. 第2回 — 画面を作る（TODOの追加・一覧表示・削除）
3. 第3回 — データを保存する（画面を閉じても消えないようにする）
4. 第4回 — インターネットに公開する

「画面を作る → データを扱う → 公開する」という流れは、どんなアプリを作るときも同じです。TODOアプリで覚えれば、次に何を作るときも応用がききます。

Claude Codeを使うにはProプランが必要です

ここまでの記事では、Claudeの無料プランだけで進めてきました。でも今回から使う Claude Code は、 Proプラン（月額$17〜$20） が必要です。年払いだと月額$17、月払いだと$20です。

Claude Codeは、Claudeに 直接コードを書いてもらう ツールです。ターミナル（黒い画面）から使うこともできますし、Claude Desktopアプリから使うこともできます。Artifactsでは1つのファイルしか作れませんでしたが、Claude Codeなら フォルダやファイルをまるごと作って、本格的なアプリを組み立ててくれます。

Proプランへの変更手順：

1. claude.ai にログインする
2. 左下のアカウント名をクリック
3. 「プランを管理」 または 「Upgrade to Pro」 を選ぶ
4. 支払い情報を入力して完了

Claude Desktopをインストールしよう

Claude Codeは Claude Desktopアプリ から使えます。普段のチャットと同じ画面から、コードを書いてもらえるようになります。

1. claude.ai/download にアクセス
2. お使いのOS（Mac / Windows）に合ったアプリをダウンロードしてインストール
3. Claudeのアカウントでログイン

これで準備完了です！

プロジェクトを作ってみよう

ここからが本番です。Claude Codeに、TODOアプリのプロジェクトを作ってもらいましょう。

Claude Desktopを開いて、こんなふうにお願いしてみてください。

細かい設定はClaude Codeがいい感じに決めてくれるので、シンプルにお願いするだけで大丈夫です。

Claude Codeが自動でファイルを作り始めます。途中で「このコマンドを実行していいですか？」と聞かれることがありますが、問題なければ許可すると先に進みます。

しばらく待つと、プロジェクトが完成します。初めて見ると大量のファイルが一瞬で作られてびっくりしますが、全部Claude Codeにお任せで大丈夫です。

できたプロジェクトを動かしてみましょう。Claude Codeに聞いてみてください。

ブラウザで http://localhost:3000 にアクセスすると、Next.jsの初期画面が表示されるはずです。

おめでとうございます！ TODOアプリの土台ができました。

まとめ

今回やったことをおさらいします。

• サイトは「見るもの」、アプリは「使うもの」
• TODOアプリは、アプリ作りの基本が全部詰まっている
• Claude Codeを使うと、Claudeに直接コードを書いてもらえる
• Next.jsのプロジェクトを作って、開発サーバーを起動した

ここまでで、アプリを作るための環境が整いました。 次は目に見える画面を作っていきます。

次の記事では、Claude Codeに「TODOの画面を作って」とお願いして、タスクの追加・表示・削除ができる画面を完成させます。いよいよアプリらしくなっていきますよ。