はじめに第00章 ・ 読むのにかかる時間 約7分

この教科書の使い方

誰のための本で、どこまで行けるのか

「Cloudflare(クラウドフレア)、なんだか便利らしい」。そう聞いて公式サイトを開いて、5分で静かにタブを閉じた経験はありませんか。僕がまさにそれでした。

書いてあることは日本語なのに、意味が入ってこない。日本語の解説記事を探しても数が少なくて、見つかったものは途中から「ターミナルでこのコマンドを実行します」と当たり前のように進んでいきます。プログラムを書いたことがない人間からすると、そこで道が切れるんですよね。

この教科書は、そこで切れた道をつなぎ直すために書きました。

この章でわかること

  • この教科書が誰のためのもので、どこまで連れて行くのか
  • 「コマンドは自分で打たない」という、この本の一番大事なルール
  • 用意するものは2つだけだということ

この教科書は、こういう人のために書きました

  • プログラムを1行も書いたことがない
  • 黒い画面(ターミナル)が出てくると身構えてしまう
  • でも、自分のページや画像の置き場を自分で持ってみたい
  • AIに任せながらでいいから、動くものを作ってみたい

逆に、すでにWebアプリを仕事で作っている人には、この本はまわりくどく感じます。その場合はkomiyammaさんのCloudflare学習教材のように、コードから入る教材のほうが早いです。この本は、その手前にある段差を埋めるためのものです。

ゴールは「自分の画像置き場を、世界に公開する」

読み終わったときに、あなたの手元にはこれが残ります。

  • インターネットに公開された、自分のページ(第5章で完成します)
  • 画像をアップロードすると、それが世界中から見られるようになる仕組み(第14章)
  • 「これは何をしているのか」を自分の言葉で説明できる状態

しかも、ここまですべて無料の枠内で作れます。クレジットカードの登録なしで始められて、途中で勝手に課金されることもありません。お金の話は第7章で、数字を出して正面から説明します。

横にスクロールできます

この教科書の4つのパート 地図を読む、はじめて公開する、ファイルを置く、作品にする、の順に進みます。 PART 1 地図をもらう PART 2 はじめての公開 自分のページが ネットに出ます PART 3 ファイルを置く 画像の置き場を 作って配ります PART 4 作品にする 画像ギャラリーを 公開して完成
前から順に読む前提で作っています。Part 1は読むだけ、手を動かすのはPart 2からです。

この本の一番大事なルール:コマンドは、あなたが打ちません

ふつうのCloudflare教材は、こう書いてあります。

npx wrangler r2 bucket create my-bucket

この呪文を1文字も間違えずに打ち込め、というわけです。半角と全角を間違えただけで動きません。これが初心者を落とす最大の段差です。

この教科書では、そこをまるごとAIに任せます。あなたがやるのは、日本語でAIにお願いすることだけです。

Claude Codeにこう頼みます

画像を置くためのR2バケットを1つ作ってください。名前は my-photos にしてください。作ったあと、ちゃんと作れているか確認して、結果を日本語で教えてください。

お願いされたAIが、必要なコマンドを自分で組み立てて、自分で実行して、結果を日本語で報告してくれます。あなたは日本語を書いて、返ってきた日本語を読むだけです。

この進め方には、副産物があります。AIが実行したコマンドは画面に表示されるので、読んでいるうちに「ああ、bucket create って書いてあるから、これは入れ物を作る命令なんだ」と、勝手に読めるようになっていきます。打てるようになる前に、読めるようになる。この順番のほうが、挫折しません。

ターミナルとは

パソコンに文字で命令を出すための画面です。アイコンをクリックする代わりに、文字を打って操作します。この本では、あなたがここに文字を打つ場面はほとんどありません。Claude Codeがこの画面を代わりに使ってくれます。

用意するものは2つだけ

  • Cloudflareのアカウント(無料)… メールアドレスがあれば作れます
  • Claude Code … AIにパソコンの作業を任せるための道具です

ここは正直に書きます。Cloudflareは無料ですが、Claude Codeは有料です。ClaudeのPro・Max・Team・Enterpriseのどれかに入っている必要があって、無料のClaude.aiプランでは使えません(公式のセットアップ手順に明記されています)。

ちなみにClaude Codeには、ターミナルを開かずに使えるデスクトップアプリがあります。この教科書ではそちらを使います。アプリをインストールして、日本語で話しかけるだけです。

どちらも第4章で、順番に用意します。今の時点では何も準備しなくて大丈夫です。まずは第3章まで、コーヒーでも飲みながら読んでみてください。

章の読み方:どの章も同じ並びです

第4章以降は、すべての章がこの順番で並んでいます。慣れると、読みたいところに一発でたどり着けます。

  1. この章でできるようになること:3行で書いてあります。ここだけ見て飛ばす判断をしてもいいです
  2. たとえ話と図:専門用語を出す前に、まず絵でつかみます
  3. 本編:新しい言葉が出てきたら、その場で必ず説明します
  4. Claude Codeにこう頼む:オレンジの枠です。コピーボタンを押して、そのまま貼れます
  5. うまくいったか確認する:目で見える形で確かめます
  6. よくあるつまずき:エラーの文面と、その意味と、直し方です
  7. 章末チェックリスト:全部にチェックを入れると、左の目次に読了マークが付きます

言葉がわからないのは、あなたのせいではありません

この分野の説明が難しいのは、書き手が「これくらいは知っているはず」と思っている言葉が多すぎるからです。バケット、バインディング、デプロイ、エンドポイント。どれも日常では使いません。

だからこの教科書では、新しい言葉が出てくるたびに、オレンジの縦線が付いた枠でその場で説明します。前の章に戻らなくても読み進められるようにしてあります。それでも詰まったら、付録Aの「詰まったとき辞書」を開いてください。

章末チェックリスト