ZenPlan

AI-Powered Habit Tracker & Routine Planner built on Next.js, Vercel, and AWS DynamoDB.

Comment

Inspiration We built ZenPlan to solve a core problem: most habit trackers lack intelligent guidance and beautiful, engaging interfaces. We wanted to create a premium experience where users don't just track habits, they get personalized AI coaching that learns from their streaks and suggests next steps. The combination of an interactive, celebratory dashboard (with sound chords and confetti animations) plus seamless monetization through Stripe makes habit-building feel rewarding and sustainable.

What it does ZenPlan is a premium, dark glassmorphic habit tracker and daily routine planner. It helps users maintain consistency using:

How we built it Frontend: Next.js 16 (App Router), React 19, Lucide icons, and Tailwind CSS v4.

Backend: Next.js Route Handlers deploying as Vercel Serverless Functions. Database: Dual-mode engine switching between a cookie-based session simulator (for easy previewing) and high-scale Amazon DynamoDB (using @aws-sdk/client-dynamodb). Integration: Connected Vercel Edge to AWS using official secure integrations.

Challenges we ran into Serverless File Storage Persistence: Overcame ephemeral serverless containers by building a server-side cookie fallback mechanism for local simulation.

Dynamic Route Caching: Bypassed Edge CDN caching by returning explicit no-store cache headers and utilizing client-side timestamp cache-busters.

Accomplishments that we're proud of Compiles with zero compilation or TypeScript errors under Next.js 16/React 19.

Beautiful, highly-polished slate-950 dark glassmorphic theme. Fully automated database table provisioning script (npm run setup-db).

What we learned We overcame critical serverless architecture challenges: building a cookie-based fallback mechanism to persist data across ephemeral Vercel containers, and implementing explicit no-store cache headers to bypass CDN caching on dynamic routes. We also discovered the power of Next.js 16's App Router paired with React 19, the stack compiled with zero TypeScript errors. Most importantly, we learned that blending beautiful glassmorphic design with robust backend infrastructure creates an experience that feels both polished and powerful.

What's next for ZenPlan

Mobile app expansion (React Native) Advanced AI analytics: Deeper streak predictions and personalized motivation triggers Social features: Share habit streaks and challenges with friends Integrations: Connect with health apps (Apple Health, Fitbit) for automatic habit logging Premium upsells: Coaching tiers and community challenges

Built With

Share this project:

Updates