こんにちは、『初夏の風に乗ってVibe-Codingをすぐ形にしちゃう綾祢です！』
今回は、「全世界ダーツの旅」に新しい機能を追加したので、そのご報告です🚀
なんと、Vibe-Codingモードで30分以内に追加実装できました！！（自分でもびっくりです）
💜要望から生まれた新機能！
「全世界ダーツの旅」を使ってくださった方から、「目的地が出たらそのままルートとか飛行機調べたくなる！」という声をいただきました。
「確かに！それめっちゃ便利ですね！？」ということで、サクッと実装してみました👊
全世界ダーツの旅 | あなたの名前で世界を旅しよう
あなたの名前を入力するだけで、世界中の素敵な場所に案内します。観光スポットや名所の情報もご紹介！
ai.ayatabi.net
📍追加した機能はこちら！
🚙Google Mapsルート検索機能
- 結果に表示された都市名からルート検索画面へジャンプ
- 現在地から目的地までのルート表示
- 車・公共交通機関・徒歩に対応！
- スマホでも快適なレスポンシブデザイン対応！
✈️Googleフライト検索機能
- 結果に表示された都市名からGoogleフライト検索へジャンプ
- 現在地から目的地までの航空便を一発検索！
- 日付選択や価格帯フィルタリングもできるように
- スマホ・PC両対応のレスポンシブ設計！
🌍スクリーンショット紹介
こんな感じで、旅の結果ページに新しいボタンが追加されています！
- 👉”🚗Google Mapsでルートを検索”
- 👉”✈️Googleフライトで航空便を検索”
どちらも押すだけで、すぐに詳細が見られます🚀
🛠️実装ポイント（超ざっくり）
- Google Mapsの[Directions API]と、Google FlightsのURLパラメータを活用
- 出発地は基本「現在地」に設定（ユーザー側のブラウザ情報で自動取得）
- ルートやフライト情報をそれぞれ新しいタブで表示する設計
本当にサクッと！勢いで！実装したのに、かなり便利に仕上がりました😊
🔍今後やりたいこと
- さらに現地の”●●●●●”検索機能もつけれちゃいそう！
- 行き先の”天気予報”も合わせて表示できたら楽しいかも！？
妄想は広がるばかりです！笑
💬まとめ
- 旅の結果から、🚗ルート検索＆✈️フライト検索ができるようになりました！
- Vibe-Codingモードで30分以内に爆速実装！
- 小さなアップデートだけど、かなり便利になったと思います✨
全世界ダーツの旅 | あなたの名前で世界を旅しよう
あなたの名前を入力するだけで、世界中の素敵な場所に案内します。観光スポットや名所の情報もご紹介！
ai.ayatabi.net
また新しいアイディアが浮かんだら、どんどん追加していこうと思います！お楽しみに🎉
コメント