BloomTracker: Habit Garden with AI 🌱

Watch your daily habits bloom into a vibrant digital garden — powered by real-time AI insights that help you grow personally.

BloomTracker transforms habit tracking into a joyful, visual experience. Log your habits, see your virtual garden thrive with animated plants, flowers, and a fluttering butterfly as you build consistency. AI (powered by Groq's ultra-fast Llama 3.1) analyzes your habits and delivers personalized, motivational insights with a spring/garden theme.

Built for Code Spring 2026 hackathon with comprehensive features and improvements.

🚀 Live Demo | ✨ Features | 🛠️ Tech Stack | 📦 Installation

---

✨ Features

Core Habit Tracking

• 📝 Daily Habit Logging: Add habits with dates and descriptions
• 🎯 Habit Categories: Organize habits by type (Health 💪, Learning 📚, Productivity ⚡, Mindfulness 🧘, Social 👥, Creative 🎨)
• ✏️ Edit Habits: Modify habit descriptions and categories anytime
• 🗑️ Delete Habits: Remove habits with confirmation dialogs
• 📅 Date Filtering: View habits from specific dates or all-time logs
• 💾 Persistent Storage: All data saved locally with localStorage (cross-session)

Dynamic Garden Visualization

• 🌱 Progressive Growth: Central plant stretches based on consistency
• 🌿 Plant Evolution: Leaves sprout at 20% progress, flowers bloom at 60%
• 🌻 Flora Generation: Additional flowers & plants appear at 30%, 45%, 65%
• 🦋 Butterfly Animation: Flutters around at 85%+ progress
• ☀️ Dynamic Sky: Sun bounces, clouds drift, gradient backgrounds
• 🌾 Wilt Mechanism: Garden fades/grayscales if you miss a day — log today to revive!

Streak & Progress Tracking

• 🔥 Daily Streak Counter: Tracks consecutive days of logging
• 📊 Progress Bar: 15% per unique day (max 100%)
• 📈 Statistics Dashboard: Total habits, unique days, last 7 days, average per day, category breakdown

AI-Powered Insights

• 🤖 Real-Time Analysis: Groq's Llama 3.1-8B-Instant processes your habits
• 💬 Personalized Coaching: Motivational, garden-themed insights
• 🌱 Contextual Feedback: AI considers all logged habits for better recommendations

Data Management

• 📥 Export Function: Download all habits as JSON backup
• 🔄 Auto-Save: Real-time sync to localStorage
• 🛡️ Data Validation: Habit validation before saving

Progressive Web App (PWA)

• 📲 Installable: "Add to Home Screen" on mobile/desktop
• 🔌 Offline Ready: Core functionality works offline (data stored locally)
• 🎨 Custom Icons: Beautiful SVG icons for all devices
• ⚙️ Web App Manifest: Full PWA support with shortcuts

🛠️ Tech Stack

Layer	Technology
Framework	Next.js 14 (App Router) + TypeScript
Styling	Tailwind CSS 4 + PostCSS
Animations	Framer Motion
AI	Groq SDK (Llama 3.1-8B-Instant)
Utilities	date-fns, date calculations
State	React Hooks + localStorage
Icons	SVG-based, optimized
Fonts	Inter (Google Fonts)
Deployment	Vercel

---

📦 Installation

Prerequisites

• Node.js 18+
• npm or yarn
• Groq API key (free at console.groq.com)

Step 1: Clone & Install

git clone https://github.com/muturi643/bloomtracker.git
cd bloomtracker
npm install

Step 2: Configure Environment

Create .env.local in the root:

GROQ_API_KEY=gsk_your_free_api_key_here

Step 3: Run Development Server

npm run dev

Step 4: Build for Production

npm run build
npm run start

---

🎮 How to Use

Day 1: Plant Your First Habit

1. Navigate to /dashboard
2. Write a habit (e.g., "Read 30 pages of a book")
3. Select a category (e.g., 📚 Learning)
4. Click "Plant 🌱"
5. Watch your central plant grow! 🌿

Build Your Streak

• Log at least one habit every day to maintain your streak
• Miss a day? Your garden wilts 🌾 (visual feedback to motivate you)
• Log today to revive it instantly ✨

Get AI Insights

1. Log multiple habits
2. Click "Generate Insight ✨"
3. Get personalized, garden-themed motivation from Groq's AI

Manage Habits

• Edit (✏️): Change description or category anytime
• Delete (🗑️): Remove habits with confirmation
• Filter by Date: Pick a date to see only that day's habits
• Export: Download all data as JSON backup

---

🚀 Deployment

Deploy to Vercel (Recommended)

1. Push to GitHub
2. Connect repo to Vercel
3. Add GROQ_API_KEY environment variable
4. Deploy 🚀

---

📱 PWA Installation

On Mobile

1. Open in Chrome/Safari
2. Tap menu → "Add to Home Screen"
3. Launch as native app

On Desktop

1. Open in Chrome/Edge
2. Click install icon in address bar
3. Launch from applications

---

🔧 Recent Improvements (v1.1.0)

✅ Fixed Streak Calculation Bug - Corrected date logic
✅ Full CRUD Operations - Create, Read, Update, Delete habits
✅ Habit Categories - Organized with color-coded UI
✅ Statistics Dashboard - Track progress metrics
✅ Data Export - Download habits as JSON
✅ Better Error Handling - Improved API messages
✅ PWA Icons - SVG custom icons
✅ Enhanced Animations - Clouds, pulsing wilt indicator

---

📊 Data Structure

interface DatedHabit {
  id: string;              // Unique identifier
  text: string;            // Habit description
  date: string;            // YYYY-MM-DD format
  category?: HabitCategory; // health | learning | productivity | etc.
  completed?: boolean;     // Completion status
}

---

🐛 Known Limitations

• No offline AI: Insights require internet
• localStorage capacity: ~5-10MB (supports 1000+ habits)
• No cloud sync: Data is local-only
• No authentication: Single-device use

Future Improvements

• 🔓 User auth & cloud sync
• 📊 Advanced analytics
• 🎯 Habit templates
• 📱 Mobile apps
• 🎮 Gamification
• 🔔 Push notifications

---

🤝 Contributing

Contributions welcome! Help with:

• UI/UX enhancements
• Feature additions
• Performance optimization
• Testing

---

📄 License

MIT License

---

🙏 Thanks

• Groq - Fast AI inference
• Vercel - Seamless deployment
• Next.js - Amazing framework
• Framer Motion - Smooth animations
• Tailwind CSS - Rapid UI development

---

Made with 💚 for habit enthusiasts

⭐ Star on GitHub | 🚀 Deploy Now

Let your habits bloom! 🌸