I'm trying to teach myself how to make an API request using SSR.

// pages/index.tsx
import React from 'react';

interface HomeProps {
  joke: string;
}

export default function Home({ joke }: HomeProps) {
  return (
    <div>
      <h1>Dad Joke of the Day</h1>
      <p>{joke}</p>
    </div>
  );
}

export async function getServerSideProps(): Promise<{ props: HomeProps }> {
  const res = await fetch('https://icanhazdadjoke.com/', {
    headers: {
      Accept: 'application/json',
    },
  });
  const data = await res.json();

  return {
    props: {
      joke: data.joke,
    },
  };
}

Just a simple snippet trying to figure it out.