This is a React-based web application that serves as a contact manager. It allows users to keep track of their contacts, log in and out of the system, and manage their contact list efficiently. The project is built using Redux Toolkit for state management and Redux Persist to store contacts in the local storage. For styling, it utilizes Emotion Styled and Material-UI (MUI) components.
- 1. Home Page The landing page of the application provides an introduction to the contact manager and its features. Users can navigate to other sections of the app from here.
- 2. Login Users can log in to the application by providing their credentials. Authentication is handled securely, ensuring user data remains protected.
- 3. Logout Logged-in users can log out from their accounts, securely ending their session.
- 4. Contacts The heart of the application, where users can: View a list of their saved contacts. Add new contacts with details such as name, phone number, and email. Edit existing contacts. Delete contacts they no longer need. Search for specific contacts by name.
React:The core framework for building the user interface.Redux Toolkit:Used for state management, making it easy to manage and update the application's state.Redux Persist:Enables the app to persist user contacts data in the local storage, ensuring data is retained across sessions.Emotion Styled:Used for styling components, providing a maintainable and flexible styling solution.Material-UI (MUI):Offers pre-built UI components and styles to enhance the application's user interface.
To get a copy of this project up and running on your local machine, follow these steps:
1.Clone the repository to your local machine using Git:
git clone https://github.com/Bad-Raider/personal-phonebook.git2. Install the project dependencies:
npm install3. Start the development server:
npm startThe application should now be running on http://localhost:3000/.