Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/venky-1710/phonebook-mern-stack
A MERN stack phone book application for managing contacts. Features include adding, viewing, editing, and deleting phone numbers with a responsive UI. Built using MongoDB, Express, React, and Node.js, it offers a simple yet functional interface for organizing personal or professional contacts efficiently.
https://github.com/venky-1710/phonebook-mern-stack
axios css express html javascript mern-stack mongodb mongoose node-js react
Last synced: about 8 hours ago
JSON representation
A MERN stack phone book application for managing contacts. Features include adding, viewing, editing, and deleting phone numbers with a responsive UI. Built using MongoDB, Express, React, and Node.js, it offers a simple yet functional interface for organizing personal or professional contacts efficiently.
- Host: GitHub
- URL: https://github.com/venky-1710/phonebook-mern-stack
- Owner: venky-1710
- Created: 2024-06-27T19:07:44.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-06-27T19:18:16.000Z (5 months ago)
- Last Synced: 2024-06-27T22:32:17.489Z (5 months ago)
- Topics: axios, css, express, html, javascript, mern-stack, mongodb, mongoose, node-js, react
- Language: JavaScript
- Homepage:
- Size: 2.87 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Phone Book MERN Application
A simple and responsive phone book application built using the MERN (MongoDB, Express, React, Node.js) stack. This project allows users to manage their contacts by adding, updating, and deleting phone numbers.
## Features
- Add new contacts with name and phone number
- View all contacts in a table format
- Edit existing contacts
- Delete contacts
- Responsive design with a stylish UI
## Technologies Used
- MongoDB: Database for storing contact information
- Express: Backend framework for handling HTTP requests
- React: Frontend library for building the user interface
- Node.js: Runtime environment for the backend
- Axios: HTTP client for making API requests
- Mongoose: ODM library for MongoDB and Node.js
## Project Structure
- `frontend/`: Contains the React application
- `src/App.js`: Main component with all the functionality
- `backend/`: Contains the Express server
- `index.js`: Server setup and API routes
- `model/phonebook.js`: Mongoose schema for the phone book
## Setup and Installation
1. Clone the repository:
```sh
https://github.com/venky-1710/PhoneBook-MERN-Stack.git
cd phone-book-mern
```
2. Install dependencies for backend:
```sh
cd server
npm install
```
3. Install dependencies for frontend:
```sh
cd ../client
npm install
```
4. Set up MongoDB connection string in `server/index.js`:
Replace the `db` variable with your MongoDB connection string.
5. Run the backend server:
```sh
cd ../server
node index.js
```
6. In a new terminal, run the React development server:
```sh
cd ../client
npm start
```
7. Open your browser and navigate to `http://localhost:3000`
## API Endpoints
- POST `/add-phone`: Add a new contact
- GET `/get-phone`: Retrieve all contacts
- PATCH `/update-phone/:id`: Update a contact
- DELETE `/delete-phone/:id`: Delete a contact
## Future Improvements
- Implement user authentication
- Add search and filter functionality
- Improve error handling and validation
- Enhance UI/UX with animations and transitions
## Contributing
Contributions, issues, and feature requests are welcome. Feel free to check issues page if you want to contribute.
## License
[MIT](https://choosealicense.com/licenses/mit/)