Share HTML Prototypes Instantly with Sprites.dev

Sometimes you just need to share a quick HTML prototype with a client or teammate. Setting up a deployment pipeline for a few static files feels like overkill. Sprites.dev provides a fast way to get a public URL for your prototype without the usual deployment ceremony.

What is Sprites.dev?

Sprites.dev gives you on-demand cloud development environments. Each "sprite" is essentially a lightweight VM you can SSH into, run commands on, and expose to the internet via a public URL. It's useful for development, testing, and—as we'll see—sharing prototypes.

Prerequisites

Install the Sprites CLI:

curl -fsSL https://sprites.dev/install.sh | sh

Then authenticate with your organization:

sprite org auth

A Note on Organization Flags

The -o (org) and -s (sprite) flags are optional in most commands. If you only have one organization configured, it's used automatically. You can also run sprite use my-sprite to activate a sprite for your current directory—this creates a .sprite file so subsequent commands know which sprite to target without needing flags.

The examples below assume you've activated a sprite with sprite use, so they omit the flags.

Step 1: Create a Sprite

If you don't already have a sprite running, create one:

sprite create prototype-demo

This creates a new sprite named prototype-demo. If you have multiple orgs, add -o YOUR_ORG.

Step 2: Upload Your HTML Files

First, activate the sprite for your current directory:

sprite use prototype-demo

Then use the -file flag with sprite exec to upload files. You can chain multiple -file flags to upload several files at once:

sprite exec \
  -file "index.html:/home/sprite/prototype/index.html" \
  -file "styles.css:/home/sprite/prototype/styles.css" \
  -file "app.js:/home/sprite/prototype/app.js" \
  ls /home/sprite/prototype

The format is local_path:remote_path. The ls command at the end verifies the files were uploaded.

Step 3: Start a Web Server

Start a simple HTTP server using npx serve. The key detail is using port 8080:

sprite exec "cd /home/sprite/prototype && npx serve -l 8080"

Important: Port 8080 is the only port that Sprites exposes externally. Other common ports like 3000 will return a "Bad Gateway" error.

Step 4: Make the URL Public

By default, sprite URLs require authentication. To share with clients or anyone without a Sprites account, make the URL public:

sprite url update --auth public

Step 5: Get the Public URL

Use the sprite url command to get the public URL for your prototype:

sprite url

This outputs something like:

https://prototype-demo-xxxx.sprites.app

Share this URL with your client or teammate—no login required.

Common Gotchas

Port 8080 is required: Sprites only exposes port 8080 externally. If you serve on port 3000 or any other port, you'll get a "Bad Gateway" error. Always use port 8080.

The tcp:// prefix is optional: While npx serve supports the verbose -l tcp://0.0.0.0:8080 syntax, you can simply use -l 8080 for the same result.

Alternative Servers

You're not limited to npx serve. Here are other options that work well:

Python (simplest, pre-installed):

sprite exec "cd /home/sprite/prototype && python3 -m http.server 8080"

PHP (for dynamic PHP projects):

sprite exec "sudo apt-get install -y php-cli && cd /home/sprite/prototype && php -S 0.0.0.0:8080"

Bun (requires a server script):

Create a server.ts file:

Bun.serve({
  port: 8080,
  hostname: "0.0.0.0",
  async fetch(req) {
    const url = new URL(req.url);
    const path = url.pathname === "/" ? "/index.html" : url.pathname;
    const file = Bun.file("/home/sprite/prototype" + path);
    if (await file.exists()) return new Response(file);
    return new Response("Not Found", { status: 404 });
  },
});

Then run it:

sprite exec "cd /home/sprite/prototype && bun server.ts"

Putting It All Together

Here's the full workflow in one go:

# Create sprite and activate it
sprite create prototype-demo
sprite use prototype-demo

# Upload files
sprite exec \
  -file "index.html:/home/sprite/prototype/index.html" \
  ls /home/sprite/prototype

# Start server (runs in foreground - use tmux or screen for persistence)
sprite exec "cd /home/sprite/prototype && npx serve -l 8080"

# In another terminal, make URL public and get the link
sprite url update --auth public
sprite url

That's it. No CI/CD, no S3 buckets, no Netlify configs—just a public URL for your prototype in under a minute.

AI Agent Prompt

If you're using an AI coding assistant like Claude Code, Cursor, or Windsurf, you can use this prompt to have it deploy your prototype for you:

## Deploy HTML Prototype to Sprites.dev

Upload the HTML prototype files to a Sprites.dev sprite and make them publicly accessible.

### Steps:

1. Create a new sprite named `prototype-demo` (or use an existing one)
2. Activate it with `sprite use prototype-demo`
3. Upload all HTML, CSS, and JS files from the current directory to `/home/sprite/prototype/` using `sprite exec` with
   `-file` flags
4. Start a web server on port 8080 using one of these options:
   - `sprite exec "cd /home/sprite/prototype && npx serve -l 8080"`
   - `sprite exec "cd /home/sprite/prototype && python3 -m http.server 8080"`
5. Make the URL public with `sprite url update --auth public`
6. Get and display the public URL with `sprite url`

### Important:

- Port 8080 is required—it's the only port Sprites exposes externally
- Use `-file "local:remote"` syntax for uploads
- The server runs in foreground—consider using tmux/screen for persistence