Skip to main content
Build the future with Agentforce at TDX in San Francisco or on Salesforce+ on March 5–6. Register now.

ヘッドレスコマース実装を計画する

学習の目的

この単元を完了すると、次のことができるようになります。

  • ヘッドレスコマースの一般的な使用事例を説明する。
  • ヘッドレスに移行する利点を 3 つ挙げる。
  • 使用できるヘッドレスツールを 3 つ挙げる。
  • ヘッドレスアプローチを選択する場合を説明する。

はじめに

Cloud Kicks Corporation のスポーツアパレル商品は好評で種類も増え続けています。そのため、買い物客の需要に合わせて会社も急速に拡大しています。Cloud Kicks の上級開発者である Vijay Lahiri の役割も大きくなってきています。やる気を感じた彼は、ヘッドレスコマースを早期に導入した会社を調べて参考にしようとしています。そのような会社は規模よりも技術的な成熟度に特徴があり、Vijay はその部分に注目します。これほどの技術的投資は短期的にはコストの増加につながる可能性があります。

ヘッドレスは IT と開発チームの拡大につながるため、短期的にはコストが増加する可能性がある。

一般に、ヘッドレスに最適なのは、しっかりした IT 部門があり、自社で業務を行おうとする姿勢が強い会社です。Cloud Kicks と同じように、そのような会社には何か月も先まで開発案件があり、意欲的なクリエイティブチームとマーケティングチームはフロントエンドに新しいデザイン、コピー、テンプレートをロールアウトすることに熱心です。

ヘッドレスを導入することで、多数の開発者を抱える大規模なマーチャントや、包括的なマーチャント実装を専門とする Salesforce パートナーは、切望していた技術的柔軟性を実現できます。さらに、ヘッドレスコマースを実装するための追加開発コストを相殺するのに必要な投資収益も生成できます。サンプルアプリケーションや参照アプリケーションを出発点として使用すれば、開発を加速できます。

通常、ヘッドレス実装のフロントエンドはマーチャントが責任を持ちます。Vijay とチームがヘッドレスプラットフォームの開発を開始するときには、セキュリティ、開発者運用、ホスティング、コンプライアンスを管理するリソースも含める必要があります。

Storefront Reference Architecture (SFRA) スタイルの開発からはじめてヘッドレスに移行する

Vijay はヘッドレスを SFRA スタイルの開発と比較します。この開発では Salesforce から基本的なアプリケーションストアフロントカートリッジが提供され、その上に LINK、サードパーティ、カスタムのカートリッジを積み上げて実行します。

LINK カートリッジとは、LINK テクノロジーパートナープログラムのメンバーによって開発され、Salesforce B2C Commerce ストアフロントアプリケーションの市場に適合した事前統合済みソリューションです。たとえば、PayPal と Bazaarvoice はそれぞれ事前統合済みの支払処理と商品評価の LINK カートリッジを提供しています。

SFRA ではフロントエンドとバックエンドの両方の機能が提供されます。Cloud Kicks は一部のストアフロントアプリケーションについては、このアーキテクチャを保持したいと考える可能性があります。そのため、立ち上げまでの時間を最短にするために SFRA から開始して、ビジネスのニーズに基づいて SFRA とヘッドレスを組み合わせていけることは Vijay にとって朗報です。

Cloud Kicks は価値実現までの時間を短縮することを望んでいますが、将来についても前向きで、競合他社よりも優位に立つために、あらゆる場所で販売したいと考えています。このアプローチを使用すれば、可能な限り早く立ち上げられるのに加えて、柔軟性も高く、将来的にはヘッドレスアーキテクチャに移行することで今後ずっとストアフロントのイノベーションを継続していくことができます。

PWA キットと管理ランタイムを使用して最初にヘッドレスの作成を開始する

Vijay は、B2C Commerce プラットフォームは柔軟なため、ヘッドレスに移行する方法が他にもあることを知っています。ゼロから始める代わりに、Progressive Web App (PWA) キットと管理ランタイムを使用すれば、開発者が必要とする最新のツールによってフロントエンドのスピードを実現するヘッドレスアプローチを有効にすることができます。

PWA キットとは、React を使用してストアフロントを作成するためのフレームワークで、次の機能を含みます。

  • プロジェクトテンプレート。ホームページからチェックアウトまでコア E コマースフローを実装するカスタマイズ可能なストアフロントを含みます。
  • 表示システム。サーバー側とクライアント側の両方で機能し、ハイドレーション (サーバーからクライアントに表示を転送するプロセス) を処理します。
  • ルーティングシステム。Commerce API からのデータをコンポーネントに挿入できるようにします。
  • ユーティリティ関数とスクリプト。定型的な開発作業を自動化します。
  • B2C Commerce APIOpen Commerce API (OCAPI) とのインテグレーション。
  • 基本的なプログレッシブ Web アプリケーション機能のサポート。

