Skip to main content
Photo from unsplash: projects/habit-track/habit-track_banner

Habit Tracker

Habit Tracker is a personal habit tracking website designed to help individuals build and maintain healthy habits. It allows users to set goals, track progress, and receive reminders to stay on track.

Short Explanation

Habit Track is a tool designed to help individuals build and maintain healthy habits. It allows users to set goals, track progress, and receive reminders to stay on track. This platform aims to make habit formation easier and more accessible to everyone.

Project Goals

This project aims to create a simple and user-friendly platform for individuals to track their habits and stay motivated. The website has several key features, including:

  • User authentication for personalized tracking
  • Habit creation and tracking
  • Progress visualization
  • Customizable reminders

Tech Stack Used

Habit Track is a web app built using React and Material UI for the frontend, and Express for the backend. The application utilizes a MySQL database to store user data and habits.

App Demo & Screenshots

Pro tip: click the image to make it full screen

landing-page
login
habit-list
habit-detail
progress
reminder
settings
statistics

Spotlight

We Won!

winner-runnerup
winner-auth0

We actually won 2 categories which are

  • Sustainability: Runner Up
  • Best Use of Auth0

We won a $150 cash prize and some swags 🤑. This is actually my first time winning a hackathon (last hackathon I only won the Deloitte Challenge), and I'm really happy about it. In the uni, I'm not the type of person that likes to compete in several competitions. Hackathon is an exception, it is super fun to create an application at such a fast pace while still considering the quality

Demo Video

Here is our submitted video, you can see all of the features here.

The Problems and How I Deal With It

Definitely, time is a problem, but Rizqi (front-end) and I, sprinted all of the UI and layout in just about 12 hours, we constantly work in a Zoom call so the process is fairly quick. I also use my Starter Repo which helps a lot to get it started.

We also have some quirks about authentication with Auth0, because it is normally used with Node.js environment, and our backend team is using Laravel, so they need some time to implement the features.

Lessons Learned

Definitely, time is a problem, but Rizqi (front-end) and I, sprinted all of the UI and layout in just about 12 hours, we constantly work in a Zoom call so the process is fairly quick. I also use my Starter Repo which helps a lot to get it started.

We also have some quirks about authentication with Auth0, because it is normally used with Node.js environment, and our backend team is using Laravel, so they need some time to implement the features.

Attribution

← Back to works