Skip to content

dbkarashev/sytt

Repository files navigation

sytt

An interactive 3D globe of anonymous stories from people going through hard times.

Live

Getting started

npm install
cp .env.example .env.local
npm run dev

Fill in the copied .env.local before running if you want live Supabase/Groq/Upstash; otherwise the app falls back as described below.

Dev works with any subset of env vars. Behaviour when each is missing:

  • SUPABASE_SECRET_KEY — falls back to an in-memory store seeded with twelve sample stories.
  • GROQ_API_KEY — moderation skips the LLM layer in dev. Production fails closed.
  • KV_REST_API_URL / KV_REST_API_TOKEN — rate limit uses an in-memory map in dev. Production fails closed (429).

Stack

Next.js React TypeScript Tailwind CSS Three.js Supabase Upstash Groq Vercel

Rendering — Next.js 16.2.3 (App Router, Turbopack), React 19.2.4, TypeScript 5, Tailwind CSS 4. The globe is react-globe.gl 2.37 on top of three + h3-js 4.4.

Data — Supabase stores stories (PostgreSQL + REST, no SDK). Upstash Redis handles rate limiting via the Vercel integration (@upstash/ratelimit 2.0 sliding window, 3/h per IP hash). Groq's Llama 3.3 70B moderates content with a crisis-aware prompt that allows crisis-related content and blocks attacks, threats and spam.

Deploy

main auto-deploys to production on Vercel. dev and any other branch get preview deploys on push. Branch protection on main requires a pull request; linear history is enforced.

From dev, after pushing your commits:

gh pr create --base main --head dev --fill
gh pr merge --rebase
git reset --hard origin/main && git push --force-with-lease  # keep dev aligned

Architecture

Module layout, data flow, moderation prompt design, globe internals, rate-limit semantics and every non-obvious decision are in SPEC.md. Read that before making structural changes.

License

This project is licensed under the MIT License.