株式会社YMC コーポレートサイト制作

株式会社YMC コーポレートサイト制作

担当領域・役割

ディレクション / フロントエンド開発 / API設計

プロジェクト概要

「名刺代わりのWebサイト」というテーマにサイト制作を行いました。
サイトに掲載する内容も必要最低限で、重要な情報のみを掲載し伝えたいことを明確に伝わるような設計にしています。
掲載するコンテンツが短いですが、適度なアニメーションを設定して見応えを付与しています。

技術構成

Nuxtを利用して欲しいという前提で話が進んでいたため、Nuxt3を利用しています。
"main"ブランチにcommit時にリンターが走って、サイトがアップされるようなCI/CDをとっています。

  • Nuxt3 / Vue3
  • ESLint / Markuplint
  • GSAP
  • MicroCMS
  • Git(CI/CD)
  • GA4 / GTM
  • Figma

CMS・コンテンツ運用

サーバーをクラウドに変更する可能性が高かったため、WordPressのヘッドレスCMS化や独自CMSの利用などを行わず、MicroCMSを利用して外部に依存する形を選択しました。
物件の掲載のみCMSでの運用を行っており、Nuxt側のテンプレからMicroCMS経由でjsonから抽出するようにしています。

現状では物件の掲載を全て行えておらず、頻繁に更新を行っていくため動的に取得するようにしています。
掲載を全て行った後はSEO向上を目的にSSGに変更するようにしています

  • MicroCMS投稿からの物件管理
  • 画像アップロード後からのWebpへの自動配信
  • 自動ルーティングによるページ追加作業などの削減