Hīkoi

Hīkoi is te reo Māori for to walk. A group of friends walked a series of tracks around Aotearoa New Zealand. This is the private archive of them.

How it works

The map fills the screen and a rail of walks floats over it. Each walk is a row rather than a card, because the rail has already drawn one surface and a box inside it would only frame words the page had cleared. A row carries its date, its title and one line of facts whose values hold their own units, so nothing needs a label above it.

Selecting a walk fills its row and widens its route, while every other route drops to a quarter opacity. That dimming is the signal. The column beside the rail holds the note, who came and the photographs, since the map is already drawing the route and the row is holding the numbers.

How it's built

• Next.js 16 with the App Router and TypeScript, deployed on Vercel.
• Supabase for Postgres and Google sign in.
• Google Maps through @vis.gl/react-google-maps, with Advanced Markers.
• Mantine 9 for form and button primitives, layout in plain CSS modules.

Replaying the walk

The route traces itself from start to end over 3.4 seconds, eased on a cosine curve because a walk doesn't start at full speed or stop dead, and the mark at the far end is held back until the line reaches it. The trace runs on its own canvas above the map tiles, since animating the polyline itself smears on a vector map.

Read only, by design

The browser never writes anything, and the database grants no write policies at all. Row level security matches the email on the token against the members table, so someone outside the list can sign in and still see nothing.