https://github.com/masoumehmohebbi/react-mui-contactlist-app

React ContactList App, based on Material-UI-Library And Supabase-Database! 👩🏻‍💼🙎🏻‍♂️📃
https://github.com/masoumehmohebbi/react-mui-contactlist-app

clean-code contactlist contactlist-application framer-motion gh-pages html material-ui-library mui mui-icons mui-material mui-table navigate-through-pages react-router-dom-v6 reactjs responsive search-page supabase supabase-db sweetalert2

Last synced: about 1 month ago
JSON representation

React ContactList App, based on Material-UI-Library And Supabase-Database! 👩🏻‍💼🙎🏻‍♂️📃

• Host: GitHub
• URL: https://github.com/masoumehmohebbi/react-mui-contactlist-app
• Owner: masoumehmohebbi
• Created: 2023-07-30T10:30:07.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-08-16T06:09:32.000Z (over 1 year ago)
• Last Synced: 2024-11-09T03:17:23.362Z (3 months ago)
• Topics: clean-code, contactlist, contactlist-application, framer-motion, gh-pages, html, material-ui-library, mui, mui-icons, mui-material, mui-table, navigate-through-pages, react-router-dom-v6, reactjs, responsive, search-page, supabase, supabase-db, sweetalert2
• Language: JavaScript
• Homepage: https://masoumehmohebbi.github.io/react-mui-contactlist-app/
• Size: 7.35 MB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# react-mui-contactlist-app

React ContactList App, based on Material-UI library And Supabase-DB

  

  

  

## Description

This is a contact list application. which I developed with the UI material library and the ReactJs library. At first I used Json Server but finally I decided to use Supabase database. It was the first time I used Supabase and it had its own challenges and I enjoyed working with that.

In this application, we enter user information such as number, email, gender, etc., and even determine the relationship of that user with us. And only a small amount of information is displayed in the contact list, and if we want to see more information about that user and even when that user was added, we can click on the details icon and see all the information.

This application has features such as deleting, adding, editing, viewing more information and searching for the user.

## Features

🔥 Responsive styles

📱 Add, Delete, Edit Users

✅ viewing more information About Users

⚡️ Search Users

## Requirements



  
React

  
ES6



## Technologies used in this App



  
HTML

  
Material Ui

  
React Js

  
Supabase Database

  
SweeitAlert2

  
Framer Motion



## Development setup

#### First, clone the project:

git clone https://github.com/masoumehmohebbi/react-mui-contactlist-app/

#### Then, install necessary npm packages:

npm i

#### Finally, run the `start` script and preview project on a local server:

npm run start

## Author

Masoume mohebbi