ブログ

読んで思い出す。忘れるために書く

OpenWeatherMap API と連携して天気予報を表示する

Ruby on Rails - Rails 天気予報取得 表示|teratail」で、質問者によって書かれた JavaScript との連携方法を調べてみた

リポジトリ

GitHubリポジトリを作った : gouf/open_weather_map_demo - GitHub

書いたコード

(faraday gem で書いた例)

Faraday gem を利用して ぜんぶ Ruby 側にコードを寄せてしまってもよかったけど、既存の JavaScript コードとの連携が今回の目的なのでパス

(といいつつ JavaScript の部分は結構 書き換えてしまった...)

大まかな処理内容

Rails と絡めた書き方にするために

  • <div class="weather" data-weather="Tokyo"/> のようなコードを Controller - View で生成
  • JavaScript 側で class で要素を拾う
  • 要素の data 属性値をもとに、OpenWeather API にリクエストを送信
  • リクエストの応答情報をもとに、天気予報をページ中に表示

という処理の流れを考えた

詳細は 作成したリポジトリ を参照のこと

Links