An application to help the user track their daily habits, where it's possible to sign-up and sign-in to create a personal routines
Habit tracker web application. HTML5, CSS3 and ReactJS.
Try it out now here.
This app has the following features:
- Enables the user to sign in their account
- In case they don't have any, it's possible to create one in the sign up page
- To sign up, the user needs to inform their Email, Password, Name and an valid URL image chosen by them.
- After logging in, the
TodayPage
is shown, in which the user can:- Check their daily habits, if they have any
- Click on the checkmark to mark it as done in that day
- Track their current streak and record of days that task/habit has been done
- And shows the user their daily progress in a circular progress bar on the botton center of the page
- In the case the user has no habits to be tracked, they can go to the
HabitsPage
, being able to:- Create their habits
- Choose the days to do the habit
- Save or Cancel the habits' creation
- And delete the habit by clicking on the trashcan icon
- In the
HystoryPage
the user can track their progress on a month calendar, where it's possible to track the days the habis have been done or not
ReactJS, HTML and Styled Components.
-
Clone this repository
-
Install dependencies
npm i
- Run the app with
npm start
- You can optionally build the project running
npm run build
- Finally, access http://localhost:3000 on your favorite browser (unless it is Internet Explorer. In this case, review your life decisions)
- LinkedIn - Alan de Andrade