「北欧、暮らしの道具店」がCMSをWordPressからStoryblokへ、チームやユーザーとともに移行を達成

【session5】WordPressからヘッドレスCMSへ！ Storyblokへの移行プロセス

　「北欧、暮らしの道具店」は北欧にインスパイアされた美意識やセンスを垣間見ることができる読み物等のコンテンツが充実したメディア型ECサイトだ。シンプルでナチュラル、温かみがある生活へのこだわりが感じられてファンも多い。同サイトを運営するクラシコムでは、サイトのCMSをWordPressからヘッドレスCMS（Storyblok）へ移行した。移行プロジェクトの経緯を、同 システムプラットフォーム部 テクノロジーグループ 矢田和沙氏が解説する。

動画やラジオも！ リッチなWebコンテンツを支えるシステム

　クラシコムでは「北欧、暮らしの道具店」というメディアECサイトを運営している。北欧を中心とした生活雑貨やオリジナル商品を販売する「ECサイト」と、その世界観をつくる記事や動画など幅広いコンテンツを配信する「パブリッシャー」としての側面を持つ。

　北欧、暮らしの道具店の開発・運用は同エンジニアリングチームが実施している。外部の会社との協力も積極的に行っており、スマートフォンアプリや受発注システムは別会社と共同開発している。

　今回のテーマはコンテンツ管理システムの移行。経緯について、同システムプラットフォーム部 テクノロジーグループ 矢田和沙氏が解説する。なお同氏はヤフー（現LINEヤフー）を経て、2020年7月からクラシコムに中途入社して6年目。現在は主に同社のフロントエンド・バックエンド・インフラと、「北欧、暮らしの道具店」のサービス周辺の開発を担当している。

株式会社クラシコム システムプラットフォーム部 テクノロジーグループ 矢田 和沙氏

　まず「北欧、暮らしの道具店」は、おおまかに商品ページ、読みもの（テキスト）、ビデオ（動画）、ラジオ（音声）といったコンテンツとトップページからなり、読みものには、コラム、ブランドノート（他社企業製品の紹介記事）、お知らせ、着用レビューなど幅広い種類がある。読みものは基本的に平日の朝9時半に数本が公開される。ほとんどが新規記事の予約公開だが、たまに過去記事の修正や再掲載もある。

　今回CMSをWordPressからStoryblokに移行した。移行前は読みもの、ビデオ、ラジオのコンテンツが自社でホスティングしているWordPressを使用していた。なお商品ページとトップページは内製したシステムで管理していた。

　記事更新時には、WordPressをヘッドレスCMSとして利用し、Laravelで動いているシステムやアプリケーションからAPIを経由してバッチで内容を取得し、Amazon OpenSearch Serviceへデータ保存するという流れで処理していた。このアーキテクチャだと、読みものの更新時に最大10分程度のラグが生じていた。

「北欧、暮らしの道具店」のシステム概要（従来）

　移行後はWordPressで稼働していた読みもの、ビデオ、ラジオに加えて、トップページをStoryblokへと移行した。Storyblokでは更新したタイミングでWebhookを叩くことができるため、Laravelのアプリケーションでエンドポイントを作成して更新通知して、データの反映を行う。

「北欧、暮らしの道具店」のシステム概要（現在）

　現在はWordPressのデータもStoryblokのデータも（読者が閲覧する）OpenSearchに格納しているので、新旧のCMSを併用している状態だ。今後CMSはStoryblokに一本化する予定なのでWordPressのデータ移行を終えたら、WordPressは廃止する。

「北欧、暮らしの道具店」のシステム概要（将来）