
アクアコーポレートサイトの利用技術
2021年10月27日 喬 丹
技術動向
皆さんがご覧になっているアクアのコーポレートサイトの開発を担当している若手社員の喬です。 アクアのコーポレートサイトは、今どきのWebサイト構築技術(いわゆるJAMStackというやつですね)をつかって開発しています。
今日は、アクアのコーポレートサイトを支える技術について紹介します。
Gatsby
Gatsbyは静的サイトジェネレーター(SSG)の1つで、高速なサイトを手軽に構築するためのReactをベースに開発されたフレームワークです。
公式サイト: https://www.gatsbyjs.org/
ビルド時に全てのHTMLを最初に生成するツールで、サーバーでのページ生成処理がないので読み込みが高速動的要素が少ないコーポレートサイトにはうってつけです。
Gatsbyを採用するメリット:
-
GraphQLを標準採用している
-
プラグインが豊富で、Contentful連携などが容易に実現可能
-
欧米での導入実績が増えており今後のトレンドと予想される
-
公式でNetlify, Contentfulとのコラボレーションが多く紹介
Contentful
“Contentful”を一言でいうと、コンテンツを1つのリポジトリで管理してくれるサービスです。Webページの「ヘッド」つまり「フロントエンド」がないCMSで、API経由でデータを取得し、独自のフロントエンドを構築可能です。
公式サイト: https://www.contentful.com/
Contentfulを採用するメリット
- PaaS型CMSでサーバー管理の必要がない
- Headless CMS界隈で開発者コミュニティの規模が最大
- Spotify、WeWorkなど、企業での導入実績あり
- Webhook機能を用いることでコンテンツ更新を他サービスに伝えることができる
Netlify
Netlifyは、静的サイトをホスティングすることができるWebサービスです。
公式サイト: https://www.netlify.com/
Netlifyを採用するメリット
- CIツールを内包。GitHubなどのリモートリポジトリと連携するだけでCI/CDを実現できる(別途ブランチの設定は必要)
- build hookと呼ばれる外部サービスのイベントをトリガに自動ビルド/デプロイを行うAPIが用意されている
- Form機能を利用することでサーバーサイド設計なしで問い合わせ処理が実現できる。メール通知も設定できる
これからも最新のWeb技術を取り入れて、コーポレートサイトも進化を続けていきます。どうぞご期待ください。