fetchとエラーハンドリング
なぜ学ぶか： 「サーバーからデータを取って表示する」はアプリの最重要動作で、AIが書く定番コードがfetchです。まずは基本の形を見てください。
まずはこの例を見てみましょう
// サーバーからデータを取ってくる定番の3段階
const res = await fetch("https://api.example.com/posts/1"); // ① 送る
if (!res.ok) { // ② 成功したか確認する
throw new Error("取得に失敗しました");
}
const post = await res.json(); // ③ 中身を取り出す
console.log(post.title);「送る → 確認 → 取り出す」。この3段階の形をそのまま覚えてOKです。
fetch＝サーバーへの問い合わせ
時間がかかるので、前にやったawaitとセットで使います。
res.okの確認を忘れない
実は、ページが無い（404）などの失敗でもfetchはエラーになりません。だから例のif (!res.ok)を自分で書く必要があります。AIはここを省くことがあります。
中身はres.json()で取り出す
「返事を受け取る」と「中身を読む」の2段階に分かれています。どちらにもawaitが付きます。
失敗に備えてtry/catch
通信は失敗するもの。エラーを受け止めてユーザーに伝えるまでが完成です（次のコードのステップで触ります）。
ステップ 1 / 3
※ カリキュラムの内容はAIが生成しており、誤りが含まれる場合があります。正確な情報は公式ドキュメント等でご確認ください。