すべてのカテゴリ

今日は、JavaScriptで外部のデータを取得して画面に表示する仕組みについて学習しました💻✨最初は正直、かなり混乱しました…💦特に、・data[0]ってどこのデータ？？・どこに「今日・明日」の情報があるの？という状態で、完全に迷子に…。でも、実際にコンソールでデータの中身を確認しながらひとつずつ見ていくことで、「データの中にさらにデータが入っている」という構造が少しずつ理解できてきました✨例えば今回の場合、data[0].timeSeries[0].areas[0].weathersという形で、👉 必要な情報まで“順番にたどっていく”ことで👉 天気データを取り出せるという仕組みでした！💡今回の気づき・いきなりコードを書こうとしない・まずはデータの中身を見るのが大事・コンソールは最強の味方まだまだ理解は途中ですが、「なんとなく読めるかも！」という感覚が出てきたのが大きな一歩でした✨少しずつですが、できることが増えていくのが楽しいです☺️引き続きコツコツ頑張ります🌿

今日はJavaScriptでAjax（データの取得）について学習しました。ボタンをクリックすると、外部サイト（気象庁）から天気データを取得する処理を作成しました。fetchを使ってデータを取得し、その後.thenでデータを受け取る流れになっているのですが、正直最初は「何をしているのか分かりづらい…」と感じました。特に難しかったのが、data[0].timeSeries[0].areas[0].weathers[1]この部分です。配列やオブジェクトが何重にも重なっていて、「どこからどこを取り出しているのか」がパッと見では理解しづらかったです。ただ、解説を見ながら一つずつたどっていくと、「大きなデータの中から必要な部分だけ取り出している」ということが分かってきました。また、fetchで取得したデータはそのままでは使えず、response.json()でJavaScriptで扱える形に変換している点も学びになりました。まだ完全に理解できたとは言えませんが、「外部からデータを取得して使う」という流れを体験できたのは大きな一歩だと感じています。少しずつですが、できることが増えてきて嬉しいです✨