This project is a To-Do List Application built with React, Material-UI and Typescript. It allows users to manage their tasks, including creating, editing, and deleting tasks. All tasks are stored in the browser's LocalStorage for persistence.
You can view the live version of the application here.
The application includes the following features:
-
Login
- A screen with fields for email and password.
- Only the interface is implemented; authentication logic is not implemented yet.
-
User Registration
- A screen with fields for name, email, and password.
- Only the interface is implemented; registration logic is not implemented yet.
-
Task List
- A screen that lists all created tasks.
- Each task displays the title, color, and description.
-
Task Management
- A form to create new tasks.
- A form to edit existing tasks.
- Functionality to delete tasks.
- Each task includes the following fields: title, color (using a color picker), and description.
- Tasks are saved to and loaded from LocalStorage.
- Framework: React
- UI Components: Material-UI
- Data Storage: Browser's LocalStorage
- Language: TypeScript
- Testing: Jest
-
Clone the repository:
git clone https://github.com/your-username/todo-list-app.git cd todo-list-app -
Install dependencies:
npm install
-
Start the development server:
npm start
For a project with React, Material-UI, React Router, TypeScript, and Jest, you will need the following dependencies:
-
React and React DOM:
npm install react react-dom
-
Material-UI (including icons):
npm install @mui/material @emotion/react @emotion/styled @mui/icons-material
-
React Router:
npm install react-router-dom
-
TypeScript (if it's not already installed):
npm install typescript
-
Type Definitions for TypeScript:
npm install --save-dev @types/react @types/react-dom @types/react-router-dom
-
Jest and React Testing Library for tests:
npm install --save-dev jest @testing-library/react @testing-library/jest-dom @testing-library/user-event @types/jest
You can install all the dependencies at once with the following commands:
npm install react react-dom @mui/material @emotion/react @emotion/styled @mui/icons-material react-router-dom typescript
npm install --save-dev jest @testing-library/react @testing-library/jest-dom @testing-library/user-event @types/jest @types/react @types/react-dom @types/react-router-dom- Open your browser and navigate to
http://localhost:3000. - Use the login and registration interfaces to create a new user (only the interface is functional).
- Create, edit, and delete tasks using the provided forms and task list interface.
The testing phase is currently under development.
Contributions are welcome! Please fork the repository and create a pull request with your changes.





