個人family-trips

夏の大分帰省にあわせて、家族旅行アーカイブサイト family-trips（Astro + Cloudflare Pages）の旅行詳細ページのマップに、阿蘇エリアの候補スポットを足しこんだ。最終的にピンは 16 件から 25 件まで増えた。

途中で dev server のキャッシュとポート競合に時間を吸われ、HMR は2回死んだ。記録として残しておく。

1. 星野リゾートのガイドから観光ピンを6件追加

最初の指示は雑に投げた。

https://hoshinoresorts.com/jp/guide/area/kyushu/kumamoto-area/aso/aso-kanko/ ちょっとね、今回の大分の帰省で、この阿蘇にちょっと行ってみようかなと思ってて。これらをですね、ちょっとマップに加えといてもらえませんかね。

URL を渡しただけ。Claude Code には「このガイドに載っている観光地6スポットをピン追加して、Markdown の観光地リストも合わせて更新して」と動いてもらった。カテゴリは 観光 で統一。

pnpm dev でローカルを 4321 番ポートに立ち上げてマップを開くと、6 ピンとも反映されていた。ここまでは何の障害もなかった。

2. アソキャンの追加と Google Maps 口コミの取得

次は Google Maps の URL を直接渡された。

ちょっとここもお願いしたいのと、これちょっとユーザーの口コミまとめといてくれませんかね。

阿蘇のグランピング系キャンプ場「アソキャン（ロッジ宿泊）」だった。Claude Code に、ピン追加と Google Maps 口コミの取得を並行で進めさせた。

口コミは全部で 33 件あり、agent-browser でスクロールしながら 20 件以上取った。そのまま生で並べても読めないので、memo/2026-05-21/ 配下の作業メモに「家族旅行視点で何が刺さるか」を軸にまとめてもらった。

  • ロッジは清潔、設備は新しい
  • スタッフ対応が丁寧
  • 食事（夕食バーベキュー / 朝食）の評判が高い
  • 周辺は田舎で、夜は星が見える
  • 子連れに向く、温泉が併設されている

家族で行くかどうかの判断には、星評価よりこの粒度の事実の方が効く。

3. ピンが反映されない → dev server のキャッシュとポート競合

ピンを追加してブラウザをリロードしても、アソキャンのピンが地図に出てこなかった。

JSON ファイルを確認すると、22 ピン分のデータは正しく入っていた。コードもデータも問題なし。残るは dev server のキャッシュだろう、と当たりを付けて再起動をかけた。

ここで pnpm dev のログを見て手が止まった。新しい dev server が 4321 番ではなく 4322 番に逃げていた。前のプロセスが 4321 を握りっぱなしになっていたらしい。

# ポート 4321 を握っているプロセスを特定して落とす
$pid = (Get-NetTCPConnection -LocalPort 4321 -ErrorAction SilentlyContinue).OwningProcess | Select-Object -Unique
if ($pid) { Stop-Process -Id $pid -Force }

古いプロセスを落としてから pnpm dev を打ち直すと、新しいサーバーがちゃんと 4321 で立ち上がった。ブラウザをリロードすると、22 ピン全件が地図に並んだ。

Stop-Process -Name node -Force で雑に殺すと Claude Code 本体まで道連れになる。今日もここはポート指定で踏みとどまった。

4. 「自然にそのまま遊べる場所」を周辺から探す

ピンの全件反映を見届けた直後、ユーザーから方向修正が入った。

この施設内、もしくはこの施設の周りで、なんか自然にそのまま遊べるところってありますかね。

「観光地」より一段ゆるい温度の要望。子供と一緒に、立ち寄って 1〜2 時間で済むような場所が欲しい、ということだろうと解釈した。

公式サイトの周辺ガイドはあっさりしていて使えなかったので、Claude Code に Web 検索で補完させた。返ってきた候補は 4 件。

  1. あそ・ビバ（芝生・遊具・小川）
  2. 道の駅阿蘇（広場・遊具）
  3. 古閑の滝（自然の滝、徒歩でアクセス可）
  4. 宮川渓谷（川遊び）

このうち「宮川渓谷」は、阿蘇市内の地名としては Google でも OpenStreetMap でもまともにヒットせず、ok-camp.work というキャンプ系サイトの宣伝文だけが返ってきた。実在が怪しいので、ここはピンには起こさず Markdown の「見送り候補と理由」に残すだけにした。

5. 座標取得: Nominatim API は使えなかった

ピンの座標は OpenStreetMap の Nominatim API で取りに行こうとした。が、日本のローカルスポット名を投げると見当違いの座標が返ってきた。「あそ・ビバ」がアフリカや南米のどこかになるレベルでズレる。

ここは粘らずに Google Maps に切り替えた。スポット名で検索して、URL の @ の後ろに乗っている緯度経度をそのまま控える。3 件分やる：

  • あそ・ビバ: 32.9761, 131.0427
  • 道の駅阿蘇: 32.9370, 131.0809
  • 古閑の滝: 32.9221, 131.1449

検索が走った瞬間に座標が確定するので、API 越しに名前解決させるより速かった。

6. HMR がまた死ぬ → ハード再起動で 25 ピン全件反映

新しい 3 ピンを JSON に書き足してブラウザに戻ったが、また地図が更新されなかった。今度こそ HMR の問題だろうと当たりを付けて、Astro の dev server を一度ハードに落として立て直した。

リロード後、地図にはアソキャン + 既存ピン群 + 新規 3 ピンの計 25 件が並んだ。スクリーンショットを撮って今日の作業を区切った。

dev server のキャッシュは、ピンや地図のような「データだけが変わって UI 構造は変わらない」更新と相性が悪い。今日 2 回踏んで、3 回目があったらまず dev server を疑うことにする。

7. 不要セクションの削除

最後にユーザーから整理指示が入った。

持ち物の買い出しメモはいらないんで削除してほしいです。あとね、振り返りとか当日のしおりもとりあえずいらないです。食事メモも特にいらないです。

旅行記事の Markdown には、テンプレ的に「持ち物・買い出しメモ」「当日のしおり」「振り返り」「食事メモ」の 4 セクションを最初から入れていたが、行ったあとに書く話なのでまだ早い。Claude Code に該当 4 セクションを丸ごと落としてもらった。

結果、ファイルは「見送り候補と理由」で終わる、出発前にちょうどよい粒度になった。

学び

  • 地図ピンの追加で反映されないときは、「データ」「コード」「dev server のキャッシュ / ポート」の順で疑う。今日のケースは3つ目だった
  • 日本のローカル地名は Nominatim より Google Maps の URL から座標を取った方が速い
  • Google Maps の口コミは星評価より、家族構成・滞在シーン別の事実を拾うとそのまま判断材料になる
  • 旅行記事のテンプレに「出発前に書く」セクションと「帰ってから書く」セクションが混じっていた。次から最初は前者だけ生成する

見送り候補と理由

  • 宮川渓谷（阿蘇市）: Google Maps・OpenStreetMap ともに該当する地名が検索ヒットせず、出所が宣伝サイト1つに限られたため見送り。実在が確認できたら追加する。