Axios Error Please find solution

I am sharing my code please find my issue

BackEndcode

const express = require(“express”);
const cors = require(“cors”);
const mongoose = require(“mongoose”);

const app = express();

app.use(cors());
app.use(express.json());

mongoose
.connect(“mongodb://127.0.0.1:27017/sunday”)
.then(() => {
console.log(“database connected”);
})
.catch(() => {
console.log(“database disconnected”);
});

const frutits = mongoose.model(
“fruiting”,
{
name: String,
},
“monday”
);

app.get(“/fruitlist”, (req, res) => {
frutits.find().then((retdata) => {
res.send(retdata);
});
});

app.post(“/addfruit”, (req, res) => {
var newfruit = req.body.newfruit;

const newFruit = new Fruit({
name: newfruit,
});

newFruit.save().then(() => {
console.log(“logged successfully”);
});
});
app.listen(5000, () => {
console.log(“Server started”);
});

Frontend Code

import { useState } from “react”;
import axios from “axios”;

export default function Todolist() {
const [inputing, inputChange] = useState();
const [fruit, setfruit] = useState();

useState(() => {
axios.get(“http://localhost:5000/fruitlist”).then((data) => {
setfruit(data.data);
});
}, );

function handleChange(evt) {
inputChange(evt.target.value);
}

function add() {
axios.post(“http://localhost:5000/addfruit”, {
newfruit: inputing,
});

setfruit([...fruit, { name: inputing }]);
inputChange("");

}
return (



    <button onClick={add}>Submit</button>

    {fruit.map((item, index) => {
      return <h1 key={index}>{item.name}</h1>;
    })}
  </div>
</div>

);
}

1 Like

Et tu frutits?

Looks like you did some non consistent naming conventions. Double check your spelling.

1 Like

ok, Thank you… please tell me how to image send frontend to backend

1 Like

There are ways you can save it as a url then just send a string, i’ve heard of cdns that you can convert all images like that, then it’s easy to store a url.



Hey i found these in a php book in case you were still interested

I am Using Node is there any realtion Node and PHP

Yes node and php are both used on the backend. There are differences especially syntax, but they do the same things in terms of functionality. The first page is actually html then you could use node to receive the file.