Visualize your travels with TravelMap

Date: 2024-02-07 | create | tech | business | projects | travelmap |

TL;DR: TravelMap is an app that allows you to visualize your travels on a map.


Each year I travel to several places and each year I write reflections with a summary of my experiences and learnings. This means I always have a section dedicated to talking ab my travels as that ends up being a large chunk of my year (22% in 2023).

But I've never really had a good format for these things.

  • Tried lists - Boring
  • Included IG pictures - Too long, a lot of work, makes my page load slow, and prob boring for others
  • Back to lists - still boring

So I've just used lists for the past couple reflections but it doesn't really do a good job of representing these travels in a concise, meaningful way.

I previously tried to solve this way back in 2018 with Geolog but that interface ended up being too clunky for me to use regularly and for anyone else to reasonably use it at all.

TravelMap for visualizing travels

My 2023 Travels - visualized with TravelMap

My 2023 Travels - visualized with TravelMap.

TravelMap is my latest iteration on this problem, trying to make mapping my own travels easier so I can better share where I've been.

It's currently very simple - mapping a list of (Latitude, Longitude) locations on a crude map. It's a bit clunky (and ugly) but it does the job so sharing it out now to see if there's interest for using / improving.

How it's built

I love building things so ofc there will be a section on how I built it. TravelMap is built with my typical tech stack - boring, battle-tested technologies I'm comfortable with. I spent a little bit of complexity budget on exploring mapping software (for the product) and low-js frontend tech (for my own research).

Here I'll list my tech stack and relevant guides on how I use / think ab these things.

Frontend: Server-side-rendered HTML with Giraffe.ViewEngine and AlpineJS for clientside logic

Map: LeafletJS - Free and pretty easy to use

Backend: F# / Giraffe - My go-to for spinning up fullstack apps quickly

Hosting: Serverless containers on Digital Ocean App Platform


Next time you want to visualize your travels, consider TravelMap!

Any and all feedback is greatly appreciated! I'm particuarly interested in how to make the mobile web experience better and ways to make the inputs / sharing experience easier overall.

If you liked this post you might also like:

Want more like this?

The best / easiest way to support my work is by subscribing for future updates and sharing with your network.