UNIT 01 · LEARN BY BUILDING
Claude Codeを知る。
Claude Codeがどこにあり、普通のチャットAIと何が違うのか。この教材で何を作り、始める前に何が必要かを確かめます。
使う道具と、作るものの全体像をつかむ。
この教材では、Claude CodeというAIに手伝ってもらいながら、自分のパソコンの中にWebページ(LP)と小さなアプリを作ります。操作を始める前に、どの道具を、何のために使うのかを確かめておきましょう。
Claude CodeがClaudeアプリの中の「Code」で使えること、チャットAIとの違い、この教材で作る2つのもの、始める前に必要なものを、自分の言葉で説明できる。
道具の役割を知らないまま進むと、「どこに入力するのか」「AIが何を変えたのか」が分からなくなりやすいからです。このUNITの内容は、UNIT 02以降のすべての操作の前提になります。
Claude Codeの入口は、Claudeアプリの中にある。
「Claude Code」という名前のアプリを別に探す必要はありません。この教材では、パソコンにClaudeアプリ(デスクトップアプリ)を入れ、その中の「Code」に切り替えて使います。
質問への答えや、文章・アイデアを返してもらう使い方。
選んだフォルダのファイルを読み、作る・直す作業を手伝ってもらう使い方。
PowerShellやターミナル(文字だけで操作する画面)は、この教材の必修の手順では使いません。使いたい人向けに、公式のターミナル版の始め方があります。
違いは「できたファイルが、どこに届くか」。
同じ「LPを作って」という頼み方でも、チャットとCodeでは、その後の流れが変わります。下の図で、あなたが手を動かす場所を比べてみてください。
チャットで頼む場合
- 頼む「こんなLPを作って」と入力する
- 答えが画面に出る文章やコードが表示される
- 自分で保存するコピーしてファイルに貼る・置き場所を決める
- 自分で開いて確かめる直したいときは、また最初から
Codeで頼む場合
- 作業するフォルダを選ぶ例:練習用の lp_learning
- 頼む・AIが作業内容を示すどのファイルを作るか、先に説明してもらう
- 許可する内容を見て、よければ進めてもらう
- フォルダにファイルができる続けて「ここを直して」と頼める
- 自分で開いて確かめるAIの「できました」だけで終わらせない
あなたの番の印は、あなたが操作・判断するところです。
チャットでもファイルを作れる場合がありますが、自分のパソコンのフォルダに直接ファイルを置き、そのまま直し続けられるのがCodeの強みです。そのぶん、どのフォルダで作業させるかと何を許可するかが大切になります。
作業はAIに頼める。判断は、あなたが持つ。
プログラミングの経験がなくても、日本語で頼めば、ページの文章や見た目を作ったり、気になる所を直したりする作業を手伝ってもらえます。一方で、何を作るか、何を許可するか、できあがりで良いかは、あなたが決めます。
AIに頼めること(この教材の例)
- LPのファイルを作る・文章や色を直す
- スマホで崩れていないか一緒に調べる
- 入力に合わせて見た目が変わる小さなアプリを作る
- エラーの意味を、分かる言葉で説明してもらう
あなたが決めること
- 誰に向けて、何を作るか
- 作業させるフォルダと、許可するかどうか
- できあがりを自分で開いて、良いか判断する
- 公開・送信・削除・支払いをするかどうか
最後には、LPと、LPを編集するアプリが手元に残る。
題材は、架空のサービス「SNS画像デザイン室」です。1つの題材を使い続けるので、途中で何を作っているか迷いにくくなっています。
- UNIT 01〜03準備と最初の操作
- UNIT 04〜06LPを1枚作る
- UNIT 07〜09確かめて、安全に直す
- UNIT 10LP編集アプリを作る
- UNIT 11自分のアイデアへ
上の2つの完成見本は、学習用にORIHATAが用意した見本です。Claude Codeで実際に作った結果を、そのまま載せたものではありません。
用意するもの、かかる費用、注意すること。
WindowsまたはMac。スマホだけでは進められません。
アプリのダウンロードと、AIとのやり取りに使います。
メールアドレスなどで作ります。作り方はUNIT 02で説明します。
Claude Codeを使うには、Claudeの有料プランが必要です(下の図)。
閲覧は無料です。教材が課金や申し込みを代行することはありません。
チャットは使えますが、Claude Codeは含まれていません。
Pro・Maxなど。使える量には上限があり、5時間ごと・週ごとに回復します。
はじめる前の注意
- 会社や学校のパソコン:アプリを入れてよいか、先に管理している人に確かめてください。
- 練習は自分のパソコンの中だけ:この教材では、作ったものをインターネットに公開しません。
- 大切なファイルとは分ける:AIには練習用のフォルダだけを渡します(UNIT 03で作ります)。
- 画面写真について:この教材の操作画像はWindowsの実際の画面です。Macの手順は公式資料で確認できる範囲で説明し、実機で確かめていない部分はその旨を書きます。
公式資料:デスクトップアプリを始める / 料金プラン。サービスの仕様は変わることがあります(2026年11月10日に確認)。
よくある疑問に、先に答えておきます。
入れるのは「Claude」という名前のアプリです。Claude Codeは、その中の「Code」で使います(STEP 01)。
この教材では、コードを書けることは求めません。かわりに、できあがりを自分で開いて「意図どおりか」を確かめることを大切にします。
2026年11月10日時点の公式情報では、無料プランにClaude Codeは含まれていません。教材を読むことは無料でできます。
この教材の必修の手順では使いません。アプリの画面だけで進めます。
変更の前に確認を求める設定を選べます。この教材ではその設定で進め、練習用のフォルダだけを渡します(UNIT 03)。
道具と、作るものと、準備が分かったら完了。
パソコンにClaudeアプリを入れてログインし、「Code」の画面を開くところまで進みます。Windowsの実際の画面写真を見ながら、1つずつ操作します。