{"id":24333265,"url":"https://github.com/turtlebeasts/quadbtech-todo-application","last_synced_at":"2026-04-29T21:34:50.835Z","repository":{"id":272739780,"uuid":"917587375","full_name":"turtlebeasts/QuadBTech-ToDo-application","owner":"turtlebeasts","description":"Todo application for quadbtech","archived":false,"fork":false,"pushed_at":"2025-01-16T10:19:06.000Z","size":461,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-16T11:03:53.242Z","etag":null,"topics":["material-ui","reactjs"],"latest_commit_sha":null,"homepage":"https://quadb-tech-todo-app.netlify.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/turtlebeasts.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-16T09:18:33.000Z","updated_at":"2025-01-16T10:19:07.000Z","dependencies_parsed_at":"2025-01-16T11:06:18.122Z","dependency_job_id":"28ccc1ab-bd6d-4f77-94e3-be2b8ff47760","html_url":"https://github.com/turtlebeasts/QuadBTech-ToDo-application","commit_stats":null,"previous_names":["turtlebeasts/quadbtech-todo-application"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/turtlebeasts%2FQuadBTech-ToDo-application","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/turtlebeasts%2FQuadBTech-ToDo-application/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/turtlebeasts%2FQuadBTech-ToDo-application/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/turtlebeasts%2FQuadBTech-ToDo-application/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/turtlebeasts","download_url":"https://codeload.github.com/turtlebeasts/QuadBTech-ToDo-application/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243047811,"owners_count":20227592,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["material-ui","reactjs"],"created_at":"2025-01-18T03:14:46.320Z","updated_at":"2026-04-29T21:34:45.801Z","avatar_url":"https://github.com/turtlebeasts.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# QUADB-tech TODO-application\n\n## Overview\n\nThe QUADB-tech TODO-application is a React-based application designed to help users efficiently manage their tasks. It features a user-friendly interface with Material-UI components, allowing users to add, update, delete, and filter tasks. The app supports persistent state through sessionStorage, ensuring that tasks remain available even after page reloads.\n\n---\n\n## Features\n\n- **Task Creation**: Add tasks with details such as name, notes, importance, steps, reminders, due date, and repeat options.\n- **Task List Display**: View tasks in either list or grid layout.\n- **Task Filters**: Filter tasks by:\n  - All tasks\n  - Important tasks\n  - Tasks due today\n  - Planned tasks\n- **Theme Toggle**: Switch between light and dark themes.\n- **Task Management**:\n  - Mark tasks as complete with a checkbox.\n  - Mark tasks as important with a star icon.\n  - Update task properties dynamically.\n- **Persistent State**: Tasks and layouts are saved to sessionStorage to prevent loss on page reload.\n\n---\n\nPlanned task are set to be those task that have dates other than today (current)\n\n## Technologies Used\n\n- **Frontend**:\n  - React.js\n  - Material-UI (MUI)\n  - Grid2 for responsive layouts\n- **State Management**:\n  - Context API (Task Context, Theme Context, Layout Context, Filter Context)\n- **Storage**:\n  - sessionStorage for persistence\n\n---\n\n## Folder Structure\n\n```\nsrc/\n|-- components/\n|   |-- AddTaskForm.js          # Form to add tasks\n|   |-- TaskList.js             # Component to display tasks\n|   |-- FilterControls.js       # Filter selection UI\n|-- context/\n|   |-- TaskContext.js          # Manages task state\n|   |-- ThemeContext.js         # Manages light/dark themes\n|   |-- LayoutContext.js        # Manages layout (list/grid)\n|   |-- FilterContext.js        # Manages task filters\n|-- App.js                      # Main application file\n```\n\n---\n\n## Installation\n\n1. Clone the repository:\n\n   ```bash\n   git clone https://turtlebeasts/QuadBTech-ToDo-application.git\n   ```\n\n2. Navigate to the project directory:\n\n   ```bash\n   cd QuadBTech-ToDo-application\n   ```\n\n3. Install dependencies:\n\n   ```bash\n   npm install\n   ```\n\n4. Start the development server:\n   ```bash\n   npm start\n   ```\n\n---\n\n## Usage\n\n1. Open the app in your browser at `http://localhost:5173/`.\n2. Add a task using the \"Add Task\" form.\n3. Use the layout toggle to switch between list and grid views.\n4. Use the filter controls to filter tasks based on criteria.\n5. Mark tasks as complete or important using the checkboxes and star icons.\n\n---\n\n## Screenshots\n\nAdd screenshots of your application to showcase its features. For example:\n\nTask List in Light Mode\n\n![Light Mode](lightmode.png)\n\nTask List in Dark Mode\n\n![Dark Mode](darkmode.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fturtlebeasts%2Fquadbtech-todo-application","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fturtlebeasts%2Fquadbtech-todo-application","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fturtlebeasts%2Fquadbtech-todo-application/lists"}