The Power of HTML Email Templates with Amazon SES

Overview

In today’s fast-paced software development landscape, continuous integration and delivery (CI/CD) pipelines are indispensable for automating the build, test, and deployment processes. AWS CodeBuild is an Amazon Web Services (AWS) managed service that facilitates efficient code building, testing, and packaging. On the other hand, Amazon Simple Email Service (SES) provides a reliable platform for sending transactional and marketing emails.

Pioneers in Cloud Consulting & Migration Services

Reduced infrastructural costs
Accelerated application deployment

Get Started

AWS CodeBuild and Amazon SES

AWS CodeBuild simplifies the process of building and testing code across various programming languages and environments. It seamlessly integrates with other AWS services and allows for customization through build spec files. Meanwhile, Amazon SES offers a scalable and cost-effective solution for sending emails, ensuring high deliverability rates and compliance with email regulations.

Prerequisites for Email Notifications

Several prerequisites must be addressed before implementing custom email notifications in AWS CodeBuild using Amazon SES. Firstly, the AWS IAM role assigned to AWS CodeBuild must have the necessary permissions to interact with Amazon SES, including permissions to send emails (ses:SendEmail) and send raw emails (ses:SendRawEmail). Additionally, the sender and recipient email addresses must be verified if SES is in sandbox mode. However, in production mode, only the sender’s email address must be verified.

To ensure proper configuration, developers should create an AWS IAM policy granting the required permissions and verify email addresses as per Amazon SES requirements.

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Effect": "Allow",
      "Action": [
        "ses:SendEmail",
        "ses:SendRawEmail"
      ],
      "Resource": "*"
    }
  ]
}

