はじめに
この教科書の使い方
誰のための本で、どこまで行けるのか
「Cloudflare(クラウドフレア)、なんだか便利らしい」。そう聞いて公式サイトを開いて、5分で静かにタブを閉じた経験はありませんか。僕がまさにそれでした。
書いてあることは日本語なのに、意味が入ってこない。日本語の解説記事を探しても数が少なくて、見つかったものは途中から「ターミナルでこのコマンドを実行します」と当たり前のように進んでいきます。プログラムを書いたことがない人間からすると、そこで道が切れるんですよね。
この教科書は、そこで切れた道をつなぎ直すために書きました。
この章でわかること
- この教科書が誰のためのもので、どこまで連れて行くのか
- 「コマンドは自分で打たない」という、この本の一番大事なルール
- 用意するものは2つだけだということ
この教科書は、こういう人のために書きました
- プログラムを1行も書いたことがない
- 黒い画面(ターミナル)が出てくると身構えてしまう
- でも、自分のページや画像の置き場を自分で持ってみたい
- AIに任せながらでいいから、動くものを作ってみたい
逆に、すでにWebアプリを仕事で作っている人には、この本はまわりくどく感じます。その場合はkomiyammaさんのCloudflare学習教材のように、コードから入る教材のほうが早いです。この本は、その手前にある段差を埋めるためのものです。
ゴールは「自分の画像置き場を、世界に公開する」
読み終わったときに、あなたの手元にはこれが残ります。
- インターネットに公開された、自分のページ(第5章で完成します)
- 画像をアップロードすると、それが世界中から見られるようになる仕組み(第14章)
- 「これは何をしているのか」を自分の言葉で説明できる状態
しかも、ここまですべて無料の枠内で作れます。クレジットカードの登録なしで始められて、途中で勝手に課金されることもありません。お金の話は第7章で、数字を出して正面から説明します。
横にスクロールできます
この本の一番大事なルール:コマンドは、あなたが打ちません
ふつうのCloudflare教材は、こう書いてあります。
npx wrangler r2 bucket create my-bucket
この呪文を1文字も間違えずに打ち込め、というわけです。半角と全角を間違えただけで動きません。これが初心者を落とす最大の段差です。
この教科書では、そこをまるごとAIに任せます。あなたがやるのは、日本語でAIにお願いすることだけです。
画像を置くための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章以降は、すべての章がこの順番で並んでいます。慣れると、読みたいところに一発でたどり着けます。
- この章でできるようになること:3行で書いてあります。ここだけ見て飛ばす判断をしてもいいです
- たとえ話と図:専門用語を出す前に、まず絵でつかみます
- 本編:新しい言葉が出てきたら、その場で必ず説明します
- Claude Codeにこう頼む:オレンジの枠です。コピーボタンを押して、そのまま貼れます
- うまくいったか確認する:目で見える形で確かめます
- よくあるつまずき:エラーの文面と、その意味と、直し方です
- 章末チェックリスト:全部にチェックを入れると、左の目次に読了マークが付きます
言葉がわからないのは、あなたのせいではありません
この分野の説明が難しいのは、書き手が「これくらいは知っているはず」と思っている言葉が多すぎるからです。バケット、バインディング、デプロイ、エンドポイント。どれも日常では使いません。
だからこの教科書では、新しい言葉が出てくるたびに、オレンジの縦線が付いた枠でその場で説明します。前の章に戻らなくても読み進められるようにしてあります。それでも詰まったら、付録Aの「詰まったとき辞書」を開いてください。
章末チェックリスト
この章は読了です。次は第01章に進みます。