0Pricing
Edge Computing with Cloudflare Workers & Deno · レッスン

Worker環境のセットアップ

Wrangler CLIを使って、Cloudflare Workers開発用にローカルマシンを設定します。

「Worker環境のセットアップ」はCoddyKit上の無料Edge Computing with Cloudflare Workers & Denoレッスンです。 これはレッスン1/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはEdge Computing with Cloudflare Workers & Deno学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Edge Computing with Cloudflare Workers & Denoコースには全4レッスンが含まれています。

このレッスンの一部はまだ翻訳されておらず、英語で表示されています。

Get Ready for Edge Dev

Welcome! Before we build our first Cloudflare Worker, we need to set up our local development environment. This ensures you have all the tools to write, test, and deploy your code efficiently.

A proper setup makes the development process smooth and helps you quickly iterate on your edge applications.

Wrangler: Your Worker Tool

Our primary tool for interacting with Cloudflare Workers is the Wrangler CLI (Command Line Interface). It's a powerful tool that helps you:

  • Create new Worker projects
  • Develop and test Workers locally
  • Configure and deploy Workers to Cloudflare's edge
  • Manage Worker resources

Essential: Node.js & npm

Wrangler is built using Node.js, so you'll need Node.js and its package manager, npm (or yarn), installed on your machine.

  • Node.js: A JavaScript runtime environment.
  • npm: Node Package Manager, used to install libraries and tools.

If you don't have Node.js, download it from nodejs.org. We recommend using a Long Term Support (LTS) version.

Installing Wrangler CLI

Once Node.js and npm are ready, open your terminal or command prompt. We'll install Wrangler globally so it's accessible from any directory.

Run the following command:

npm install -g wrangler

Connect to Cloudflare

After installing, you need to link Wrangler to your Cloudflare account. This allows Wrangler to deploy and manage Workers on your behalf.

Execute this command and follow the browser prompts to log in:

wrangler login

Create Your First Project

Now that Wrangler is installed and authenticated, let's create a new Worker project. This command generates a basic project structure for you.

Replace my-first-worker with your desired project name:

wrangler generate my-first-worker

Understanding Project Structure

After running wrangler generate, you'll find a new directory (e.g., my-first-worker) with essential files:

  • wrangler.toml: Your Worker's configuration file.
  • src/index.js: The main JavaScript file where your Worker's logic lives.
  • package.json: Standard Node.js package file (optional, for dependencies).

Let's dive into these key files.

Configure with wrangler.toml

The wrangler.toml file is crucial. It defines your Worker's settings, like its name, type, and associated Cloudflare account.

Here's a basic example of what it might contain:

name = "my-first-worker"
main = "src/index.js"
compatibility_date = "2023-10-26"
account_id = "YOUR_CLOUDFLARE_ACCOUNT_ID"

Your Worker's Logic

The src/index.js file is where you write the JavaScript code for your Worker. Cloudflare Workers typically listen for fetch events.

This simple Worker responds with "Hello Cloudflare Workers!" to any request:

export default {
  async fetch(request, env, ctx) {
    return new Response("Hello Cloudflare Workers!");
  },
};

Test Your Worker Locally

Before deploying, you can test your Worker right on your machine! Wrangler creates a local development server that simulates the Cloudflare edge environment.

Navigate into your project directory (e.g., cd my-first-worker) and run:

wrangler dev

Wrangler Command Check

Which Wrangler command is used to connect your local environment to your Cloudflare account?

Recap: Setup Complete!

Great job! You've successfully set up your Cloudflare Workers development environment. You've learned how to:

  • Install Wrangler CLI
  • Authenticate with Cloudflare
  • Generate a new Worker project
  • Understand the basic project structure
  • Run your Worker locally using wrangler dev

You're now ready to start building powerful applications at the edge!

よくある質問

「Worker環境のセットアップ」レッスンは無料ですか?

はい。「Worker環境のセットアップ」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Edge Computing with Cloudflare Workers & Denoコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Edge Computing with Cloudflare Workers & Denoコースには全4レッスンが含まれています。

「Worker環境のセットアップ」で何を学びますか?

Wrangler CLIを使って、Cloudflare Workers開発用にローカルマシンを設定します。 ブラウザで直接実行するハンズオンコードでEdge Computing with Cloudflare Workers & Denoを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Edge Computing with Cloudflare Workers & Denoを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのEdge Computing with Cloudflare Workers & Denoは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/4です。

「Worker環境のセットアップ」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このEdge Computing with Cloudflare Workers & Denoレッスンでコードを書いて実行できますか?

はい。すべてのEdge Computing with Cloudflare Workers & Denoレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. Worker環境のセットアップ
  2. HTTPリクエストの処理
  3. 最初のWorkerをデプロイする
  4. Workersの環境変数と秘密情報
← Edge Computing with Cloudflare Workers & Denoに戻る