Serverless integration with SendGrid using Kumologica

When making an online purchase, customers expect to receive purchase receipt emails from the vendor they do business with. Any delays in receipt of email, or emails being delivered to the spam folder can lead to a poor customer experience and may impact your brand and potentially may impact revenue.

Few aspects for having a good purchase receipts are :

1. Proper branding and design of your purchase receipt.
2. Proper furnishing of purchase content.- Price, Shipping, order date etc.
3. Responsive nature of purchase receipt email.

SendGrid is a communication platform for transactional and marketing email delivery. It provides features for configuring email templates that can be used for the email delivery for different scenarios such as transaction emails, account creation emails, password reset emails, purchase receipt emails, account notification emails and more. In this article we see how to build a simple order management service that will furnish and send a purchase receipt email using SendGrid. The service will integrate with SendGrid using Kumologica SendGrid node.

Kumologica is a free low-code development tool to build serverless integrations. You can learn more about Kumologica in this medium article or subscribe to our YouTube channel for the latest videos.

Use case

We are going to implement a simple order management service for an online shopping portal. This service will accept the request from the shopping portal (UI) when the customer makes a purchase. The request will be first stored in an order management System database and then the price calculation is carried out by the service before sending the purchase receipt email to the customer.

Flow logic

Prerequisite

1. Kumologica designer installed in your machine. https://kumologica.com/download.html
2. Create a AWS DynamoDB table with the primary key as “orderid”.

Note: This is to simulate a order management system data store.

3. Create an account in SendGrid and configure a Dynamic Template.

4. Go to Email API and select Dynamic templates.

5. Click on “Create a Dynamic Template” and provide a template name.

6. Go to the “Code Editor” and provide your template. For this use case you may also pick up the template we have used.

Code editor in SendGrid UI

Implementation

Steps:

1. Open Kumologica Designer, click on Add more nodes option on the bottom left corner of the designer to install the SendGrid node. Once installation is completed restart the designer.

SendGrid node under Add More Nodes palette

2. Click the Home button and choose Create New Kumologica Project.

3. Enter name (for example OrderManagementFlow), select directory for project and switch Source into From Existing Flow …

4. Copy and Paste the following flow

5. press Create Button.

You should be seeing flow as given below on the designer canvas.

Order Management service implementation

Understanding the flow

1. POST /order is the EventListener node with event source as Amazon API gateway , verb as POST , path as /order. The flow expected the following payload structure as the request.

{
    "orderid": "30077AB",
    "orderdate": "January 09 2020",
    "item": "Laptop",
    "itemmodel": "black",
    "qty": 2,
    "address": "8 , River road, Penrith,NSW,2186",
    "email" : "abc@gmail.com"
}

2. Log_Entry logs the incoming payload in AWS CloudWatch.

3. StoreToVariable is to store the entire payload in a variable to use during receipt preparation.

4. OrderManagementSystem is the Amazon DynamoDB node to store the incoming order request.

5. ReceiptPreperation is the datamapper node which is used for implementing the price calculation logic as well as mapping the content for SendGrid node.

(
$orderdata := $flowContext("payload","vars");
$itemprice := 12;
$shipping := 4.25;
$tax := 0.25;
$subtotal := $orderdata.qty * 12;
$total := $subtotal + $shipping + $tax ;
{
  "orderid" : $orderdata.orderid,
  "item" : $orderdata.item,
  "itemmodel": $orderdata.itemmodel,
  "address" : $orderdata.address,
  "orderdate" : $orderdata.orderdate,
  "subtotal": $subtotal,
  "itemprice": 12,
  "shipping": 4.25,
  "tax": 0.25,
  "qty": $orderdata.qty,
  "total": $total
};)

In the above logic in data mapper itemprice , shipping fee, tax etc are hardcoded for demonstration purpose only. These values are fetched from different system in real world.

6. SendGrid node sends the prepared receipt content along with the recipient details to SendGrid platform.

Note: Ensure to have the API key for accessing the SendGrid platform

7. Success is the EventListener End node responding with 202 http response code and payload as

{"status" : "confirmed"}

Deployment

1. Select CLOUD tab on the right panel of Kumologica designer, select your AWS Profile.
2. Go to “Trigger” section under cloud tab and select the Amazon API Gateway.

API gateway trigger under cloud tab

3. Press Deploy button.

Try it

Invoke your API with the following url and payload.

Url: https://<<apigatewayid>>.execute-api.ap-southeast-2.amazonaws.com/test/order
Payload :
{
    "orderid": "30077AB",
    "orderdate": "January 09 2020",
    "item": "Laptop",
    "itemmodel": "black",
    "qty": 2,
    "address": "8 , River road, Penrith,NSW,2186",
    "email" : "abc@gmail.com"
}

You will be receiving the following purchase receipt content.

Purchase receipt email received by the customer

Conclusion

This article presented how easy Kumologica Designer flow integrates with SendGrid platform as part order management service to furnish and send a purchase receipt to the customer.

Remember Kumologica is totally free to download and use. Go ahead and give it a try, we would love to hear your feedback.