Skip to content

Commit 8db6d29

Browse files
committed
Update README for example
1 parent 0ac3cfa commit 8db6d29

File tree

1 file changed

+73
-3
lines changed

1 file changed

+73
-3
lines changed

examples/basic/README.md

Lines changed: 73 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,75 @@
1-
## sandbox-example
1+
# @cloudflare/sandbox example
22

3-
This is an example of using the sandbox package.
3+
This example demonstrates the full capabilities of the `@cloudflare/sandbox` package through an interactive web-based REPL that lets you execute commands in a sandboxed container environment.
44

5-
To run the example, run `npm start`.
5+
## What This Example Does
6+
7+
This example creates a Cloudflare Worker that:
8+
9+
- Hosts a React-based web interface for interacting with a sandbox
10+
- Routes API requests to a sandboxed container running Linux
11+
- Demonstrates both regular and streaming command execution
12+
- Shows real-time output from commands like `tail -f` or `top`
13+
14+
## Features
15+
16+
- **Interactive REPL**: Web-based command line interface
17+
- **Real-time Streaming**: Execute commands with live output streaming
18+
- **Session Management**: Maintains persistent sandbox sessions
19+
- **Rich UI**: Modern React interface with command history and status indicators
20+
- **Example Commands**: Built-in examples for common Linux commands
21+
22+
## Quick Start
23+
24+
1. **Install dependencies**:
25+
26+
```bash
27+
npm install
28+
```
29+
30+
2. **Start development server**:
31+
32+
```bash
33+
npm start
34+
```
35+
36+
3. **Open your browser** and navigate to the URL shown in the terminal (typically `http://localhost:8787`)
37+
38+
4. **Try some commands** in the web interface:
39+
- `ls -la` - List files with details
40+
- `pwd` - Show current directory
41+
- `echo "Hello from sandbox!"` - Print text
42+
- `whoami` - Show current user
43+
- `cat /etc/os-release` - Display OS information
44+
45+
## Architecture
46+
47+
The example consists of:
48+
49+
- **Worker (`src/index.ts`)**: Cloudflare Worker that proxies requests to the sandbox
50+
- **React App (`app/index.tsx`)**: Interactive web interface for the REPL
51+
- **Dockerfile**: Container configuration using the sandbox base image
52+
- **Wrangler Config**: Cloudflare configuration with container and Durable Object setup
53+
54+
## Key Concepts Demonstrated
55+
56+
1. **Container Integration**: Shows how to configure and deploy containers with Cloudflare Workers
57+
2. **Durable Objects**: Uses Durable Objects for persistent sandbox sessions
58+
3. **HTTP Client**: Implements the sandbox HTTP client for command execution
59+
4. **Streaming**: Demonstrates real-time command output streaming
60+
5. **Session Management**: Shows how to create and manage sandbox sessions
61+
62+
## Deployment
63+
64+
Containers on Cloudflare are currently [in public beta](https://blog.cloudflare.com/containers-are-available-in-public-beta-for-simple-global-and-programmable), available for all paid accounts. If you have one, you can simply run:
65+
66+
```bash
67+
npm run deploy
68+
```
69+
70+
## Understanding the Code
71+
72+
- The Worker acts as a proxy between the web interface and the sandbox container
73+
- The React app uses the sandbox HTTP client to communicate with the Worker
74+
- Commands are executed in the container and results are streamed back to the UI
75+
- The Dockerfile extends the base sandbox image with the necessary runtime

0 commit comments

Comments
 (0)