あなたのオープンソースのeコマースでsendgridを統合する方法

Medusa 良い開発者の経験を提供することを目的とするオープンソースヘッドホン商業プラットフォームです.それがうまくやっている1つの事は、他の人気のサービスと統合して、彼らのecommerce店でより多くの特徴で同様に開発者と商人を提供するために手間がかからないです.
SendGrid あなたの顧客のためのパーソナライズされたメールを作成することができますメール配信とマーケティングサービスです.sendgrid簡単に任意の技術的な知識なしで電子メールテンプレートをカスタマイズすることができます.
このチュートリアルでは、あなたがどのように電子メール通知システムを使用してMedusaのsendgridを統合する方法について説明しますready-made plugin .

統合機能

sendgridとmedusaを統合することにより、次の場合には、お客様とユーザーにメールを送信することができます.

順序関連イベントは、新しい注文、出荷された作成、およびキャンセルキャンセルが含まれます.

スワップとリターンは、順序および項目の新しい戻り要求を含む関連イベントを正常に返しました.

ギフトカードが注文されたとき.

ユーザーと管理者のユーザーのためのリセットパスワードを含むユーザー関連のイベント.

商品在庫が低いときのためのrestock通知.

このプラグインでは、あなたのSendGridアカウントでそれらを定義する場合、ローカライズされたテンプレートを使用して複数の言語に対応できます.

必要条件

メデューササーバ

メドゥーササーバがセットされていない場合は、次のことを確認してくださいQuickstart guide 数分で始める.

レッドシス

Medusaでは、イベントは非同期的にトリガされ、購読者はそれらを購読している場合、これらのイベントを処理します.これはRedis イベントキューとして使用されます.したがって、あなたが進む前にRedisがインストールされ、あなたのMedusaサーバに設定される必要があります.
あなたは次のことができますdevelopment environment setup guide この手順を実行します.

sendgridアカウント

最後に、Medusaと接続するsendgridアカウントが必要です.あなたが1を持っていないならば、確認してくださいcreate one ファースト.また、Aを設定する必要がありますsingle sender あなたのアカウントで.あなたがあなたのsendgridアカウントを通して電子メールを送ることができないならば.

sendgrid APIキーを取得する

sendgridプラグインはsendgridを介してメールを送信するメデューサへのアクセスを与えるためにAPIキーが必要です.
SendGridからAPIキーを取得するには、SendGridダッシュボード設定のAPIキーのサイドバーを選択します.
次に、「APIを作成」ボタンをクリックします.

SendGridのAPIキーはアクセスの3種類があります:フルアクセス、制限されたアクセス、および請求アクセス.このAPIキーによってメデューサがあなたに代わってメールを送ることができるようにするために、あなたは完全にアクセスを選択するか、少なくとも「メール送信」アクセスをそれに与えているアクセスを制限しなければなりません.

完了したら、作成＆表示をクリックします.これはAPIキーを作成し、一度だけ表示することができます.したがって、後で使用するためにそれをコピーしてください.

電子メールテンプレート

前述のように、sendgridプラグインは多くの場合顧客にメールを送ります.例えば、顧客が注文をするとき.これらのメールは、各イベントの必要なテンプレートIDを提供する場合のみ送信されます.
これらのメールがメドゥーサからsendgridに送信されると、メデューサはまた、メールで特定の情報を表示するために使用できる変数を渡します.たとえば、“注文された”メールの場合は、注文の合計を表示することができます電子メールの順序、および詳細な情報.
そこで、このプラグインを送信するメールの種類ごとに動的なテンプレートを作成する必要があります.動的テンプレートを使用すると、メデューサから送信された変数を表示することができますusing Handlebars .
あなたがこのプラグインで送ることができる電子メールのすべてのタイプをチェックすることに興味があるならば、ダイナミックなテンプレートがどんなデータを受け取るかについて、確認してくださいTemplate Reference in the Medusa documentation .

オーダーテンプレート

