Healthy Habits Tracker

• 

  Energy meter

• 

  Chart

• 

  Habits

Inspiration

In today’s fast-paced world, it’s easy to overlook small daily habits that contribute to long-term well-being. I was inspired to build something simple yet powerful — a tool to help people stay consistent with healthy routines like hydration, rest, and mindfulness. I wanted to create a tracker that’s not only useful but also motivating and enjoyable to use.

What it does

Healthy Habits Tracker is a simple, gamified wellness web app that helps users build and maintain healthy daily routines. It features:

• Interactive habit check-ins
  
• Visual progress tracking with charts
  
• Motivational feedback
  
• Offline support

How I built it

I built the app using:

• HTML, CSS, and JavaScript
• Local Storage for saving user data locally
  
• A responsive layout for both mobile and desktop
  

Challenges I ran into

• Designing a sleek yet functional UI that adapts across screen sizes
  
• Ensuring that offline support worked seamlessly with Service Workers
  
• Managing local data persistence without a backend
  

Accomplishments that I'm proud of

• Built a fully functional and polished wellness tracker from scratch
  
• Successfully implemented offline support for a smoother user experience
• Balanced simplicity with meaningful features for habit-building
  

What I learned

• Best practices in responsive, mobile-first web design
  
• How to integrate data visualization in a user-friendly way

What's next for Healthy Habits Tracker

• Add habit customization and more habit categories
  
• Introduce login and user profiles
  
• Add reminders or push notifications
  
• Implement gamification badges for consistency and progress
  
• Improve styling with enhanced light/dark theme options
  
• Integrate a database for persistent, scalable data storage
  
• Expand into a multiplatform app:
  • Windows (using PyQt5)
    
  • Android (using Jetpack Compose)
    
  • Web (for universal access)

Built With

• css
• html
• javascript