This project is a To-Do List web application that allows users to manage their tasks efficiently. The tasks are stored on the backend using the mokAPI. Users can add, delete, and modify tasks, and there is a filter option to view tasks that are completed or still in progress. Additionally, the webpage displays the total number of tasks, completed tasks, and tasks in progress.
- Vite: Vite is utilized as the project's build tool, providing a fast and efficient development environment.
- React: The frontend of the application is built using the React library for creating user interfaces.
- Redux: Redux is employed for state management, ensuring a centralized and predictable state container.
- Axios: Asynchronous API requests are handled using Axios, enabling seamless communication with the mokAPI.
- SCSS: The application's styling is implemented with SCSS for a more maintainable and organized stylesheet.
- Pagination: The webpage features pagination to enhance the user experience when dealing with a large number of tasks.
- Loader Skeleton: A loader skeleton is displayed while awaiting data from the backend, providing visual feedback to users.
- Task Management: Users can add, delete, and modify tasks based on their requirements.
- Filtering: Tasks can be filtered to display completed or in-progress items.
- Statistics: The webpage showcases overall task statistics, including total tasks, completed tasks, and tasks in progress.
- Pagination: The application employs pagination for efficient navigation through a large number of tasks.
- Loader Skeleton: A loader skeleton is displayed during data retrieval, enhancing the user experience.
- Clone the repository:
git clone https://github.com/Inna-Kulish/TodoList.git - Install dependencies: npm install
- Start the development server: npm run dev
- Open your browser and navigate to
http://localhost:5174/TodoListto use the To-Do List application.