{

"Version": "2012-10-17",

"Statement": [

{

"Effect": "Allow",

"Action": [

"ses:SendEmail",

"ses:SendRawEmail"

"Resource": "*"

}

]

}

Integration with BuildSpec File

The provided BuildSpec file showcases how to integrate Amazon SES CLI commands to send custom email notifications at different stages of the AWS CodeBuild process. In this enhanced version, we’ll incorporate HTML email templates stored in an Amazon S3 bucket.

version: 0.2

env:
  secrets-manager:
    SECRET_VALUE: $SONARQUBE_CRED_ARN
    SECRET_VALUE_1: $PRISMA_CLOUD_CRED_ARN 
phases:
  install:
    runtime-versions:
      java: corretto17
  pre_build:
    commands:
      - echo Logging in to Amazon ECR.....
      - aws ecr get-login-password --region ap-south-1 | docker login --username AWS --password-stdin <ACCOUNT_ID>.dkr.ecr.ap-south-1.amazonaws.com
      - REPOSITORY_URI=<ACCOUNT_ID>.dkr.ecr.ap-south-1.amazonaws.com/<ECR_REPO_NAME>
      - aws s3 cp s3://storage-bucket/ses_mail_template.html .
      - ENVIRONMENT=DEVELOPMENT
      - PIPELINE_NAME=dev-SERVICE_NAME-Pipeline
  build:
    commands:
        - mvn clean install -U -s settings.xml verify sonar:sonar -Dsonar.projectKey=SERVICE_NAME -Dsonar.projectName=SERVICE_NAME -Dsonar.host.url=https://test-sonarqube.com -Dsonar.login=<SONARQUBE_TOKEN?
        - sleep 6
        - curl -u "SONARQUBE_USERNAME":"SONARQUBE_PASSWORD" https://test-sonarqube.com/api/qualitygates/project_status?projectKey=SERVICE_NAME >result.json
        - |
          if [ "$(jq -r '.projectStatus.status' result.json)" = "ERROR" ]; then
            echo "Both project status and build status indicate errors."
            DATE=$(TZ=IST-5:30 date)
            Failed_Reason=Sonarqube-Scan
            sed -i "s,Pipeline_Name,${PIPELINE_NAME},g; s,DATE,${DATE},g; s,Environment_Name,${ENVIRONMENT},g; s,Report_Link,${SONAR_REPORT_LINK},g; s,Failed_Reason,${Failed_Reason},g" ses_mail_template.html
            HTML_BODY=$(<ses_mail_template.html)
            aws ses send-email --from "devops-notification.in" --destination "ToAddresses=notification-cicd.com" --source-arn "<source_arn>" --message "Subject={Data='dev-$SERVICE_NAME-Pipeline has FAILED',Charset=utf8},Body={Html={Data='$HTML_BODY',Charset=utf8}}"
            exit 1
          else
            echo "Build passed the Sonarqube scan"
          fi
        - echo Build started on `date`
        - echo building the Jar file
        - echo Building the Docker image........!!!
        - docker build -t REPOSITORY_URI:IMAGE_TAG .
  post_build:
    commands:     
      - echo Pushing the Docker images...
      - docker push REPOSITORY_URI:IMAGE_TAG

version: 0.2

env:

secrets-manager:

SECRET_VALUE: $SONARQUBE_CRED_ARN

SECRET_VALUE_1: $PRISMA_CLOUD_CRED_ARN

phases:

install:

runtime-versions:

java: corretto17

pre_build:

commands:

- echo Logging in to Amazon ECR.....

- aws ecr get-login-password --region ap-south-1 | docker login --username AWS --password-stdin <ACCOUNT_ID>.dkr.ecr.ap-south-1.amazonaws.com

- REPOSITORY_URI=<ACCOUNT_ID>.dkr.ecr.ap-south-1.amazonaws.com/<ECR_REPO_NAME>

- aws s3 cp s3://storage-bucket/ses_mail_template.html .

- ENVIRONMENT=DEVELOPMENT

- PIPELINE_NAME=dev-SERVICE_NAME-Pipeline

build:

commands:

- mvn clean install -U -s settings.xml verify sonar:sonar -Dsonar.projectKey=SERVICE_NAME -Dsonar.projectName=SERVICE_NAME -Dsonar.host.url=https://test-sonarqube.com -Dsonar.login=<SONARQUBE_TOKEN?

- sleep 6

- curl -u "SONARQUBE_USERNAME":"SONARQUBE_PASSWORD" https://test-sonarqube.com/api/qualitygates/project_status?projectKey=SERVICE_NAME >result.json

- |

if [ "$(jq -r '.projectStatus.status' result.json)" = "ERROR" ]; then

echo "Both project status and build status indicate errors."

DATE=$(TZ=IST-5:30 date)

Failed_Reason=Sonarqube-Scan

sed -i "s,Pipeline_Name,${PIPELINE_NAME},g; s,DATE,${DATE},g; s,Environment_Name,${ENVIRONMENT},g; s,Report_Link,${SONAR_REPORT_LINK},g; s,Failed_Reason,${Failed_Reason},g" ses_mail_template.html

HTML_BODY=$(<ses_mail_template.html)

aws ses send-email --from "devops-notification.in" --destination "ToAddresses=notification-cicd.com" --source-arn "<source_arn>" --message "Subject={Data='dev-$SERVICE_NAME-Pipeline has FAILED',Charset=utf8},Body={Html={Data='$HTML_BODY',Charset=utf8}}"

exit 1

else

echo "Build passed the Sonarqube scan"

- echo Build started on `date`

- echo building the Jar file

- echo Building the Docker image........!!!

- docker build -t REPOSITORY_URI:IMAGE_TAG .

post_build:

commands:

- echo Pushing the Docker images...

- docker push REPOSITORY_URI:IMAGE_TAG

In the pre_build phase, we download the HTML email template from the Amazon S3 bucket and make the necessary substitutions for the dynamic content. Then, during the build phase, the customized HTML email template sends the notification via Amazon SES if a build failure occurs.

Explanation of Amazon SES Command: The aws ses send-email command allows developers to programmatically send emails through Amazon SES. Here’s a detailed explanation of its components:

–from: Specifies the sender’s email address.
–destination: Specifies the recipient’s email address.
–message: Specifies the email subject and body. This includes specifying the subject with Subject={Data=’SubjectText’,Charset=utf8} and the body with Body={Text={Data=’BodyText’,Charset=utf8}}.

HTML Email Template

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pipeline Failure Alert</title>
<style>
  /* Reset styles */
  body, h1, p {
    margin: 0;
    padding: 0;
  }
 
  /* Email container */
  .email-container {
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    border: 1px solid #ddd;
    border-radius: 10px;
  }
 
  /* Header styles */
  .header {
    background-color: #f39c12; /* Light orange */
    color: #fff;
    padding: 20px;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: relative;
  }
 
  /* Logo */
  .logo {
    position: absolute;
    top: 10px;
    left: 10px;
  }
 
  /* Content container */
  .content {
    background-color: #fff;
    padding: 20px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
  }
 
  /* Alert styles */
  .alert {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 5px;
    font-size: 18px;
    line-height: 1.5;
    background-color: #f8d7da; /* Light red */
    color: #721c24; /* Dark red */
    margin-top: 60px; /* Adjusted margin */
  }
 
  /* Details styles */
  .details {
    margin-top: 20px;
  }
 
  .details ul {
    list-style: none;
    padding: 0;
  }
 
  .details ul li {
    margin-bottom: 10px;
    color: #000; /* Black */
    text-indent: 20px;
  }
 
  .details ul li strong {
    display: inline-block;
    width: 150px;
    font-weight: bold;
  }
 
  /* Footer styles */
  .footer {
    text-align: center;
    margin-top: 20px;
    color: #777;
    font-size: 14px;
  }
</style>
</head>
<body>
<div class="email-container">
<div class="header">
<h1>Pipeline Failure Alert</h1>
<div class="logo">
<img src="https://cdn-labgd.nitrocdn.com/DgsEbCQFApREClXUXMwcDAPWJfHtBIby/assets/images/optimized/rev-f00fe12/www.cloudthat.com/wp-content/themes/masterstudy-child/newfiles/images/white-logo.png" alt="IOCL Logo" width="100">
</div>
</div>
<div class="content">
<div class="alert">
<strong>Failure!</strong> Your Pipeline_Name has failed Failed_Reason. Please check logs for more information.
</div>
<div class="details">
<ul>
<li><strong>Pipeline Name:</strong> <span style="color: black;">Pipeline_Name</span></li>
<li><strong>Failed Time:</strong> <span style="color: black;">DATE</span></li>
<li><strong>Environment:</strong> <span style="color: black;">Environment_Name</span></li>
<li><strong>Report Link:</strong> <a href="Report_Link" style="color: black;">View Report</a></li>
</ul>
</div>
</div>
<div class="footer">
<p>This is an automated notification. Please do not reply to this email.</p>
</div>
</div>
</body>
</html>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

<!DOCTYPE html>

<head>

<title>Pipeline Failure Alert</title>

<style>

/* Reset styles */

body, h1, p {

margin: 0;

padding: 0;

}

/* Email container */

.email-container {

max-width: 600px;

margin: 0 auto;

padding: 20px;

font-family: Arial, sans-serif;

background-color: #f4f4f4;

border: 1px solid #ddd;

border-radius: 10px;

}

/* Header styles */

.header {

background-color: #f39c12; /* Light orange */

color: #fff;

padding: 20px;

text-align: center;

border-top-left-radius: 10px;

border-top-right-radius: 10px;

position: relative;

}

/* Logo */

.logo {

position: absolute;

top: 10px;

left: 10px;

}

/* Content container */

.content {

background-color: #fff;

padding: 20px;

border-bottom-left-radius: 10px;

border-bottom-right-radius: 10px;

}

/* Alert styles */

.alert {

padding: 15px;

margin-bottom: 20px;

border-radius: 5px;

font-size: 18px;

line-height: 1.5;

background-color: #f8d7da; /* Light red */

color: #721c24; /* Dark red */

margin-top: 60px; /* Adjusted margin */

}

/* Details styles */

.details {

margin-top: 20px;

}

.details ul {

list-style: none;

padding: 0;

}

.details ul li {

margin-bottom: 10px;

color: #000; /* Black */

text-indent: 20px;

}

.details ul li strong {

display: inline-block;

width: 150px;

font-weight: bold;

}

/* Footer styles */

.footer {

text-align: center;

margin-top: 20px;

color: #777;

font-size: 14px;

}

</style>

</head>

<body>

<h1>Pipeline Failure Alert</h1>

</div>

<strong>Failure!</strong> Your Pipeline_Name has failed Failed_Reason. Please check logs for more information.

</div>

<ul>

<li><strong>Pipeline Name:</strong> <span style="color: black;">Pipeline_Name</span></li>

<li><strong>Failed Time:</strong> <span style="color: black;">DATE</span></li>

<li><strong>Environment:</strong> <span style="color: black;">Environment_Name</span></li>

<li><strong>Report Link:</strong> <a href="Report_Link" style="color: black;">View Report</a></li>

</ul>

</div>

<p>This is an automated notification. Please do not reply to this email.</p>

</div>

</body>

</html>

Conclusion

By leveraging HTML email templates in Amazon SES for custom email notifications in AWS CodeBuild, developers can enhance the visual appeal and informational content of their notifications. This improves communication and clarity within CI/CD pipelines, enabling stakeholders to stay informed about build successes, failures, and other critical events. With proper configuration and integration, teams can ensure timely responses to build events, fostering collaboration and efficiency in software development workflows.

Drop a query if you have any questions regarding Amazon SES and we will get back to you quickly.

Making IT Networks Enterprise-ready – Cloud Management Services

Accelerated cloud migration
End-to-end view of the cloud environment

Get Started

About CloudThat

CloudThat is a leading provider of Cloud Training and Consulting services with a global presence in India, the USA, Asia, Europe, and Africa. Specializing in AWS, Microsoft Azure, GCP, VMware, Databricks, and more, the company serves mid-market and enterprise clients, offering comprehensive expertise in Cloud Migration, Data Platforms, DevOps, IoT, AI/ML, and more.

FAQs

1. Why should I use Amazon SES for email notifications in AWS CodeBuild?

ANS: – Amazon SES provides a reliable and scalable email infrastructure, ensuring important notifications reach stakeholders promptly and reliably.

2. What are the key benefits of using custom HTML email notifications in AWS CodeBuild?

ANS: – Custom HTML email notifications allow for more visually appealing and informative communication. They enable teams to convey relevant information about building successes, failures, and other critical events, enhancing visibility and facilitating timely responses.

WRITTEN BY Deepak S

Deepak S works as a Research Intern at CloudThat. His expertise lies in AWS's services. Deepak is good at haunting new technologies and automobile enthusiasts.