How can I load API before Website React Js? [closed]

Question

When I open the site for the first time, it Loads before the API and when I Load it again, the data appears.enter image description here

Answer 1

Make a state for fetching and set it as true. When true, make the function return a spinner or loading whichever you prefer. After your fetching is done set it as false then return your actual content that you want.

Brief example:

import React, { useState, useEffect } from "react";

export default function App() {
  const [fetching, setFetching] = useState(true)

  useEffect(() => {
    fetchStuff()
    setFetching(false)
  }, [])

  if(fetching) {
    return <div>loading....</div>
  }

  return (
    <div>
    content...
    </div>
  );
}