Jugendtraum

ホームページを作り直した

気づけば5年。静的HTMLだけで動いていたこのサイトを、ようやく現代仕様にしました。
2025年10月中旬、新しい構成でjugendtraum.netをリニューアルしています。

きっかけ

旅行の写真を見やすくまとめたGalleryを作りたくなり、一から構成を見直すことにしました。

これまでも旅行の写真を掲載したページを作っていましたが、HTMLファイルを手書きするのは限界がありました。
特にexifデータの埋め込みは、タグに手入力するという荒業。

<h2>観光 奉恩寺(ポンウンサ) - 봉은사</h2>
<div class="photos_horizontally">
    <img src="koreatrip2404/koreatrip2404-45.jpg" alt="" class="pop_imgs" data-title="奉恩寺に来た" data-date="2024.04.13" data-time="10:54" data-shoton="Samsung Galaxy Z Fold5" data-iso="25" data-focallength="23mm" data-ev="0.0ev" data-f="F1.8" data-shutter="1/3483s" loading="lazy">
    <img src="koreatrip2404/koreatrip2404-46.jpg" alt="" class="pop_imgs" data-title="いい門だ" data-date="2024.04.13" data-time="10:54" data-shoton="Samsung Galaxy Z Fold5" data-iso="25" data-focallength="23mm" data-ev="0.0ev" data-f="F1.8" data-shutter="1/1978s" loading="lazy">
    <img src="koreatrip2404/koreatrip2404-47.jpg" alt="" class="pop_imgs" data-title="奉恩寺" data-date="2024.04.13" data-time="10:55" data-shoton="Samsung Galaxy Z Fold5" data-iso="25" data-focallength="23mm" data-ev="0.0ev" data-f="F1.8" data-shutter="1/1235s" loading="lazy">
</div>

この面倒くささもあって、以前のホームページは放置気味になっていました。

技術構成

Next.js と Go を使っています。
Goは画像やブログ記事を返すAPIサーバーとして、Next.jsはフロントエンドとして使用しています。
画像のメタデータ処理をバックエンド側で完結させ、フロントエンドではシンプルに表示するだけ。無理のない自然な構成になりました。
TailwindCSS も試してみましたが、最終的には自作CSSがしっくりきました。

デプロイは Conoha VPS を利用しています。
以前は lolipop でサイトをホスティングしていましたが、色々できそうなので移行してみました。

今後について

しばらくはこのサイトを運用しながら、パフォーマンス改善や機能追加をしていく予定です。
新しい技術を試しつつ、その過程もまたどこかで書けたらいいなと思います。