Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/amaranand360/contact-management-app
This is Contact Management App! which allows you to manage your contacts, providing an easy way to add, edit, and view contact details.
https://github.com/amaranand360/contact-management-app
react-router reactjs redux redux-toolkit tailwindcss typescript
Last synced: about 1 month ago
JSON representation
This is Contact Management App! which allows you to manage your contacts, providing an easy way to add, edit, and view contact details.
- Host: GitHub
- URL: https://github.com/amaranand360/contact-management-app
- Owner: amaranand360
- Created: 2023-08-26T13:42:53.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-08-26T13:59:57.000Z (over 1 year ago)
- Last Synced: 2023-08-26T14:56:05.100Z (over 1 year ago)
- Topics: react-router, reactjs, redux, redux-toolkit, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://contact-management-app-amar.vercel.app/
- Size: 177 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Contact Management App
Welcome to the Contact Management App! This web application allows you to manage your contacts, providing an easy way to add, edit, and view contact details.
## Table of Contents
- [Introduction](#introduction)
- [Features](#features)
- [Getting Started](#getting-started)
- [Technologies Used](#technologies-used)
- [Installation](#installation)
- [Usage](#usage)## Introduction
The Contact Management App is a simple yet powerful tool designed to help you manage your contacts efficiently. Whether you want to keep track of personal or professional contacts, this app offers a user-friendly interface for adding and editing contact information.
## Features
- **Add Contacts**: Easily add new contacts by providing their name, email, and mobile number.
- **Edit Contacts**: Update contact information, such as name, email, and mobile number.
- **View Contacts**: Browse and view a list of all your contacts with relevant details.
- **Delete Contacts**: Remove unwanted contacts from your list.## Getting Started
To get started with the Contact Management App, follow these steps:
1. Clone this repository to your local machine using `git clone https://github.com/amaranand360/Contact-management-app.git`.
2. Navigate to the project directory: `cd contact-management-app`.
3. Install the required dependencies using `npm install`.## Technologies Used
- React: Frontend library for building user interfaces.
- Redux: State management for managing the application's state.
- React Router: Handling navigation and routing within the app.
- Tailwind CSS: Styling framework for creating modern and responsive designs.
- Redux Toolkit: Simplifies state management with a set of tools.
- Typescript## Installation
To run the Contact Management App on your local machine, follow these steps:
1. After completing the "Getting Started" section, use the command `npm start` to start the development server.
2. Open your browser and navigate to `http://localhost:3000` to access the app.## Usage
1. **Adding a Contact**: Click on the "Add Contact" button and provide the necessary details.
2. **Editing a Contact**: Click on the "Edit" button next to a contact's details, make the necessary changes, and click "Update Contact".
3. **Viewing Contacts**: The main page displays a list of your contacts. You can also view individual contact details.
4. **Deleting a Contact**: Click on the "Delete" button next to a contact's details to remove it from the list.