How to reflect changes in client when database changes?

Viewed 35

So here's my scenario: I have a client page, where any one can fill and submit a form. the form data is stored in a database. There is a separate admin pc which is on an admin page, where every new form entry is displayed. How to update the front end of the admin everytime a new form is submitted, without refreshing/re hitting the API?

I am using React with express and MongoDB.

1 Answers

You can use TanStack Query (also called react query) ,

it's useQuery (a data fetching method) has a build-in property called isFetching which allow automatic fetching in a specific interval you want, like :

const { data,isLoading,isFetching } = useQuery(
   ['random-data'],
  async () => {
    const { data } = await axios.get(
      'https://random-data-api.com/api/v1/random_data'
    );
    return data;
  },
  {
   // refetch data every sec.
    refetchInterval: 1000,
  }
);

you can check more here

Related