add and delete user

nusmoney_backend/routes/users.js

@@ -16,8 +16,8 @@ AddUser()
 router.post("/", (request, response) => {
   console.log(request.body);
   //
-  connection.query(`INSERT INTO users(user_id, name, mail, mobile, nric) 
+  connection.query(`INSERT INTO users(name, mail, mobile, nric) 
-  VALUES (${request.body.id},'${request.body.name}', '${request.body.mail}', ${request.body.mobile}, '${request.body.nric}')`, 
+  VALUES ('${request.body.name}', '${request.body.mail}', ${request.body.mobile}, '${request.body.nric}')`, 
   (err, result) => {
       if (err) {
           response.send("Some record error occur");

nusmoney_client/src/components/userList.js

@@ -49,6 +49,53 @@ class UserList extends Component {
             });
     }
 
+    addUser(bodyData) {
+
+        console.log(bodyData);
+        // setup automatic proxy in package.json.
+        // thus eliminating the need to type "http://localhost:7000"
+        // "proxy" : "http://localhost:7000"
+        fetch(`/users`, {
+            method: "POST",
+            body: JSON.stringify(bodyData),
+            headers: { "Content-type": "application/json; charset=UTF-8" },
+        })
+            .then((res) => res.text())
+            .then((data) => {
+                console.log(data);
+                
+                //this.setState({ items: data });
+                //console.log(this.state.user);
+            })
+            .catch((err) => {
+                console.log(err);
+                
+                return err;
+            });
+    }
+
+    deleteUser(id) {
+
+        // setup automatic proxy in package.json.
+        // thus eliminating the need to type "http://localhost:7000"
+        // "proxy" : "http://localhost:7000"
+        fetch(`/users/${id}`, {
+            method: "DELETE"
+        })
+            .then((res) => res.json())
+            .then((data) => {
+                console.log(data);
+                alert(`Deleted user ${id}`);
+                //this.setState({ items: data });
+                //console.log(this.state.user);
+            })
+            .catch((err) => {
+                console.log(err);
+                alert(`Fail to delete user ${id}`);
+                return err;
+            });
+    }
+
     componentDidMount() {
         // react lifecycle method componentDidMount()
         // will execute the callAPIServer() methods afteer the component mounts
@@ -65,7 +112,13 @@ class UserList extends Component {
                     color="dark"
                     style={{ marginBottom: "2em" }}
                     onClick={() => {
-                        const name = prompt("Enter name");
+                        this.addUser( {
+                            name: "Hello World",
+                            nric: "S12345",
+                            mobile: "919191",
+                            mail: "grant@anb"
+                        });
+/*                         const name = prompt("Enter name");
                         if (name) {
                             this.setState((state) => ({
                                 items: [
@@ -78,7 +131,7 @@ class UserList extends Component {
                                     },
                                 ],
                             }));
-                        }
+                        } */
                     }}
                 >
                     Add User
@@ -98,6 +151,7 @@ class UserList extends Component {
                                         color="danger"
                                         size="sm"
                                         onClick={() => {
+                                            this.deleteUser(user_id);
                                             console.log(`Delete ${user_id}`);
                                         }}
                                     >