このチュートリアルでは、注文のメールのテンプレートを作成するだけです.
サイドバーからメールテンプレートを作成するには、電子メールAPIのダイナミックテンプレートに移動します.次に、「動的テンプレートを作成」をクリックします.

次に、あなたのテンプレートに名前を付けるように頼まれます.完了したら、Createをクリックします.新しいテンプレートは、ページのテンプレートのリストに追加されます.テンプレート名をクリックするとテンプレートIDが表示されます.

メールの内容を編集するには、「追加」をクリックします.その後、空白のテンプレートまたはsendgridテンプレートを選択することができます.このチュートリアルでは、空白のテンプレートを選択します.
その後、デザインエディターやコードエディターを選択するように求められます.デザインエディタを選択します.

これはドラッグ＆ドロップの電子メールエディタに表示されます.チュートリアルを簡単にするには、2つのことをメールに追加します.

客の名前

注文合計

これを行うには、[ビルド]タブをクリックし、メールモジュールにコードモジュールをドラッグします.これはコードエディターを開きます.
コードエディターに次を追加します.

<p>Hello, 
{{#if customer.first_name}}
    {{ customer.first_name }}
{{ else }}
    {{ shipping_address.first_name }}
{{/if}}
</p>
<p>Your order total: {{ total }}</p>

あなたはcustomer , shipping_address , and total メデューサから送られる変数.お客様がお客様としてご利用の場合は、お客様のファーストネームを設定しないことに注意してください.したがって、代わりに発送先住所に名前を表示します.
あなたは次の順序でテンプレートを送信するために送信される変数をチェックアウトすることができますTemplate Reference .
をクリックします.その後、上部にある[保存]ボタンをクリックします.
あなたは今、統合を行うために必要なすべてがあります.

sendgridプラグインのインストール

Medusaサーバのルートディレクトリで、以下のコマンドを実行してsendgridプラグインをインストールします.

npm i medusa-plugin-sendgrid

プラグインの設定

次に、APIキー、メールからの送信、テンプレートIDを追加する必要があります.env ファイル.作成するすべてのテンプレートのテンプレートIDを追加する必要があることに注意してください.

SENDGRID_API_KEY=<API_KEY>
SENDGRID_FROM=<YOUR_SEND_FROM>
SENDGRID_ORDER_PLACED_ID=<ORDER_PLACED_TEMPLATE_ID>

どこ<API_KEY> あなたのAPIキーです.<YOUR_SEND_FROM> sendgridで設定された単一の送信元メールアドレスと<ORDER_PLACED_TEMPLATE_ID> は以前に作成したテンプレートのIDです.
では、medusa-config.js Medusaサーバのルートにあるファイルを、plugins 配列

const plugins = [
  ...,
  {
    resolve: `medusa-plugin-sendgrid`,
    options: {
      api_key: process.env.SENDGRID_API_KEY,
      from: process.env.SENDGRID_FROM,
      order_placed_template: process.env.SENDGRID_ORDER_PLACED_ID,
    }
  }
];

そして、それはあなたがsendgridをmedusaと統合する必要があるすべてです.

統合テスト

統合をテストするには、順序を作成する必要があります.それを行う最も簡単な方法は、メデューサのNext.js or Gatsby スタータストリーフロント
それらのうちの1つをインストールした後、ディレクトリからmedusaサーバを起動します.

npm start

次に、あなたのメデューサの店頭を起動し、注文を作成します.

あなたが注文をした電子メールをチェックするならば、あなたは電子メールを受け取ります、そして、あなたはあなたの注文データに基づいて最初の名前と注文合計が取り替えられるのを見ます.

次は何

あなたがこのプラグインを使用するために応えることができるより多くのユースケースが、あります.確認してくださいTemplate Reference どのような種類のメールを送信することができます知っているとどのようなデータを保持します.
前述のように、このプラグインでローカライズされたメールを送信することもできます.チェックアウトSendGrid plugin documentation あなたがそれをすることができる方法の詳細については.

Should you have any issues or questions related to Medusa, then feel free to reach out to the Medusa team via Discord.