Shifter Advent Calendar 2020 ということで、Shifterと親和性の高いというかShifterのテックスタックそのものであるJamStackを使ったヘッドレスコマースの事例を集めてみました。

Shifterを使ってWordPressやJamStackベースでコマースサイトを作ってみたい方はぜひご参考にしてみてください（圧倒的に英語の情報が多いですが）。

そもそもヘッドレスコマースとは何か？

APIベースでコマースサイト（日本では一般的にECサイトやオンラインショップと呼ばれるもの）のフロント機能とバックエンド機能を切り離し、ヘッドであるフロントは自由に差し替えてコマース体験を提供しようという技術的なアプローチです。

過去２回、Shifter Meetupで登壇させていただいた資料がありますので、詳しくはこちらをご覧ください。

豊富なAPIが揃っているマルチチャネルコマースプラットフォームのShopifyは、ヘッドレスコマースと相性の良いサービスと言えます（実際これから紹介する事例もそのほとんどがShopifyを使ったものです）。

ShopifyのAPIの詳細については、こちらの開発者サイトをご覧ください。

ということで事例

「JamStack Headless Commerce」というキーワードでインターネットを検索するとたくさん情報が出てきますが、私がお勧めするのは、今年開かれたNetlify主催のHeadless Commerce Summitの動画です。前述のようにShopifyの事例が多いですが、その他のものもあります。その中で以下の動画は特にお勧めです。

ちなみに２番目の動画のスピーカーであるKelly Vaughnさんは、ShopifyパートナーとしてShopifyの開発者向けTwitchチャネルなどで開発者向けの配信もされています。ご興味ある方は覗いてみてください。

ところで技術的アプローチの事例はわかったけど、実際にビジネスでどのように採用されているかの事例もみたいという方もいらっしゃるでしょう。その場合は、上記の私の資料でも紹介している以下のブログをお勧めします。ヘッドレスコマースの採用の経緯やそのメリットだけでなくてデメリットも紹介されているので、本格的に導入を考えられている方は参考にしてみてください。

柔軟なEコマースを実現する「ヘッドレスコマース」とは？　事例やメリットを紹介

またJamStackを採用する際によく使われるGatsbyというフレームワークがありますが、そのグッズサイトもShopifyを使ったヘッドレスコマース（さらにこちらはPWA化もされています）として構築されています。フレームワークのサイトだけあって、実装の事例としてとてもよくできていると思います。

Gatsby Store

JamStackとヘッドレスコマースの情報収集

日本ではまだ情報が少ないヘッドレスコマースですが、こちらの佐藤さんという方はShopifyパートナーであり、JamStackやヘッドレスコマースの最新情報を海外のもの含め多数発信されています。Shopify自体の最新情報も最速で発信されているので、この分野に興味のある方はフォローをお勧めします。

また彼の所属するnon-standard world社のブログもJamStack、PWA、ヘッドレスコマースの記事がたくさん掲載されています。

最後に

簡単ではありますが、JamStackとヘッドレスコマースの事例と情報ソースをまとめてみました。Shifterでコマースサイトを作りたい方の参考になれば幸いです。

最後にちょっとした宣伝ですが、私がShifterに興味を持ったきっかけとして、そのベースとなっているWordPressとShopifyの思想や仕組みの類似性があります。WordPress（Shifter）もShopifyも開発者やパートナーのコミュニティを大事にし、プラグインやアプリと呼ばれる拡張機能を公開してユーザーに多大なメリットを提供することで成長してきました。こういったエコシステムが機能していることは両者の強みかと思います。

もしヘッドレスコマースだけではなく、そうしたShopifyのエコシステムに開発者として参加することに興味を持たれた方は、以下のブログもご覧になってみてください。

Shopifyアプリ公開パーフェクトガイド：アプリエコシステムに上手に参加する方法

それでは皆さん、Happy Coding & Christmas!