fetch()

// ── 基本: GETリクエスト ──────────────────────────────────
async function getUser(id: number) {
  try {
    const response = await fetch(`https://api.example.com/users/${id}`);

    // 200番台以外はエラーとして扱う（fetchはネットワークエラーのみthrow）
    if (!response.ok) {
      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
    }

    const data = await response.json(); // JSON をオブジェクトに変換
    return data;
  } catch (error) {
    console.error('取得失敗:', error);
    throw error;
  }
}

// ── POSTリクエスト: データを送信 ─────────────────────
async function createUser(userData: { name: string; email: string }) {
  const response = await fetch('/api/users', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json', // JSON を送ることを明示
      'Authorization': `Bearer ${token}`,   // 認証トークン
    },
    body: JSON.stringify(userData), // オブジェクトをJSON文字列に変換
  });

  if (!response.ok) throw new Error('作成失敗');
  return response.json();
}

// ── React での使い方 ────────────────────────────────────
function UserList() {
  const [users, setUsers] = useState([]);

  useEffect(() => {
    getUser(1).then(data => setUsers(data));
  }, []);

  return <ul>{users.map(u => <li key={u.id}>{u.name}</li>)}</ul>;
}