TravelBin - Travel Planner

Live app ↗ Code on GitHub ↗

Inspired by Wanderlog, Google Sheets, Pastebin, Partiful, and soon Splitwise.

TravelBin makes trip planning simple and collaborative: create a travel list for your destination, add activities, and share a unique link with friends or family. Invite them by email to co-edit the itinerary in real time. I built it because tools like Wanderlog felt cluttered (especially on mobile) - so I aimed for something cleaner, blending collaborative planning with the simplicity of Pastebin, the look of Partiful, and the shared editing of Google Sheets.

TravelBin is now live, self-hosted on an Oracle Cloud VPS, with Cloudflare in front for DNS, TLS, and caching.

Key Features

  • ✅ Account creation & authentication
  • Custom auth with JWT-based session management, so only authorized users can create and edit trips.
  • 📝 Trip creation and activity tracking
  • Create trips by name and destination, then add structured activities - sightseeing spots, reservations, or to-dos.
  • 📩 Email-based collaboration
  • Invite others by email to co-edit a trip, with real-time shared editing for account holders.
  • 🔗 Shareable links for view-only access
  • Each trip has a unique public link anyone can view without an account.
  • 🌐 Fully responsive design
  • Clean, navigable layout across mobile, tablet, and desktop.

Tech Stack

Frontend

  • HTML, CSS, JavaScript
  • React.js

Backend

  • Python
  • Django
  • Django Rest Framework

Database

  • SQLite – AWS PostgreSQL when hosted on Heroku

Other

  • Oracle Cloud VPS for self-hosting, with Cloudflare for DNS, TLS, and caching
  • Keycloak - shared single sign-on (OAuth2 / OIDC) across my web apps
  • Visual Studio Code
  • Google OAuth 2.0 – optional for user account creation and authentication
  • Figma – design and planning
  • Jira – task and ticket management
  • JSON Web Tokens (JWT) – secure user authentication

Figures

Figma screenshot
Fig. 1 - Figma planning. Click for the full image.
Fig. 2 - user registration form, traditional or Google OAuth
Fig. 3 - login form.
Fig. 4 - logged in user's profile page displaying travel destinations. Add more here.
Fig. 5 - Profile page being viewed while logged out or not as the profile's user.
Fig. 6 - Destination's entry list while logged in. Only users part of this destination can add and edit.
Fig. 7 - Destination's entry list while logged out. Anyone with the link can view this.
Fig. 8 - Light mode/dark mode toggle available throughout the app.