PlanWise — group trip planner

A static site for planning trips with multiple families at once. People sign up, start a trip they own, and other families join that trip. Everyone across all the families shares one plans-and-voting board, so the whole group decides the itinerary together. Votes and plans update live for everyone.

It runs on GitHub Pages (static hosting) plus Firebase Realtime Database for the shared data. No server, no build step. Works for any destination anywhere in the world.

How the pieces fit

• Trip — the top-level group for one journey. It holds multiple families and owns the shared plans + voting board. Whoever creates it is the trip owner.
• Family — a household inside a trip, with its own owner and members.
• Two invite codes, two jobs:
  • Trip code — a household organizer uses it (plus their family's name) to bring their family onto the trip.
  • Family code — a family's owner uses it to add people to that household.
• Plans + voting live at the trip level. One vote per person per plan; the list sorts by votes and marks the leader in gold. Each plan can carry an optional link and an optional image — either a pasted image URL or an uploaded file. Uploads are resized/compressed in the browser and stored under a separate planmedia node, loaded lazily so live voting stays fast.

Who can do what

• Trip owner: regenerate the trip code, remove a family from the trip, delete any plan.
• Family owner: regenerate their family code, remove members from their family, delete their own plans.
• Everyone: add plans and vote.

Files

• planwise.html — the whole app.
• database.rules.json — database security rules to paste into Firebase.
• README.md — this guide.

Setup (about 10 minutes)

1. Create a Firebase project

Go to https://console.firebase.google.com → Add project (e.g. planwise). Analytics is optional.

2. Turn on Realtime Database

1. Build → Realtime Database → Create Database, pick a location, Start in locked mode.
2. Open the Rules tab, paste the contents of database.rules.json, and Publish.

3. Register a Web app and copy the config

Project Settings (gear) → General → Your apps → Web (</>). Register it and copy the firebaseConfig object.

4. Paste your config into planwise.html

Near the top of the <script type="module"> block, replace the whole firebaseConfig = { ... } object with yours. Make sure databaseURL is present (it looks like https://YOUR-PROJECT-default-rtdb.firebaseio.com); add it from the Realtime Database page if the copied config didn't include it.

5. Deploy on GitHub Pages

1. Create a repo (e.g. planwise), add these files, commit to main.
2. Settings → Pages → Deploy from a branch, choose main / / (root), Save.
3. Open https://YOUR-USERNAME.github.io/planwise/planwise.html.

Until you add your config, the page shows a friendly setup screen instead of erroring.

Try the full flow

1. Sign up, New trip, name it and your family → you're the trip owner.
2. From the trip, copy the trip code and send it to another household's organizer. They sign up, choose Join trip, paste the code and name their family.
3. Each family owner copies their family code to add their own people.
4. Everyone adds plans and votes — the shortlist reorders live.

A note on security

Lightweight username/password auth keeps signup friction-free (no email). The rules stop existing accounts from being overwritten, but the database is otherwise openly readable — fine for a private planner among family, not for anything sensitive. Don't reuse an important password. Want it locked down properly? The clean upgrade is Firebase Authentication with rules keyed to auth.uid — happy to convert it.

Updating the Firebase SDK version

The app pins Firebase 10.12.0 in two CDN import URLs at the top of the script. To update, bump the version in both https://www.gstatic.com/firebasejs/<version>/... URLs.