import useSWR from 'swr'
 
const HeroSection = () => {
  const { data, error, isLoading } = useSWR('/api/herosection/123', fetcher)
 
  if (error) return <div>failed to load</div>
  if (isLoading) return <div>loading...</div>
 
  // render data
  return <div>hello {data.name}!</div>
}