Traditional Client Side Data Fetching Example
import {useEffect, useState} from 'react'
function App() {
const [products, setProducts] = useState([])
const [isLoading, setIsLoading] = useState(false)
useEffect(() => {
setIsLoading(true)
fetch('/dummydata.json')
.then((response) => { return response.json()})
.then((data) => {
setProducts(data.products)
setIsLoading(false)
})
}, [])
if (isLoading) {
return <p>Loading...</p>
}
return (
<ul>
{products.map(() => {
<li key={products.id}>{products.title}</li>
})}
</ul>
)
}
export default App