https://github.com/khushijtrivedi/contact-app

This repository contains a Contact Manager Application built using the ReactJS framework. The application utilizes various modern web development technologies and concepts.The application allows users to manage their contacts efficiently. Users can add new contacts, update existing ones, delete contacts, and search for specific contacts.
https://github.com/khushijtrivedi/contact-app

boot html-css-javascript json-server localstorage reactjs restful-api routing seman

Last synced: about 2 hours ago
JSON representation

This repository contains a Contact Manager Application built using the ReactJS framework. The application utilizes various modern web development technologies and concepts.The application allows users to manage their contacts efficiently. Users can add new contacts, update existing ones, delete contacts, and search for specific contacts.

• Host: GitHub
• URL: https://github.com/khushijtrivedi/contact-app
• Owner: khushijtrivedi
• Created: 2024-06-12T19:54:25.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-06-23T12:07:19.000Z (5 months ago)
• Last Synced: 2024-06-24T15:11:34.043Z (5 months ago)
• Topics: boot, html-css-javascript, json-server, localstorage, reactjs, restful-api, routing, seman
• Language: JavaScript
• Homepage:
• Size: 803 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Contact Manager Application

## Overview

This Contact Manager Application is built using the ReactJS framework. It leverages various modern web development technologies to provide a seamless user experience for managing contacts. The application supports adding, updating, deleting, and searching contacts.

## Technologies Used

- **Frameworks and Libraries**: 

  - ReactJS: A JavaScript library for building user interfaces.

  - Semantic UI: A UI component framework for theming websites.

  - Bootstrap: A popular CSS framework for responsive web design.

- **Languages and Tools**:

  - HTML: The standard markup language for creating web pages.

  - CSS: A style sheet language used for describing the presentation of a document.

  - JavaScript: A programming language commonly used in web development.

- **React Concepts**:

  - Class components: React components defined as ES6 classes.

  - Functional components: React components defined as JavaScript functions.

  - Passing props: A method of passing data from parent to child components in React.

  - Routing: Managing navigation between different pages in a React application.

  - useState: A React Hook that allows state variables in functional components.

- **Data Management**:

  - Local storage: A web storage API for storing data in the browser.

  - JSON server: A simple way to create a fake REST API for prototyping and testing.

- **API**:

  - RESTful API: An architectural style for designing networked applications.

## Features

- **Add Contacts**: Easily add new contacts to the list.

- **Update Contacts**: Edit the details of existing contacts.

- **Delete Contacts**: Remove contacts from the list.

- **Search Contacts**: Search for specific contacts by name or email.

## Setup and Installation

Navigate to the project directory:

cd contact-manager

Install the dependencies:

npm install

Start the JSON server:

npx json-server --watch db.json --port 5000

Start the React application:

npm start

### Prerequisites

- Node.js and npm installed on your machine.

### Steps

1. **Clone the repository**:

   ```bash

   git clone https://github.com/khushijtrivedi/contact-manager.git

   Contributions are welcome! Please fork this repository and submit a pull request for any enhancements or bug fixes.