Update README.md

Author: Miro-wq

README.md

@@ -1,44 +1,29 @@
-# Contact book, part 3, integrating state management with Redux Toolkit
-
-## Refactoring Contact Book Application 
-This project refactors the Contact Book app by integrating state management with Redux Toolkit. It includes actions for saving, deleting contacts, and updating the filter. The app uses `redux-persist` to store the contacts in `localStorage` and connects React components with Redux using `react-redux`. The initial Redux state consists of an empty contacts array and a filter string.
+# ✨ Contact book, integrating state management with Redux Toolkit ✨
 
 ## 🛠 Tools used
 
 [![My Skills](https://skillicons.dev/icons?i=html,css,js,react,redux,npm,webpack,vscode)](https://skillicons.dev)
 
-### Description 
-
-This homework task is a simple contact management application for a phonebook, designed to practice fundamental React concepts and state management. The application allows users to add, display, search, and delete contacts, with each contact consisting of a name and a phone number. The project is structured to progressively introduce new features, demonstrating the importance of component-based architecture, controlled components, and state handling in React.
-
-### Key Features 
-
-1. **Add Contacts**: Users can add contacts with a name and phone number. The application ensures that contact names adhere to a specific pattern and prevents the addition of duplicate names.
-  
-2. **Search and Filter**: A search field is provided to filter contacts by name, with case-insensitive matching.
+![Description](https://img.shields.io/badge/Description-purple?style=for-the-badge)
+This project refactors the Contact Book app by integrating state management with Redux Toolkit. It includes actions for saving, deleting contacts, and updating the filter. The app uses `redux-persist` to store the contacts in `localStorage` and connects React components with Redux using `react-redux`. The initial Redux state consists of an empty contacts array and a filter string.
 
-3. **Contact List Management**: Users can view a list of all contacts and remove any contact they no longer need.
+![Features](https://img.shields.io/badge/Features-purple?style=for-the-badge)
 
-4. **Component Refactoring**: The application is refactored from a single component into multiple independent components, enhancing modularity and readability.
+- **Add Contacts**: Users can add contacts with a name and phone number. The application ensures that contact names adhere to a specific pattern and prevents the addition of duplicate names. 
+- **Search and Filter**: A search field is provided to filter contacts by name, with case-insensitive matching.
+- **Contact List Management**: Users can view a list of all contacts and remove any contact they no longer need.
+- **Component Refactoring**: The application is refactored from a single component into multiple independent components, enhancing modularity and readability.
 
-### Key Learning Objectives:
+![Key Learning Objectives:](https://img.shields.io/badge/Key%20Learning%20Objectives-purple?style=for-the-badge)
 
 - **State Management**: Manage and update state in React, particularly how to structure state to store multiple properties and handle user inputs in a controlled manner.
-
 - **Componentization**: The importance of breaking down an application into smaller, reusable components became evident. This approach not only simplifies development but also makes the codebase easier to maintain and scale.
-
 - **Form Handling**: Experience in handling forms in React, including managing controlled inputs and validating user data through patterns and required fields.
-
 - **Conditional Rendering**: Implementing conditional logic to prevent duplicate contacts from being added, which reinforced the concept of controlling what gets rendered based on the application's state.
-
 - **Refactoring and Code Organization**: Refactoring the application into separate components taught me the significance of organizing code in a way that promotes reusability and separation of concerns.
-
 - **User Experience Considerations**: Enhancing the user experience by providing feedback (such as alerts) and ensuring the interface remains responsive and intuitive.
-
 This project served as a solid foundation for building more complex React applications, emphasizing the core principles of React and good development practices.
 
----
-
 ### Step 1
 The application should include a form and a contact list. In the current step, implement the ability to add a contact name and display it in the contact list. The application does not need to save contacts between different sessions (page refreshes).