DoneIt is a simple task tracker application built as part of the Firebase course at ITI. It allows users to sign up, sign in, and manage their tasks efficiently. The application is built using Firebase for authentication and Firestore for data storage. The project also utilizes JavaScript modules for better code organization and data encapsulation.
- User Authentication: Sign up and sign in using email and password.
- Task Management: Add, update, delete, and toggle the status of tasks.
- Task Filtering: Filter tasks by status (all, pending, completed).
- Task Search: Search for tasks by title.
- Responsive Design: The application is responsive and works well on different screen sizes.
- Modular Code: The project uses JavaScript modules for better code organization and data hiding.
- Frontend: HTML, CSS, JavaScript (ES6 Modules)
- Backend: Firebase (Authentication, Firestore)
-
Clone the Repository:
git clone https://github.com/your-username/doneit-task-tracker.git cd doneit-task-tracker
-
Install Dependencies: Since this project uses Firebase via CDN, there are no additional dependencies to install.
-
Set Up Firebase:
- Create a new Firebase project at Firebase Console.
- Add a web app to your Firebase project and copy the Firebase configuration.
- Replace the
firebaseConfig
object inmain.js
with your Firebase configuration.
-
Run the Application:
- Open the
index.html
file in your browser to start using the application.
- Open the
The application uses Firestore to store tasks. Below is the ERD for the Firestore collections:
users (Collection)
├── userId (Document)
│ ├── email: String
│ └── tasks (Subcollection)
│ ├── taskId (Document)
│ │ ├── title: String
│ │ ├── description: String
│ │ ├── status: String ("pending" or "completed")
│ │ └── userId: String (Reference to the user)
-
Users Collection:
email
: The email address of the user.tasks
: A subcollection of tasks associated with the user.
-
Tasks Collection:
title
: The title of the task.description
: The description of the task.status
: The status of the task, either "pending" or "completed".userId
: The ID of the user who created the task.
The main.js
file contains all the logic for user authentication and task management. Below is a summary of the main functions:
-
Authentication:
signUp()
: Handles user sign-up.signIn()
: Handles user sign-in.signOut()
: Handles user sign-out.
-
Task Management:
addTask()
: Adds a new task or updates an existing task.getTasks()
: Retrieves and displays tasks based on the selected filter and search query.toggleTaskStatus()
: Toggles the status of a task between "pending" and "completed".editTask()
: Populates the form with task details for editing.deleteTask()
: Deletes a task after confirmation.
-
Utility Functions:
clearInputs()
: Clears the form inputs after adding or updating a task.search()
: Handles the search functionality for tasks.filter()
: Handles the filtering of tasks by status.
![Sign Up Page] ![Sign In Page] ![Main Page]
Contributions are welcome! Please feel free to submit a pull request or open an issue if you find any bugs or have suggestions for improvements.
This project is licensed under the MIT License - see the LICENSE file for details.