This is a simple contacts management application built with React, Redux, and NextUI. The application allows users to manage their contacts by adding, deleting, and filtering them. Backend simulation is achieved using mockapi.io
. Styling is implemented using the Next UI component library and the Tailwind CSS framework.
- Add new contacts: Users can add a new contact by providing their name and phone number.
- Delete contacts: Users can remove existing contacts from the phonebook.
- Filter contacts: Users can filter contacts by name to quickly find the desired contact.
- Theme Switcher: Toggle between light and dark themes for a personalized experience.
- React: JavaScript library for building user interfaces.
- Redux: State management library for managing application state.
- Redux Toolkit: Official Redux package for efficient Redux development.
- mockapi.io: Platform for simulating a REST API backend for development and testing purposes.
- Next UI: Component library for building user interfaces.
- Tailwind CSS: Utility-first CSS framework for styling applications.
To run the application locally, follow these steps:
- Clone this repository:
git clone <repository-url>
- Install dependencies:
npm install
- Run the development server:
npm run start
- Open http://localhost:3000 in your browser.
Once the application is running, you can perform the following actions:
- Add a contact: Enter the name and phone number of the contact in the input fields. Then click the "Add" button to save the contact.
- Delete a contact: Click the "Delete" button next to the contact you want to remove from the phonebook.
- Filter contacts: Enter the name or phone of the contact you want to filter in the search input field. The contact list will be filtered in real-time as you type.
Contributions are welcome! If you have any suggestions or found a bug, please open an issue or submit a pull request.