· docs

Introduction

What wristkit is, who it is for, and how it works.

What is wristkit?

wristkit is a small open source library of React components. You copy the files from this site into your Next.js project so you can show your Apple Health data on the web. No backend to write, no third party SaaS, and no data leaving the infrastructure you already own.

Copy the component, point it at your own Supabase, import the iOS Shortcut on your iPhone, and a few minutes later your Apple Watch data is showing up in your Next.js app.

Zero telemetry. MIT license. Single user in v1.

Who is it for?

Developers who want a personal health dashboard on their own site
Athletes who want to share training data without handing it to a third party
Anyone who wants to keep their health data end to end on their own stack

How it works

plaintext

iOS Shortcut → POST /api/wristkit-sync → Supabase → React components

The iOS Shortcut reads your Apple Health data and posts it to your Next.js app
A route handler checks the payload and writes it to your Supabase Postgres database
React components read from your database and render the data

wristkit never touches your data. The site is a catalog of files. You copy them and run them on your own stack.

What ships in v1

TodayActivityCard with Move, Exercise and Steps rings and every state
A route handler at app/api/wristkit-sync/route.ts
Two SQL migrations for Supabase
An iOS Shortcut file you install on your iPhone

Stack requirements

Next.js 15 with App Router
A Supabase project (the free tier works)
An iPhone with the Shortcuts app