[id].tsx

// This function gets called at build time
export const getStaticPaths: GetStaticPaths = async () => {
  // Call an external API endpoint to get dogs
  const res = await fetch("https://.../dogs");
  const dogs = await res.json();

  // Get the paths we want to pre-render based on dogs
  const paths = dogs.map((dog: any) => ({
    params: { id: dog.id },
  }));

  // We'll pre-render only these paths at build time.
  // { fallback: false } means other routes should 404.
  return { paths, fallback: false };
}

export default Doggo;