---
title: CLI
description: Set up and deploy your first Cloudflare Worker using Wrangler, the command-line interface.
pcx_content_type: get-started
sidebar:
  order: 1
head:
  - tag: title
    content: Get started - CLI
products:
  - workers
---

import { Details, Render, PackageManagers } from "~/components";

Set up and deploy your first Worker with Wrangler, the Cloudflare Developer Platform CLI.

This guide will instruct you through setting up and deploying your first Worker.

## Prerequisites

<Render file="prereqs" product="workers" />

## 1. Create a new Worker project

Open a terminal window and run C3 to create your Worker project. [C3 (`create-cloudflare-cli`)](https://github.com/cloudflare/workers-sdk/tree/main/packages/create-cloudflare) is a command-line tool designed to help you set up and deploy new applications to Cloudflare.

<PackageManagers
	type="create"
	pkg="cloudflare@latest"
	args={"my-first-worker"}
/>

<Render
	file="c3-post-run-steps-hello-world"
	product="workers"
	params={{
		type: "Worker only",
		lang: "JavaScript",
	}}
/>

Now, you have a new project set up. Move into that project folder.

```sh
cd my-first-worker
```

<Details header="What files did C3 create?">

In your project directory, C3 will have generated the following:

- `wrangler.jsonc`: Your [Wrangler](/workers/wrangler/configuration/#sample-wrangler-configuration) configuration file. C3 enables [source map uploads](/workers/observability/source-maps/) for JavaScript and TypeScript projects so captured exception stacks point to your original code.
- `index.js` (in `/src`): A minimal `'Hello World!'` Worker written in [ES module](/workers/reference/migrate-to-module-workers/) syntax.
- `package.json`: A minimal Node dependencies configuration file.
- `package-lock.json`: Refer to [`npm` documentation on `package-lock.json`](https://docs.npmjs.com/cli/v9/configuring-npm/package-lock-json).
- `node_modules`: Refer to [`npm` documentation `node_modules`](https://docs.npmjs.com/cli/v7/configuring-npm/folders#node-modules).

</Details>

<Details header="What if I already have a project in a git repository?">

In addition to creating new projects from C3 templates, C3 also supports creating new projects from existing Git repositories. To create a new project from an existing Git repository, open your terminal and run:

```sh
npm create cloudflare@latest -- --template <SOURCE>
```

`<SOURCE>` may be any of the following:

- `user/repo` (GitHub)
- `git@github.com:user/repo`
- `https://github.com/user/repo`
- `user/repo/some-template` (subdirectories)
- `user/repo#canary` (branches)
- `user/repo#1234abcd` (commit hash)
- `bitbucket:user/repo` (Bitbucket)
- `gitlab:user/repo` (GitLab)

Your existing template folder must contain the following files, at a minimum, to meet the requirements for Cloudflare Workers:

- `package.json`
- `wrangler.jsonc` [See sample Wrangler configuration](/workers/wrangler/configuration/#sample-wrangler-configuration)
- `src/` containing a worker script referenced from `wrangler.jsonc`

</Details>

## 2. Develop with Wrangler CLI

C3 installs [Wrangler](/workers/wrangler/install-and-update/), the Workers command-line interface, in Workers projects by default. Wrangler lets you to [create](/workers/wrangler/commands/general/#init), [test](/workers/wrangler/commands/general/#dev), and [deploy](/workers/wrangler/commands/general/#deploy) your Workers projects.

After you have created your first Worker, run the [`wrangler dev`](/workers/wrangler/commands/general/#dev) command in the project directory to start a local server for developing your Worker. This will allow you to preview your Worker locally during development.

```sh
npx wrangler dev
```

If you have never used Wrangler before, it will open your web browser so you can login to your Cloudflare account.

Go to [http://localhost:8787](http://localhost:8787) to view your Worker.

<Details header="Browser issues?">

If you have issues with this step or you do not have access to a browser interface, refer to the [`wrangler login`](/workers/wrangler/commands/general/#login) documentation.

</Details>

## 3. Write code

With your new project generated and running, you can begin to write and edit your code.

Find the `src/index.js` file. `index.js` will be populated with the code below:

```js title="Original index.js"
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};
```

<Details header="Code explanation">

This code block consists of a few different parts.

```js title="Updated index.js" {1}
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};
```

`export default` is JavaScript syntax required for defining [JavaScript modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#default_exports_versus_named_exports). Your Worker has to have a default export of an object, with properties corresponding to the events your Worker should handle.

```js title="index.js" {2}
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};
```

This [`fetch()` handler](/workers/runtime-apis/handlers/fetch/) will be called when your Worker receives an HTTP request. You can define additional event handlers in the exported object to respond to different types of events. For example, add a [`scheduled()` handler](/workers/runtime-apis/handlers/scheduled/) to respond to Worker invocations via a [Cron Trigger](/workers/configuration/cron-triggers/).

Additionally, the `fetch` handler will always be passed three parameters: [`request`, `env` and `context`](/workers/runtime-apis/handlers/fetch/).

```js title="index.js" {3}
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};
```

The Workers runtime expects `fetch` handlers to return a `Response` object or a Promise which resolves with a `Response` object. In this example, you will return a new `Response` with the string `"Hello World!"`.

</Details>

Replace the content in your current `index.js` file with the content below, which changes the text output.

```js title="index.js" {3}
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello Worker!");
	},
};
```

Then, save the file and reload the page. Your Worker's output will have changed to the new text.

<Details header="No visible changes?">

If the output for your Worker does not change, make sure that:

1. You saved the changes to `index.js`.
2. You have `wrangler dev` running.
3. You reloaded your browser.

</Details>

## 4. Deploy your project

Deploy your Worker via Wrangler to a `*.workers.dev` subdomain or a [Custom Domain](/workers/configuration/routing/custom-domains/).

```sh
npx wrangler deploy
```

If you have not configured any subdomain or domain, Wrangler will prompt you during the publish process to set one up.

Preview your Worker at `<YOUR_WORKER>.<YOUR_SUBDOMAIN>.workers.dev`.

<Details header="Seeing 523 errors?">

If you see [`523` errors](/support/troubleshooting/http-status-codes/cloudflare-5xx-errors/error-523/) when pushing your `*.workers.dev` subdomain for the first time, wait a minute or so and the errors will resolve themselves.

</Details>

## Next steps

To do more:

- Push your project to an Artifacts, GitHub, or GitLab repository, then [connect to builds](/workers/ci-cd/builds/#get-started) to enable automatic builds and deployments.
- Visit the [Cloudflare dashboard](https://dash.cloudflare.com/) for simpler editing.
- Review our [Examples](/workers/examples/) and [Tutorials](/workers/tutorials/) for inspiration.
- Set up [bindings](/workers/runtime-apis/bindings/) to allow your Worker to interact with other resources and unlock new functionality.
- Learn how to [test and debug](/workers/testing/) your Workers.
- Read about [Workers limits and pricing](/workers/platform/).