Editing One Quick Way To Host A WebApp (section)

== The Environment ==

=== Domain ===

I usually have a domain already but otherwise I buy it on Namecheap because it's straightforward to use. It's pretty much only good as a domain registrar and I don't use any of the other features with it. Any registrar is fine here.

=== DNS ===

The first thing I do is create a Cloudflare zone and point the NS records to Cloudflare. CF is way better at managing DNS and has all sorts of features that make it worthwhile. Then, once CF is set up, I point the record at my host ''without proxying''. This does reveal the underlying IP but that's fine because no one is trying to hurt me. 

I do this primarily to simplify HTTP-based certbot later. I've also done Cloudflare DNS based certbot and it's actually just as easy, but you have to create a cloudflare token for the zone and put it on the host.

But an additional benefit is that at this stage if you put a web server on the host then you're functioning as raw as can be. You can run (in a temporary directory with a simple `index.html`):

    python3 -m http.server 10000

And verify that you can access it at http://sub.roshangeorge.dev:10000 , and you know you're set up for the world. You don't have HTTPS but what are you securing anyway. If you can't access things at this point, you should try via the IP (which means DNS is the issue) and then from the host itself (which may mean that you didn't bind to the external IP or 0.0.0.0 if you're promiscuous) and then you should check your firewall.

=== Nginx ===

Nginx is a good web server to use as a reverse proxy. Some people use Caddy since it has Let's Encrypt built-in for HTTPS but this works for me so I use it. k3s and friends use Traefik and that works well too. In the LLM age, one advantage is that Nginx is well-documented and has been around for a while with a consistent configuration format.

As usual I make one of these simple config files in `/etc/nginx/sites-available/sub.roshangeorge.dev` and symlink from `/etc/nginx/sites-enabled/sub.roshangeorge.dev` to it.

<syntaxhighlight lang="nginx">
server {

    server_name sub.roshangeorge.dev;

    location /uploads/ {
        alias /mnt/r2/uploads/; # Serve static files from this directory
        expires max;
    }

    location / {
        proxy_pass http://localhost:10000; # Proxy pass to app
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

}
</syntaxhighlight>


This is roughly the same each time. I want some things to be static, usually favicons and robots.txt and llms.txt and stuff like that. And the rest I'm going to send over to the app which is going to run at that port.

I perform the cargo-cult ritual of restarting nginx after each of these things, though technically a `reload` should do the trick.

    sudo systemctl restart nginx

Once this is all running, we should be able to go to http://sub.roshangeorge.dev and it should correctly show what the app would show (which in our case is Python's default `http.server`). If I have websockets  there are a [https://stackoverflow.com/a/14969925 few more incantations around the `Upgrade` header].

=== Certbot ===

For SSL, I just run certbot on the machine. When you run certbot for the first time it will prompt you to select which host you want to configure. Or you could just tell it yourself.

    sudo certbot --nginx -d sub.roshangeorge.dev

As usual, I do the ritual restart of the nginx. Then we should be able to access https://sub.roshangeorge.dev over SSL and we're pretty happy about the environment.

If you check your `sites-available/my-site` you'll see that certbot has added the certificates in and everything. It also adds a recurring job to refresh the certificates.

=== Cloudflare Web Proxy ===

At this point if you want, you can go back and switch the DNS settings on Cloudflare to start proxying. If you then access your site it should just work. Doing it earlier makes debugging hard, but doing it now should just work.

=== Cloudflare R2 ===

I also like to mount an R2 bucket so that I have lots of storage and a backup target to hit.

    s3fs r2-storage /mnt/r2 -o rw,allow_other,umask=000,passwd_file=/etc/fuse-r2/passwd-s3fs,url=https://userspecific.r2.cloudflarestorage.com,use_path_request_style,dev,suid

You'll have to make sure your `/etc/fuse.conf` has the following in order to allow ordinary users access

    user_allow_other

And then you can mount as one user who has access to both MySQL and your R2 and they can go around backing up stuff to R2!