A task management web application built with React, Material UI, and AG-Grid. This project demonstrates modern React development practices including component organization, state management, and routing.
- Add, edit, and delete tasks
- Set priority levels (High, Normal, Low)
- Assign due dates to tasks
- Filter and sort tasks
- Responsive design with Material UI components
- Data display with AG-Grid
- React 18
- React Router v6 for navigation
- Material UI for styled components
- AG-Grid for table display
- Day.js for date handling
- Vite as build tool
- Vitest for testing
Add todo view of the application
Todo management interface with filtering options
# Clone the repository
git clone https://github.com/your-username/todolist.git
# Navigate to project directory
cd todolist
# Install dependencies
npm install
# Start development server
npm run devVisit http://localhost:5173 to view the application in your browser.
This project includes unit tests for components using Vitest and React Testing Library.
# Run tests
npm test
# Run tests with coverage report
npm run coveragesrc/components/- React componentssrc/assets/- Static assetssrc/tests/- Test files
This project was developed as part of my Full Stack Software Development studies at Haaga-Helia University of Applied Sciences, focusing on:
- Building React applications with hooks
- Implementing routing with React Router
- Using Material UI for consistent styling
- Data grid implementation with AG-Grid
- Form handling and validation
- Unit testing React components
This project is open source and available under the MIT License.