I have an array in my db.json. And I can add a new object. But every time I reload the page, the data is reset to the default state. How can I store data in such a way that it is written to db.json and displayed on reload?

My db.json:

{"item": [
    {
        "text": "Пошел в свой первый класс",
        "id": 0,
        "data": {
            "year": 2012,
            "day": 25,
            "month": 1
        }
    },
    {
        "text": "Поехал на чемпионат по бейсболу",
        "id": 1,
        "data": {
            "year": 2018,
            "day": 14,
            "month": 3
        }
    },
    {
        "text": "Поступил в институт",
        "id": 2,
        "data": {
            "year": 2007,
            "day": 12,
            "month": 4
        }
    }
]}

My state:

const [value, setValue] = useState('');
const [valueYear, setValueYear] = useState('');
const [valueDate, setValueDate] = useState('');
const [valueMonth, setValueMonth] = useState('');

const [table, setTable] = useState([]);

useEffect(() => {
axios.get("http://localhost:3004/item").then(({ data }) => {
  setTable(data);
})}, [])

My add function:

 const addTask = (value, valueYear, valueDate, valueMonth) => {
if (value) {
  const newItem = {
    id: table.length,
    text: value,
    data: {
      year: valueYear,
      day: valueDate,
      month: valueMonth,
    },
  }
  setTable([...table, newItem]);
}}