Website for Dave Snider

https://davesnider.com

This site is powered by SvelteKit, Svelte, Turso, Cloudflare R2 and hosted on Fly.io. It is provided publicly so others can learn from the code, but please do not copy the design.

The fonts are paid-fonts I've licensed through SG Type and Berkeley Graphics. Using these fonts in your own project without obtaining your own license is illegal and not very cool.

Architecture

graph TB
    subgraph Activity["Activity Feed"]
        APIS[GitHub / Bluesky / Reddit<br/>Hacker News / BoardGameGeek]
        WORKERS[Cloudflare Workers<br/>scheduled cron jobs]
        PLEX[Plex Server]
    end

    subgraph Museum["Museum"]
        WATCH[Linux Desktop<br/>watchfiles script]
        VISION[Google Vision API<br/>OCR + labels]
    end

    subgraph Content["Blog Content"]
        MDSVEX[mdsvex markdown<br/>with Svelte components]
    end

    subgraph Bookmarks["Bookmarks"]
        TUI[Linux Desktop<br/>bookmarks TUI]
        FIREFOX[Firefox session<br/>active tab]
    end

    subgraph Flights["Flight Recorder"]
        MSFS[Windows Sim PC<br/>MSFS 2024 via SimConnect]
        RECORDER[flight-recorder<br/>Python, runs at login]
        SIMBRIEF[SimBrief OFP<br/>route enrichment]
    end

    subgraph FLY["Fly.io"]
        APP[SvelteKit App]
    end

    subgraph Storage
        TURSO[(Turso SQLite<br/>embedded replica)]
        R2[Cloudflare R2]
        GCS[Google Cloud Storage<br/>backup]
    end

    APIS --> WORKERS
    WORKERS -->|POST /api/activity/ingest| APP
    PLEX -->|webhook| APP

    WATCH --> VISION
    WATCH --> R2
    WATCH --> GCS
    WATCH --> TURSO

    FIREFOX --> TUI
    TUI --> TURSO

    MSFS -->|1 Hz telemetry| RECORDER
    SIMBRIEF --> RECORDER
    RECORDER -->|POST /api/activity/ingest/flight<br/>+ photos| APP
    R2 -->|PMTiles basemap<br/>read directly by the browser| APP

    MDSVEX --> APP
    APP --> TURSO
    APP --> R2

Loading

Credentials

You'll need access to a Turso API key to run the museum locally. If you're curious, I wrote up a detailed blog about how it works over here.

Commands

All commands are run from the root of the project, from a terminal:

Command	Action
pnpm install	Installs dependencies
pnpm run dev	Starts local dev server at localhost:5177
pnpm run build	Build your production site to .svelte-kit/
pnpm run preview	Preview your build locally, before deploying
pnpm run lint	Run eslint and svelte-check
pnpm run format-write	Format code with Prettier
pnpm run test	Run Playwright e2e tests

Scripts

The src/scripts directory has a few Desktop scripts I use on my Linux desktop to upload to the museum portion of this site.

Watch script

The watchfiles script monitors a local folder for new files (screenshots, images, etc.) and automatically:

1. Uploads them to both Google Cloud Storage (backup) and Cloudflare R2 (serving)
2. Creates a database record in Turso with a unique ID
3. Runs Google Vision API on images to extract labels, text content, and dominant colors
4. Sends a desktop notification with the shareable URL (copied to clipboard)
5. Deletes the local file after processing

This powers the screenshot workflow described in this blog post. Configure WATCH_FOLDER in your .env to point to your screenshot directory.

pnpm run watchfiles

Upload Script

The uploadfiles script is for batch uploading a folder of files into a named gallery. Useful for one-time migrations or creating curated collections.

pnpm run uploadfiles /path/to/folder "Gallery Name"

Bookmarks TUI

The tui/ directory contains a small Python Textual terminal app for managing the bookmarks in the links table — the site only displays public links, so this is where they get created, edited and deleted. It's bound to GNOME hotkeys that open it in a floating terminal, prefills new bookmarks from the active Firefox tab, and talks directly to Turso. It inherits the terminal's base16 color scheme. See tui/README.md for keys and setup.

cd tui && uv run bookmarks-tui

Flight Recorder

The flight-recorder/ directory is a small Python service that runs on the Windows PC where I fly Microsoft Flight Simulator 2024. It connects to the sim over SimConnect, samples position, altitude, speeds, wind, fuel and G-force once a second, and works out flight boundaries on its own: wheels-up starts a flight, two minutes stopped on the ground ends it, and touch-and-gos extend the same flight. Sim pauses are cut out of the time base so the timeline reflects flight time, not wall-clock time.

When a flight ends it simplifies the track, matches it against a recent SimBrief flight plan for airports, aircraft and route (falling back to the nearest airport from an offline database), then POSTs it to /api/activity/ingest/flight with the ingest bearer token. Photo-mode screenshots taken during the flight upload afterwards and pin to the map and timeline at the moment they were taken. Failed pushes queue on disk and retry, and every flight's raw samples are dumped locally so any flight can be replayed during development on Linux.

The activity feed renders each flight as a card with the flown track on a MapLibre basemap (a Protomaps planet extract served straight from R2 as PMTiles, no tile server), an elevation profile synced to the map with a replay button, engine and fuel gauges, and any photos. Flights can also be tagged on the card as legs of a challenge trip, which the FlightTrip component turns into a single connected map inside a blog post.

See flight-recorder/README.md for the Windows install, the exe build, the replay dev loop and the one-time basemap hosting.

cd flight-recorder && uv run pytest                          # unit tests
uv run flight-recorder --replay dump.csv --dry-run           # replay a real flight locally

Local Tunnel for Webhooks

To test webhooks locally (Plex, GitHub, etc.), use cloudflared to create a tunnel that exposes your local dev server to the internet.

First-time setup

1. Install cloudflared:

   # Arch Linux
   yay -S cloudflared
   
   # macOS
   brew install cloudflared
   
   # Other: https://developers.cloudflare.com/cloudflare-one/connections/connect-networks/downloads/

2. Authenticate with Cloudflare:

   cloudflared tunnel login

3. Create the tunnel:

   cloudflared tunnel create local-dev

   Note the tunnel ID from the output.

4. Route DNS (requires domain on Cloudflare):

   cloudflared tunnel route dns local-dev local.davesnider.com

5. Create ~/.cloudflared/config.yml:

   tunnel: local-dev
   credentials-file: /home/YOUR_USER/.cloudflared/TUNNEL_ID.json
   
   ingress:
     - hostname: tunnel.site.com
       service: http://localhost:5177
     - service: http_status:404

Running the tunnel

cloudflared tunnel run local-dev

Your local server is now accessible at https://tunnel.site.com. Use this URL for webhook configurations (Plex, GitHub, etc.).