Smallweb Demo

Learn more about smallweb at smallweb.run.

I've tried to protect this demo from the most common attacks, but please don't explicitly try to break it (that's just rude). If the demo is down, please report it to me on bluesky, discord.

Creating your own app

1. Open the editor at vscode.smallweb.club

2. Create a new folder in the root directory (ex: /myapp/).

3. Create the /myapp/main.tsx file in the new folder with the following content:

   /** @jsxImportSource https://esm.sh/preact */
   import { render } from "npm:preact-render-to-string";
   
   export default {
       fetch: (_req: Request) => new Response(render(<div>Hello from smallweb! </div>), {
           headers: {
               "Content-Type": "text/html",
           },
       }),
       run: (_args: string[]) => {
           console.log("Hello from smallweb!");
       },
   }

4. Go the https://myapp.smallweb.club to preview your website.

Accessing the smallweb cli

You can access the smallweb cli by using: ssh -p 2222 [email protected] help.

And trigger your app cli from the command line using:

$ ssh -p 2222 <myapp>@ssh.smallweb.club`
Hello from smallweb!

Add the following snippet to your ssh config at ~/.ssh/config:

Host smallweb.club
    HostName ssh.smallweb.club
    LogLevel ERROR
    Port 2222
    User _
    RequestTTY yes

It will shorten the command above to ssh smallweb.club !

You can use any sftp client to edit your files. For example, using lftp:

lftp sftp://smallweb.club

Or edit it using vim:

vim scp://smallweb.club/myapp/main.tsx

Or even mount the filesystem using sshfs, and edit files from your preferred editor:

mkdir ~/smallweb.club
sshfs smallweb.club:/ ~/smallweb.club

Example

• Excalidraw (sources in the /excalidraw folder)
• Smallblog (sources in the /smallblog folder)
• Invoice (sources in the /invoice folder)

You can list all existing websites by going to ls.smallweb.club.