add item added

Luxshan2000 · Sep 28, 2023 · a2b0c62 · a2b0c62
1 parent bc4f76e
commit a2b0c62
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 8 deletions.
diff --git a/backend/server.js b/backend/server.js
@@ -10,7 +10,7 @@ const app = express()
 const PORT = process.env.PORT || 5000
 
 app.use(cors({
-  origin:["*", "http://51.20.93.112:3000"],//"exp://192.168.8.182:8081"
+  origin:["*", "http://localhost:3000"],//"exp://192.168.8.182:8081"
   methods:["GET","POST"],
   credentials:true
 }))  

diff --git a/backend/src/controllers/addData.js b/backend/src/controllers/addData.js
@@ -5,6 +5,7 @@ const Item = require('../modals/Item')
 exports.addItem = async (req,res) =>{
     try{
 
+        console.log(req.body)
         const { name } =  req.body
 
         const newItem = new Item({ name})

diff --git a/backend/src/routes/addRoutes.js b/backend/src/routes/addRoutes.js
@@ -3,7 +3,7 @@ const router = express.Router();
 const addData = require('../controllers/addData');
 
 
-router.get('/items', addData.addItem)
+router.post('/item', addData.addItem)
 
 
 module.exports = router;
diff --git a/frontend/src/App.js b/frontend/src/App.js
@@ -8,7 +8,7 @@ function App() {
   const [items, setItems] = useState([])
 
   useEffect(()=>{
-      axios.get("http://51.20.93.112:5000/api/get/items").then(response => {
+      axios.get("http://localhost:5000/api/get/items").then(response => {
 
       setItems(response.data)
     })
@@ -25,7 +25,7 @@ function App() {
       <hr/>
       <hr/>
 
-      <AddItems />
+      <AddItems setItems={setItems} />
       <SeeItems items={items} />
     </div>
   );

diff --git a/frontend/src/components/AddItems.js b/frontend/src/components/AddItems.js
@@ -1,10 +1,24 @@
-import React from 'react'
+import React, { useState } from 'react'
+import axios from 'axios'
+
+function AddItems({setItems}) {
+
+  const [name,setname] = useState('')
+
+  const handleSubmit = async  (ev)=>{
+
+     ev.preventDefault()
+     await axios.post("http://localhost:5000/api/add/item",{name: name } )
+
+     setname("")
+  }
+
+
 
-function AddItems() {
   return (
     <div>
-        <form method='POST' onSubmit={()=> console.log("Submitted")} >
-            <input type='text' placeholder='Item name' />
+        <form onSubmit={handleSubmit} >
+            <input onChange={(e)=> setname(e.target.value)} value={name} type='text' placeholder='Item name' />
             <button>Add Item</button>
         </form>