WEB API OpenWeatherMapを使用し天気予報サイトを作成してみた

# WEB制作

2020.06.24

こんにちは。

生のJavascriptを使用し、WEB API OpenWeatherMapを呼び出し、3日間の天気予報サイトを作成しました。

天気予報

初めての「WEB API」 所感

恥ずかしながら初めて「WEB API」というものを使用しました。

なんでこんなに便利なものを使用してこなかったのかと驚愕するほど便利なものでした。

ただ、アクセス数に応じて有料のものもあるので、使うのであれば個人的なツールとしてですね。

例えば、OpenWeatherMapを使用してLINE BOTを作成すれば、洗濯物が雨に濡れるなんてことはもうなくなるかもしれません。

今後は色々触ってみよう。

生のJavascriptで作成しました

今回は「WEB API」に触れたいという考えと、 jQuery を使用せずに生の Javascript の勉強をしたいという気持ちもありました。

そこでずいぶん時間がかかってしまいましたが、 Javascript のみで作ってみました。

まず自ら書いたのがこちらのソース。

動きは実現てきましたけど、あまりにも長く、同じような記述が多い。

何回も同じ処理をしててあまりにもダサい。

その後、フィードバックを受け再度書いた記述がこちら。

 

……200行くらい短くなりました。

あまりにも自分の力不足を痛感しました。

基本的にサイトを作るうえでJavascriptをゴリゴリに書く必要はありません。

(たしか、動きはCSSでトリガーをJavascriptでっていうのが推奨されてた気が……誰が推奨してたかは忘れましたが)

でも書けるに越したことはないので、勉強しよう。

webサイトの制作、お任せください。

あくまでも基本料金になりますので、まずはご連絡ください。

コーディング

トップページ
(ヘッダー・フッター含む)

¥8,000~

コンテンツページ(1P)
(ヘッダー・フッター含まない)

¥4,000~

ランディングページ

¥15,000~

※アニメーションはオプション料金

デザイン

トップページ
(ヘッダー・フッター含む)

¥20,000~

コンテンツページ(1P)
(ヘッダー・フッター含まない)

¥5,000~

ランディングページ

¥20,000~

※コーディングとのセット料金

サイト構築

10ページ
(お問合せページを含まない)

¥100,000~

20ページ
(お問合せページを含まない)

¥175,000~

Wordpress導入

(上記)+¥50,000~

※お問合せページは¥10,000~