PWA キットと管理ランタイムによって B2C Commerce の買い物客向けのヘッドレスソリューションが提供されます。Vijay とチームは PWA キットのプロジェクトテンプレートと Salesforce Commerce API を使用することでより早く立ち上げられます。PWA キットの事前作成済み React コンポーネントをカスタマイズできるのに加えて、ランタイム管理から解放されることでイノベーションとユーザーエクスペリエンスに集中できます。コーディングには JavaScript または TypeScript を選択できます。これによって PWA キットとフロントエンドアプリケーションをホスト、リリース、保護、拡大するためのインフラストラクチャが提供されるため、大企業で必要とされる拡張性が得られ、グローバルなお客様のアップタイム実績は 99.99% となっています。 

ヘッドレスアプローチに移行する利点

Vijay のチームはヘッドレスコマースに切り替える準備ができています。その労力を費やす価値があることを示す次のような利点があります。

  • 従業員採用率の向上: 高度な開発者スキルがなくても、チームの誰もがフロントエンドに簡単にアクセスして更新できます。
  • フロントエンドリリースの手順の削減: IT チームを通さずに E コマース Web サイトの変更を行えるようになります。ヘッドレスコマースユーザーは少ない手順で変更をリリースできます。
  • IT の時間の節約: 開発者でないユーザーが IT チームにチケットを送信することなくフロントエンドに変更をコミットできるため、開発者は重要な作業に集中できます。
  • 立ち上げまでの時間の短縮: マーチャントは新しいフロントエンドエクスペリエンスを迅速に立ち上げられるため、コストがかかるバックエンド開発を最小限に抑えつつ市場への対応を加速できます。

ヘッドレスコマースに投資することにしたマーチャントの多くは、すでに CI/CD (継続的インテグレーションおよび継続的リリース) などの成熟したソフトウェアエンジニアリング手法を確立しています。ヘッドレスコマースを採用することで、エンジニアリング手法をさらに活用しながら、上記のメリットを享受できます。

ヘッドレスによってショッピング体験が改善され、その結果顧客満足度が上昇する。

使用事例: 人工知能 (AI)

Vijay がヘッドレスについて最も関心を持っているのは、AI を使用してすべてのタッチポイントでのデジタル体験を処理できるプラットフォームです。彼はあらゆる場所にいる買い物客とつながることができ、Heroku を使用して簡単に拡大できる B2C Commerce 用のカスタムモバイルアプリケーションを作成したいと考えています。このアプリケーションでは魅力的なストアフロント体験を提供し、買い物客や業界に関するライブデータに基づいて Cloud Kicks ブランドの位置付けを示し、買い物客を楽しませます。

また彼は、店員が複数のチャネルでの在庫を確認でき、得意客にパーソナライズされたサービスを提供できる店舗内アプリケーションも作成したいと考えています。最も重要なことは、買い物客向けのモバイルアプリケーションと店員用の店舗内アプリケーションで同じバックエンドプラットフォームを共有することです。

開発ツールを選択する

Vijay には検討することがたくさんあります。この新しい環境を作成するために必要なツールを調査する必要があります。次にいくつか例を示します。

  • node.js 環境: 彼はすでに npm には精通していて、node.js を使用することを想定しています。
  • ソース制御: 彼はバージョン管理システムを使用してソースコードを保存し、ストアフロントアプリケーションのリリースを促進します。彼が選択したのは Github です。
  • B2C Commerce Sandbox: 彼はアプリケーションの開発とテストのためにオンデマンド Sandbox にアクセスできます。このプラットフォームへの Account Manager アクセス権が必要です。
  • コード編集ツール: 彼は一部のアプリケーションには Eclipse を使用し、他のアプリケーションには Visual Studio を使用します。オープン Web 標準に従ってヘッドレスアプリケーションを開発するため、他の IDE を使用することもできます。
  • API: 彼は任意の言語での高速でスケーラブルなアプリケーション開発のために Heroku を評価中です。

上記のツールはこの新しいアーキテクチャとどのように連携するのでしょうか? 変更に備えて何をすればよいでしょうか? チームがヘッドレスコマースによって Cloud Kicks を未来へ推し進める方法を学ぶときには、このような質問について考えることが必要です。

役割を定義する

検討する必要があるもう一つの変化は専門化です。ストアフロントの開発と設計は 2 つの異なる仕事であることを認識する必要があります。1 人が両方を行うことはめったにありません。ヘッドレスコマースでは、クリエイティブチームはエンゲージメントとコンバージョンを高めるためにショッピング体験を最適化することに集中できます。一方、開発者はプロセスの速度と充実度やデータの多様性を高めるためにバックエンドの強化を優先できます。

まとめ

確実に言えることは、ヘッドレスが浸透してきているということです。Vijay の業界の多くの企業が今後、ヘッドレスコマースを評価し、各自のヘッドレスコマースアプリケーションを作成することが予想されます。

この単元では、ヘッドレスコマースに移行する理由について詳しく学習しました。また、考えられる用途、実装ツール、役割の違いについて確認しました。

では、最後のテストを受けて、バッジを獲得してください。

リソース

Salesforce ヘルプで Trailhead のフィードバックを共有してください。

Trailhead についての感想をお聞かせください。[Salesforce ヘルプ] サイトから新しいフィードバックフォームにいつでもアクセスできるようになりました。

詳細はこちら フィードバックの共有に進む