Activity Tracker is a feature-rich React/Vite application designed to help users effectively manage and track their tasks. It combines an intuitive user interface with robust backend functionality, enabling seamless task creation, modification, and activity tracking.
With a responsive design and accessibility in mind, the app ensures a smooth experience across devices and user preferences, including support for keyboard navigation, theme switching, and task filtering.
This project leverages modern libraries and tools for both frontend and backend development, providing an excellent foundation for task management with data visualization capabilities like bar charts and tables.
For instructions on how to setup and run the simple local backend, see the server's README.
To run the React project, simply navigate to the frontend directory, install the necessary dependencies with npm install via the terminal, and then run the project with npm run dev. If you initialised the server with a different port, make sure to update the PORT variable in the api.js file before running the project.
- Implement at least 3 different view with seperate content that is easily navigatable with a menu.
- One of the views must be an Info page providing requested information about the project.
- Application can communicate with the simple local backend and automatically retrieve data to be loaded on frontend.
- User can add and delete tasks via the application's UI.
- User can edit tasks' names, and modifiy (create, apply, edit, remove) tasks' tags.
- Changes made via UI are stored in the backend.
- User can filter which tasks to display based on tags.
- User can select pre-existing tags when creating a new task.
- Displayed tasks can be rearranged and sorted.
- Active status of a task is shown, can be altered via the UI, and timestamps of alteration are stored in the backend.
- User can specify a time interval, select a task, and see a table, listed chronologically, of the start and end times at which that task was active.
- User can specify a time interval, select a task, and a bar chart will display, in different units, the total time that task was active for each day in the interval.
- User is able to change the theme of the application via the UI.
- User is able to switch the mode of the application via the UI such that either multiple tasks can be active simultaneously or enforce that only one task can be active at any given time.
- UI must be responsive.
- Application should usable with only keyboard input.
List of libraries and dependencies used for frontend and backend.