Overview
A full-stack web application for tracking healthy habits with streak tracking, detailed statistics, and gamification features. Built with Angular and Firebase, the app provides a comprehensive solution for habit formation and maintenance.
Inspiration
I was inspired to create this project after reading Atomic Habits by James Clear. I was looking for a way to track healthy habits, but nothing I found served my specific needs:
Key Requirements
- Track habit completion as a streak - Visual motivation through consecutive days
- Visualize habit progress - Novel visualizations with detailed statistics
- Access from anywhere - Desktop, mobile, or any device with a browser
- Custom rewards - Gamification through customizable rewards for completing habits
Technical Implementation
Deciding to build my own webapp, I took Jeff Delaney’s course on full-stack development using the Angular Framework and Firebase as a backend.
Technologies Used
- Frontend: Angular framework with TypeScript
- Backend: Firebase (Authentication, Firestore, Hosting)
- Styling: Custom CSS with responsive design
- State Management: Angular services and RxJS
Features
- Streak Tracking: Maintain momentum by tracking consecutive days
- Progress Visualization: Charts and graphs showing habit trends over time
- Responsive Design: Optimized for both desktop and mobile experiences
- Cloud Sync: Access your habits from any device
- Gamification: Earn rewards for maintaining streaks
- Custom Habits: Create and customize unlimited habits
User Experience
The webapp was designed with desktop layouts in mind, though it’s fully responsive. It takes a couple of consecutive days to see exciting progress - just like building real habits!
Learning Outcomes
This project helped me develop skills in:
- Full-stack web development
- Firebase backend integration
- Angular framework and TypeScript
- Responsive design principles
- User authentication and data security
- Cloud deployment and hosting
Future Enhancements
Potential improvements include:
- Mobile app version
- Social features for accountability
- Advanced analytics and insights
- Habit recommendations based on patterns
- Integration with other productivity tools