Slimming Journal

Mobile-first health tracker built on Next.js App Router, demonstrating time-aware full-stack architecture.

Wed Sep 10 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

🏃 The Project: Slimming Journal

Slimming Journal is a focused, mobile-first health tracker that combines frictionless check-ins with clear trend insights. I built this to master the new paradigms of the Next.js App Router and prove reliable full-stack data integrity in a complex, date-sensitive product.

🛑 The Challenge: Time & Reliability at Scale

Any global data tracking app fails if it can’t handle time zones. The core challenge was building a system where “today” accurately means the user’s today, coupled with ensuring security and fast performance for the mobile user experience.

Architecture Signal: Timezone Resilience

Timezone-Aware Logic: All date-sensitive logic (daily/weekly ranges) respects the user’s configured time zone, ensuring reports and check-ins are always correct—a critical feature often missed in production apps.

DX & Delivery: Server Actions Flow

Modern Stack: Full-stack logic powered by Next.js Server Actions and Supabase. Server actions are guarded (withUser(...)) and use Zod for schema validation at the boundary, stopping bad data immediately.

🔑 Key Trade-offs & Features

  • Two-Speed Tracking: Lightweight Daily inputs for habit building, coupled with higher-signal Weekly metrics for low-variance trend lines.
  • UI/UX Excellence: Mobile-first layout, calendar with dual indicators (daily/weekly), and Lottie animated empty states for a polished, forgiving experience.
  • Notifications: Optional Telegram integration for a gentle, privacy-respecting nudge (easily disabled by removing ENV vars).

Tech Stack: Next.js App Router, TypeScript, Supabase, Tailwind CSS, Zod, React Hook Form.

View Slimming Journal on GitHub