服装天気帳 ― 天気を見て「今日の服装」の目安を決める、シンプル Web アプリ

自作アプリ

年末で帰省予定なのですが、私の帰省はかなりの大移動なので距離が遠く、
天気が全然違ったり、服装がこちらのものと同じでいいのか毎回不安になる。。

天気予報サイトでもいいのですがいらない情報も多いため、
目的地の1週間の天気と、行き先前後の地図を表示してくれるのと、大まかな服装目安だけを
シンプルに教えてくれるアプリを作成。

以下ウェブアプリのリンク先
https://kan-taro.github.io/tenk_fuku/

説明は以下です。
https://github.com/kan-taro/tenk_fuku


🎯 何ができる?

  • 都市名検索
  • 東京都内・大阪府・京都市や町名で…好きな場所を入力すると、その位置にズームした地図と天気情報が表示されます。
  • 7日間の天気予報
  • 現在時刻から1週間先まで、天候(晴れ・雨・雪など)と最高/最低温度をアイコン付きで確認できます。
  • 服装提案
  • 温度・天気・UV指数・風速・アクティビティ別に「Tシャツ+サングラス」「コート+マフラー」など、1行で分かるおすすめ衣装を表示。
  • アイコンも同時に提示し、見た目だけでも直感的に判断できます。
  • 地図と天気の連動
  • 検索した都市にマーカーが立ち、ポップアップで現在の天気・温度を即座に確認

🌐 使い方は簡単

  1. ブラウザで https://kan-taro.github.io/tenk_fuku/へアクセス。
  2. 上部のテキストボックスに「東京」や「大阪」など都市名を入力。
  3. 「検索」ボタンか Enter キーを押すと、マップ・天気・服装が自動で更新。

📦 何が必要?

  • Web ブラウザ(Chrome/Firefox/Edge/Safari 推奨)

外部ライブラリは CDN 経由で読み込むだけなので、特別なセットアップは不要です。


🔧 こんな場面に便利

  • アウトドア好き
  • 今日の天気と服装を一目で確認して、持ち物チェックリストを作成。
  • ファッションコーディネート
  • 天候に合わせた衣類提案が自動で出るので、朝の準備時間短縮。
  • 旅行前のチェック
  • 行き先都市の週間天気とおすすめ装備を簡単に確認できる。

📜 まとめ

「服装天気帳」は、天気情報だけでなく「何を着ればいいか」を即座に提案する便利ツールです。
コードはシンプルな HTML/CSS/JavaScript で構成されているので、学習や改造も楽々。

コメント