React Testing Recipe 번역 - Data Fecthing

user.js

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

export default function User(props) {
  const [user, setUser] = useState(null);

	//fecth를 이용하여 데이터를 호출합니다.
  async function fetchUserData(id) {
    const response = await fetch("/" + id);
    setUser(await response.json());
  }

	//props.id가 변경된 경우 fetchUserData를 호출합니다.
  useEffect(() => {
    fetchUserData(props.id);
  }, [props.id]);

  if (!user) {
    return "loading...";
  }

  return (
    <details>
      <summary>{user.name}</summary>
      <strong>{user.age}</strong> years old
      <br />
      lives in {user.address}
    </details>
  );
}