このページについて

最終更新日2024/10/28 21:44:26 JST

Maretol Base は maretol のホームページです

ページコンテンツの許可のない利用は個人向けのもの以外原則として禁止していますが、事前に連絡・交渉等を行った場合や小規模なものの場合は特に怒ったりしないと思います

(ここでの個人向けとは、簡単に言うと『利用者以外の人が触れない状態』という意味です。例えばスマートフォンのロック画面に使用する場合は当人しか画像を扱えませんが、SNSアイコンに使用するとほかの人がダウンロードできるので個人向けからは外れます)

無断での利用で大きな規模の利用になった場合や、多くの衆目を浴びる状態になった場合は利用料等を請求する場合がございます


このサイトは、ページ部分はフルスクラッチで作成されています

ソースコードはオープンになっています。以下のリンクよりどうぞ

技術スタックをざっくりまとめると以下の感じです

  • フレームワーク
    • Next.js 14系Next.js 15系になりました
    • UIは shadcn/ui を使用
  • 言語
    • TypeScript
  • ホスティングなど
    • ページはCloudflare PagesのEdge Workerでホスティング
    • 一部処理はCloudflare Workersを使用
    • 画像はCloudflare R2でホスティング
      • 画像の配信最適化はCloudflare Images Transformationsを使用し圧縮とCDN最適化を実施
  • その他
    • Githubでのコード管理・自動デプロイ
    • 開発環境はWindowsとWSL、VSCodeを使用
    • CMSは microCMS を使用
      • ページ内の記事としてのコンテンツ・タグを管理

記事はすべてCMSで管理されています。画像はR2の公開URLを記事内に挿入すると、Next.jsのサーバコンポーネント内で自動で最適化URLに書き直しページを構築、クライアントにレスポンスを返す形になっています

また、TwitterのツイートURLやYouTubeのURL等も反応して自動で書き換えてiframe内コンテンツにしています

もちろんURLを挿入した際のOGP対応のリンクカードの表示なども同様にコンポーネント内部のロジックで実装しています


自前での確認もしていますが、ページ全体をフルスクラッチで作成しているほかので、もし不具合やエラー等に遭遇した場合は contact のページから適当な連絡先で教えていただけると幸いです

Share :