This is my first CRUD project, I used React, Mui, Node.js, Express, Mysql to create this webpage. I will show some images how can I design this page.
Nowadays, many people use the smart phone, so I think no one like to keep the entity name card. Then I found out smart phone have a vCard format, vCard is the file format standard for electronic business cards. This project I am going to generator the qrcode for the user name card. Then they can scan the qrcode, it can automatic connect to their phone's Contacts.
This page is generator page, user can input their information. 👇
Finish input the information, usre can click the save button. 👇
The data can save it to database. 👇
Beside the "Save" button, there have a button call "Genrate vCard qrcode", user can check the qrcode first in this page. Also you can use your 📱 to scan this rqcode, it can save the same information to your mobile phone connect. It is quite fun 😎
🔔 If you scanned it nothing happened, you can click the image to enlarge, and try again. 🔔 👇
After that, user can go back to home page to check the record. 👇
In this record, it can keep the qrcode.
🔔 If you scanned it nothing happened, you can click the image to enlarge, and try again. 🔔 👇
If have something wrong, it can edit the data. 👇
The data was edited. 👇
You can scan the qrcode, to check the data.
🔔 If you scanned it nothing happened, you can click the image to enlarge, and try again. 🔔 👇
In Mysql database, the data was edited. 👇
Also it can delete the data. 👇
