Welcome to the Habit Tracking Web App created using React! This web application allows users to track their daily and weekly habits. Developed using React, it provides an intuitive interface for managing habits and monitoring progress.
- Add new habits to track.
- Delete existing habits.
- Track daily activities for each habit.
- View a table of activities for the last seven days by means of Activity Table.
- Persistent storage using browser's local storage.
The project's folder structure is organized as follows:
habit-tracking-app/
├──.firebase
├── README.md
├── node_modules/
├── package.json
├── package-lock.json
├── public/
│ ├── index.html
│ └── favicon.ico
│ ├── android-chrome-192x192
│ ├── android-chrome-512X512
│ ├── favicon-16X16
│ ├── favicon-32X32
│ ├── manifest
│ ├── robots
│ ├── site.webmanifest
└── src/
├── App.js
├── index.js
├── styles.css
├── .firebasesrc
├──.gitignore
├──firebase
To get a local copy of this project up and running, follow these steps:
-
Clone the repository:
git clone https://github.com/DataWorker2001/Habit-Tracker
-
Change to the project's directory:
cd habit-tracking-app -
Install the dependencies:
npm install
-
Start the development server by typing the following command in the terminal:
npm start
-
The default web browser will open and we can see the app running on http://localhost:3000.
Once the app is running, you can perform the following actions:
- Add a new habit to track by entering it in the input field and clicking the "Add Habit To Track" button.
- Delete an existing habit by clicking the "Delete" button next to the habit.
- Track the status of each habit's daily activities using the drop-down menus in the activity table.
- View a table that displays the activities for the last seven days.
Contributions to this project are welcome. If you find any issues or have suggestions for improvements, please open an issue or submit a pull request.