Plan — bahalaka App URL Structure

Where the web app lives, where the downloads live, how Capacitor fits in.

Intent

Define the URL structure for the bahalaka app on bahalaka.com so that the proposal site, the web app, and the native download pages all coexist cleanly under one domain.

The Decision

The Question

Should the app live at bahalaka.com/app/android and bahalaka.com/app/ios as separate paths?

Recommended: One App, One URL + Smart Download Page

bahalaka.com/               → proposal site (current, stays)
bahalaka.com/app/            → the web app (one codebase, works everywhere)
bahalaka.com/app/get/        → smart download page (auto-detects OS)

/app/ — The actual web app. Same HTML/JS/WASM on every device. Mobile browser, desktop browser, doesn't matter. This is also the PWA fallback — if someone can't install the native app, they use this.
/app/get/ — A single download landing page that auto-detects the visitor's OS. Shows the Play Store button for Android users, App Store button for iOS users, and "Use in browser" for desktop. One URL to share: bahalaka.com/app/get
Capacitor native apps — bundle the same /app/ code locally inside the native shell. They never load from the web URL. The app runs offline from the binary.

Why Not /app/android + /app/ios

The web app code is identical across platforms — same HTML, same JS, same WASM. Two paths = two copies of the same files.
Capacitor native apps don't load from a URL — they bundle the code inside the APK/IPA. So /app/android would never be hit by an actual Android app user.
Sharing gets complicated — you'd need to know which link to share with which person. /app/get handles it automatically.
Doubles the deployment — every update would need to push to two paths instead of one.

Scope

Folder Structure on Disk

bahalaka/
  index.html                  ← proposal site (existing)
  be/                         ← Be artifacts
  app/
    index.html                ← web app shell (loads WASM + bridge)
    bahalaka.js               ← JS bridge (~500 LOC)
    libbahalaka.wasm          ← C→WASM binary
    libbahalaka.js            ← Emscripten glue
    pages/
      login.html              ← TOTP auth
      chat.html               ← messaging
      status.html             ← presence + GPS
      schedule.html           ← calendar + requests
      finances.html           ← allowance + ledger
      agreements.html         ← templates + signing
      stories.html            ← field guide
      settings.html           ← preferences
    css/
      app.css                 ← dark theme, mobile-first
    get/
      index.html              ← smart download page

The Download Page (`/app/get/`)

Auto-detects OS via navigator.userAgent
Android detected: shows Play Store badge + link
iOS detected: shows App Store badge + link
Desktop detected: shows "Use in browser" button → redirects to /app/
Fallback: shows all three options
Same dark theme as the rest of bahalaka
One URL to share everywhere: bahalaka.com/app/get

Approach

Cloudflare Pages Routing

bahalaka.com/* — served from project root (existing)
bahalaka.com/app/* — served from /app/ subfolder (new)
No server config needed — Cloudflare Pages serves static files from folder structure
The proposal site and app coexist in the same repo, same deploy

Capacitor Config

// capacitor.config.ts
{
  appId: 'com.bahalaka.app',
  appName: 'bahalaka',
  webDir: 'app',           // points to the /app/ folder
  server: {
    androidScheme: 'https'  // uses https for local assets
  }
}

Capacitor's webDir points to the same /app/ folder. Native builds bundle it. Web deploys serve it. One source of truth.

Constraints

No separate repos — proposal + app + Be artifacts all in one repo
No build step for the web app — except Emscripten for WASM compilation
No server-side routing — Cloudflare Pages serves static files only
/app/ must work standalone (no dependencies on proposal site files)
Download page must work without JavaScript as a fallback (show all three options in HTML, JS enhances with auto-detection)

Summary

Three URLs, One Codebase

bahalaka.com/ — the pitch (proposal site, live now)
bahalaka.com/app/ — the product (web app, PWA fallback)
bahalaka.com/app/get/ — the door (smart download page)

Share one link: bahalaka.com/app/get. It figures out the rest.