Valik3201 / goit-react-hw-07-phonebook

A contact management app developed using React, Redux, and NextUI. Features include CRUD operations on contacts with mockapi.io used for backend simulation.

Home Page:https://valik3201.github.io/goit-react-hw-07-phonebook/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Phonebook

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.

Features

  • 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.

Technologies Used

  • 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.

Getting Started

To run the application locally, follow these steps:

  1. Clone this repository:
    git clone <repository-url>
    
  2. Install dependencies:
    npm install
    
  3. Run the development server:
    npm run start
    
  4. Open http://localhost:3000 in your browser.

Usage

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.

Contributing

Contributions are welcome! If you have any suggestions or found a bug, please open an issue or submit a pull request.

About

A contact management app developed using React, Redux, and NextUI. Features include CRUD operations on contacts with mockapi.io used for backend simulation.

https://valik3201.github.io/goit-react-hw-07-phonebook/


Languages

Language:JavaScript 90.6%Language:HTML 8.1%Language:CSS 1.3%