I really cannot recommend tailscale enough for how easy it is to set up a secure network of your own devices.
Edit: any pointers on how to set this up would be appreciated! Maybe I’m using the wrong search engine, but I haven’t found this scenario laid out clearly, yet.
In practice though - you don't have to worry about any of this! These are the steps:
* Create a tailscale account (there's a good free plan)
* Set up server. Give it a hostname (I'll use "mypi" in this example)
* Set up your web service on server - check you can get to it locally (e.g. connected by wire or just on http://localhost on that computer)
* Install tailscale on your server, and log in to your tailscale account (tailscale login and follow prompts)
* Install tailscale on your phone/laptop. Log into to tailscale
* On your phone/laptop go to http://mypi and it should Just Work!
When the VPN is on, the phone directs any traffic for 10.200.200.0/24 through the VPN and the rest of the traffic through the normal network stack. This is often called split vpn or split tunnel.
The other end of the VPN needs to be running wireguard and accessible from the internet. I have a VPS for this because my desktop is behind a firewall. But I can connect from my desktop to the VPS over wireguard (same setup) with keepalive, and they can all talk to each other over that private network.
I don't usually have this on, but occasionally if I want to ssh back home from my kid's soccer practice, I'll use it. I ssh to the 10-net address for my laptop after bringing up the split vpn.