Project · 04 / 07
HustleNote
A habit tracker built for people who actually want to stick with their routines.
01 — Overview
What this project is
HustleNote is a habit-tracking web app for daily routines, diet, and personal goals. It's built around a simple insight: most habit trackers are too rigid for how people actually live, and too aesthetic for how habits actually feel.
The app lets you create habits, mark daily completions, and visualize your consistency through weekly and monthly charts. The interface stays calm and minimal — the goal is to be useful, not to be a game.
Built solo, end to end — from database schema through frontend deployment. The kind of project that taught me where the hard parts of full-stack development really live: not in the framework, but in the data model.
02 — Key Features
What it does
- Daily habit tracking with clean check-in interactions
- Weekly and monthly charts visualizing streak consistency through Chart.js
- Diet and routine logging for tracking lifestyle habits beyond just yes/no completions
- Authentication for personal habit data, kept private to each user
- Responsive design — works seamlessly across phone, tablet, and desktop
03 — Tech Decisions
Why these tools
Next.js for the framework
Server-side rendering for fast initial loads, plus app-router conventions for organizing the code as it grew. The framework's flexibility meant I could prototype quickly without committing to a specific architecture too early.
MongoDB for storage
Habit data is naturally document-shaped — each habit has its own properties, and entries vary in structure. MongoDB's flexible schema let me iterate on the data model without painful migrations.
Chart.js for visualizations
Lightweight, well-documented, and produces clean charts without overengineering. For a personal project where the goal is clarity over wow-factor, it's the right choice.
04 — What I built
My contributions
- Designed the database schema and API endpoints from scratch
- Built the complete UI in React with Tailwind CSS
- Implemented authentication and user data separation
- Set up Chart.js with custom configurations for the analytics views
- Deployed to Vercel and connected to MongoDB Atlas