SlideShare a Scribd company logo
Building an AWS native
serverless website
RUNCY OOMMEN | 12-Oct-2019
@runcyoommen
https://runcy.me
1.Serverless – Introduction, understanding & advantages
2.Route 53 - Purchase a domain
3.DynamoDB – Setup tables/attributes/items
4.IAM - Required roles
5.Lambda - Make functions
6.API Gateway - Appropriate triggers
7.S3 - Host the static web files
8.ACM - Generate appropriate certificate
9.CloudFront - Create a global distribution
10.Route 53 - DNS redirection
Today’s Agenda
Building AWS native serverless website
“Serverless computing is a cloud
computing execution model in which the
cloud provider runs the server, and
dynamically manages the allocation of
machine resources.”
Reference:
https://en.wikipedia.org/wiki/Cloud_computing_security
Building AWS native serverless website
How did we get here?
Building AWS native serverless website
Building AWS native serverless website
A few good resources…
• AWS Info page on serverless
https://aws.amazon.com/serverless/
• Serverless Architectures
https://martinfowler.com/articles/serverless.html
• Lambda + Serverless
https://www.youtube.com/watch?v=71cd5XerKss
What are we
building today?
Building AWS native serverless website
Building AWS native serverless website
Pre-requisites to begin
• AWS free-tier account
• Get the source code
https://github.com/roommen/runcystees
• Basic knowledge of Python, HTML, JS, CSS
• A good IDE like Visual Studio Code
1. Purchase a domain
• Login to AWS console
• Select ‘Route 53’ from the services list
• Click ‘Domain registration’ to get
started and then on ‘Register Domain’
• Search for domain availability
• Fill in the contact details and verify the email address
• Domain purchase request pending (max of 48 hrs)
• Successful domain registration
2. Fire up the DB
• Select ‘DynamoDB’ from the services list
(under Database section)
• Click ‘Create table’ to get started
Provide appropriate table name, primary key.
Leave the rest as default settings.
• Start adding the items by clicking
on ‘Create item’
• Really simple DB schema consisting of
id (Primary key) and desc of the tees
3. Setup IAM role
• Select ‘IAM’ from the services list
(under Security, Identity & Compliance)
• Navigate to ‘Roles’ to create a new role
• Select Lambda as the service that will use this role
• Click Next to attach the permissions
• Attach the below given pre-defined policies
• Add appropriate tags (optional but good practice)
Provide an appropriate name and create the role
4. Let’s make Lambda
• Select ‘Lambda’ from the services list
(under Compute)
• Provide name, runtime and choose the role
In this web app example, we have:
✓ Show Tee Description – handled by ShowTeeDesc.py
For Python to be enabled as Lambda function, we need
to zip all source code and dependencies (if any)
We have boto3 as the only external dependency which
need not be packaged as it’s already part of the default
Python runtime for AWS Lambda
• You should now have
showTeeDesc.zip created
• Verify the contents of the zip file and ensure
contents look identical to screenshot below
• Now in the Lambda screen, upload the zip file created earlier and
change the Handler info to showTeeDesc.lambda_handler
• The format of Handler should be <python_filename>.lambda_handler
• Provide appropriate description
and keep the memory and
timeout as is
• Click on ‘Save’ to create the Lambda function
• Created function will be displayed as below
5. Integration with API Gateway
• Select ‘API Gateway’ from the services
list (under Networking & Content Delivery)
• Click ‘Create API’
• Choose the protocol, name and other details
• Choose ‘Create Resource’ from the Actions menu.
• Make sure to ‘Enable API Gateway CORS’
Resource created - showteedesc
• Select the resource
and now click
‘Create Method’
• Choose ‘POST’
Configure POST method - showteedesc
• Select appropriate region and the function that
we had created earlier for integration
• Select a method and click
“Enable CORS”
• On the next screen, leave everything as is and click
“Enable CORS and replace existing headers”
• Select “Deploy API” from ‘Actions’
Choose [New Stage] and provide
appropriate values
• After deployment, the APIs would be available under stage
• Click on POST method created for /showteedesc and
see the API endpoint
Bringing it all together…
index.html runcystees.js
showTeeDesc.py
SERVERLESS
TRINITY
• Enable the APIs – Edit the JS function
• Integrate the APIs with the relevant functions
defined in runcystees.js to have them invoked
6. Host web files on S3
• Select ‘S3’ from the services list
(under Storage)
• Click ‘Create bucket’
• Provide appropriate ‘Bucket
name’ and ‘Region’
• Click ‘Create’
• Select the bucket that you created earlier
• From the “Properties” tab select ‘Static
website hosting’
• Provide appropriate
‘Index document’ and
hit Save
• You will now see an
‘Endpoint’ available
which will serve you
the website content
• Click on the
‘Permissions’ tab
• Select ‘Bucket
Policy’
• Enter the above policy to make it world readable
7. Generate certificate
• Select ‘Certificate Manager’ from the
services (under Security, Identity & Compliance)
• Click ‘Request a certificate’
• Select ‘Request a public certificate’
• Choose region as N. Virginia
Enter domain name
for generating the
certificate
Select DNS
validation
• Choose ‘Create record in Route 53’ to make
the appropriate DNS entry for certificates
• An entry would be created under Route 53
• Certificate status would be shown as Issued (~30 mins)
8. Make CloudFront distribution
• Select ‘CloudFront’ from the services
(under Networking & Content Delivery)
• Click ‘Create Distribution’
• Select ‘Web’ as the delivery
method for content
• Provide ‘Origin Domain Name’ as the S3 bucket
• Set protocol policy as
‘Redirect HTTP to
HTTPS’
• Provide
appropriate
CNAME entries
• Select the
certificate created
earlier from the
custom list
• Click on ‘Create Distribution’
• Wait for the distribution to be created (~30 mins)
• Set the default root object as the first html page
• Select ‘Route 53’ from the services list
(under Networking & Content Delivery)
9. DNS redirection
• Select the Hosted Zone displayed for
your domain
• Click on the ‘Create Record Set’ button
• Create a record set of type
A as alias
• Provide CloudFront
domain name as the alias
hosted target
• The site is now available
https://runcystees.com
• Your website is ** NOW LIVE **
@runcyoommen
https://runcy.me

More Related Content

PPTX
Serverless solution architecture in AWS
PPTX
Marshall Magee - Build a dynamic website for less than $1.55/month using S3 a...
PDF
How to set up world-class web hosting
 
PDF
AWS Community Day Bangkok 2019 - Build a Serverless Web Application in 30 mins
PPTX
Designing A Time bound resource download URL
PPTX
Aws object storage and cdn(s3, glacier and cloud front) part 3
PPTX
Mastering the Cloud with AWS: A Deep Dive into Amazon Web Services
PDF
Build an app on aws for your first 10 million users (2)
Serverless solution architecture in AWS
Marshall Magee - Build a dynamic website for less than $1.55/month using S3 a...
How to set up world-class web hosting
 
AWS Community Day Bangkok 2019 - Build a Serverless Web Application in 30 mins
Designing A Time bound resource download URL
Aws object storage and cdn(s3, glacier and cloud front) part 3
Mastering the Cloud with AWS: A Deep Dive into Amazon Web Services
Build an app on aws for your first 10 million users (2)

Similar to Building AWS native serverless website (20)

PDF
Serverless Framework Workshop - Tyler Hendrickson, Chicago/burbs
PPTX
Aws object storage and cdn(s3, glacier and cloud front) part 2
PDF
AWS Meetup Paris - Short URL project by Pernod Ricard
PDF
Your Second multi-tier Serverless Architecture on AWS
PPTX
AWS 101 - Amazon Web Services
PDF
Getting started with AWS
PPTX
SESSION8_AWS how to deploy the resources and services
PPTX
Aws overview part 3(databases, dns and management services)
PPTX
Modernizing DevOps
PDF
Overview of AWS Building Blocks
PPTX
Amazon Web Services (AWS) that enables developers to build applications with ...
PDF
Websites go Serverless - AWS Summit Berlin
PDF
Introduction to AWS
PDF
StripeCon 2019 talk - Serverless and Silverstripe
PPT
Hosting a Rails App
PPTX
How to Build High Performance : WordPress
PDF
2016-06 - Design your api management strategy - AWS - Microservices on AWS
PDF
Infinite Scaling using Lambda and Aws - Atlogys Tech Talk
PDF
Deploying Deep Learning Algorithm On AWS Cloud Platform.pdf
PDF
OpenCms Days 2012 - The Dispatch - Running OpenCms 8 on Amazon cloud services
Serverless Framework Workshop - Tyler Hendrickson, Chicago/burbs
Aws object storage and cdn(s3, glacier and cloud front) part 2
AWS Meetup Paris - Short URL project by Pernod Ricard
Your Second multi-tier Serverless Architecture on AWS
AWS 101 - Amazon Web Services
Getting started with AWS
SESSION8_AWS how to deploy the resources and services
Aws overview part 3(databases, dns and management services)
Modernizing DevOps
Overview of AWS Building Blocks
Amazon Web Services (AWS) that enables developers to build applications with ...
Websites go Serverless - AWS Summit Berlin
Introduction to AWS
StripeCon 2019 talk - Serverless and Silverstripe
Hosting a Rails App
How to Build High Performance : WordPress
2016-06 - Design your api management strategy - AWS - Microservices on AWS
Infinite Scaling using Lambda and Aws - Atlogys Tech Talk
Deploying Deep Learning Algorithm On AWS Cloud Platform.pdf
OpenCms Days 2012 - The Dispatch - Running OpenCms 8 on Amazon cloud services
Ad

More from Runcy Oommen (20)

PPTX
Security hardening enhancements for Kubernetes
PPTX
Security posture improvements for Google Cloud Platform
PPTX
Security enhancements for popular GCP services
PPTX
Designing A Platform Agnostic HA System
PPTX
Security for cloud native workloads
PPTX
Europe Cloud Summit - Security hardening of public cloud services
PPTX
Cloud & GCP 101
PDF
Serverless security for multi cloud workloads
PDF
Security hardening of core AWS services
PPTX
Get to know Git
PPTX
GCDC Bengaluru - Community Growth Hacking
PDF
Earth Engine on Google Cloud Platform (GCP)
PPTX
Get your Git on GitHub
PPTX
Run C++ as serverless with GCP Cloud Functions
PPTX
Effective Tech Community Engagement - Best Practices
PPTX
Rajasthan IT Day Hackathon Finals
PPTX
Arvind Brands - Hackathon - Solution Idea
PPTX
Intro to Virtualization - 10000 feet view
PPTX
Docker Introductory workshop
PPTX
Accenture Hack Forward - Finals
Security hardening enhancements for Kubernetes
Security posture improvements for Google Cloud Platform
Security enhancements for popular GCP services
Designing A Platform Agnostic HA System
Security for cloud native workloads
Europe Cloud Summit - Security hardening of public cloud services
Cloud & GCP 101
Serverless security for multi cloud workloads
Security hardening of core AWS services
Get to know Git
GCDC Bengaluru - Community Growth Hacking
Earth Engine on Google Cloud Platform (GCP)
Get your Git on GitHub
Run C++ as serverless with GCP Cloud Functions
Effective Tech Community Engagement - Best Practices
Rajasthan IT Day Hackathon Finals
Arvind Brands - Hackathon - Solution Idea
Intro to Virtualization - 10000 feet view
Docker Introductory workshop
Accenture Hack Forward - Finals
Ad

Recently uploaded (20)

PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
PPTX
Big Data Technologies - Introduction.pptx
PDF
Dropbox Q2 2025 Financial Results & Investor Presentation
PDF
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
PPTX
A Presentation on Artificial Intelligence
PPTX
Cloud computing and distributed systems.
PDF
Machine learning based COVID-19 study performance prediction
PPTX
sap open course for s4hana steps from ECC to s4
PDF
Encapsulation theory and applications.pdf
PPTX
ACSFv1EN-58255 AWS Academy Cloud Security Foundations.pptx
PDF
Profit Center Accounting in SAP S/4HANA, S4F28 Col11
PPT
Teaching material agriculture food technology
PDF
Encapsulation_ Review paper, used for researhc scholars
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PPTX
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
PDF
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
PDF
The Rise and Fall of 3GPP – Time for a Sabbatical?
PPT
“AI and Expert System Decision Support & Business Intelligence Systems”
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
Big Data Technologies - Introduction.pptx
Dropbox Q2 2025 Financial Results & Investor Presentation
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
A Presentation on Artificial Intelligence
Cloud computing and distributed systems.
Machine learning based COVID-19 study performance prediction
sap open course for s4hana steps from ECC to s4
Encapsulation theory and applications.pdf
ACSFv1EN-58255 AWS Academy Cloud Security Foundations.pptx
Profit Center Accounting in SAP S/4HANA, S4F28 Col11
Teaching material agriculture food technology
Encapsulation_ Review paper, used for researhc scholars
Digital-Transformation-Roadmap-for-Companies.pptx
MIND Revenue Release Quarter 2 2025 Press Release
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
The Rise and Fall of 3GPP – Time for a Sabbatical?
“AI and Expert System Decision Support & Business Intelligence Systems”

Building AWS native serverless website

  • 1. Building an AWS native serverless website RUNCY OOMMEN | 12-Oct-2019 @runcyoommen https://runcy.me
  • 2. 1.Serverless – Introduction, understanding & advantages 2.Route 53 - Purchase a domain 3.DynamoDB – Setup tables/attributes/items 4.IAM - Required roles 5.Lambda - Make functions 6.API Gateway - Appropriate triggers 7.S3 - Host the static web files 8.ACM - Generate appropriate certificate 9.CloudFront - Create a global distribution 10.Route 53 - DNS redirection Today’s Agenda
  • 4. “Serverless computing is a cloud computing execution model in which the cloud provider runs the server, and dynamically manages the allocation of machine resources.” Reference: https://en.wikipedia.org/wiki/Cloud_computing_security
  • 6. How did we get here?
  • 9. A few good resources… • AWS Info page on serverless https://aws.amazon.com/serverless/ • Serverless Architectures https://martinfowler.com/articles/serverless.html • Lambda + Serverless https://www.youtube.com/watch?v=71cd5XerKss
  • 13. Pre-requisites to begin • AWS free-tier account • Get the source code https://github.com/roommen/runcystees • Basic knowledge of Python, HTML, JS, CSS • A good IDE like Visual Studio Code
  • 14. 1. Purchase a domain • Login to AWS console • Select ‘Route 53’ from the services list • Click ‘Domain registration’ to get started and then on ‘Register Domain’
  • 15. • Search for domain availability • Fill in the contact details and verify the email address
  • 16. • Domain purchase request pending (max of 48 hrs) • Successful domain registration
  • 17. 2. Fire up the DB • Select ‘DynamoDB’ from the services list (under Database section) • Click ‘Create table’ to get started
  • 18. Provide appropriate table name, primary key. Leave the rest as default settings.
  • 19. • Start adding the items by clicking on ‘Create item’ • Really simple DB schema consisting of id (Primary key) and desc of the tees
  • 20. 3. Setup IAM role • Select ‘IAM’ from the services list (under Security, Identity & Compliance) • Navigate to ‘Roles’ to create a new role • Select Lambda as the service that will use this role • Click Next to attach the permissions
  • 21. • Attach the below given pre-defined policies • Add appropriate tags (optional but good practice)
  • 22. Provide an appropriate name and create the role
  • 23. 4. Let’s make Lambda • Select ‘Lambda’ from the services list (under Compute) • Provide name, runtime and choose the role
  • 24. In this web app example, we have: ✓ Show Tee Description – handled by ShowTeeDesc.py For Python to be enabled as Lambda function, we need to zip all source code and dependencies (if any)
  • 25. We have boto3 as the only external dependency which need not be packaged as it’s already part of the default Python runtime for AWS Lambda • You should now have showTeeDesc.zip created • Verify the contents of the zip file and ensure contents look identical to screenshot below
  • 26. • Now in the Lambda screen, upload the zip file created earlier and change the Handler info to showTeeDesc.lambda_handler • The format of Handler should be <python_filename>.lambda_handler
  • 27. • Provide appropriate description and keep the memory and timeout as is • Click on ‘Save’ to create the Lambda function • Created function will be displayed as below
  • 28. 5. Integration with API Gateway • Select ‘API Gateway’ from the services list (under Networking & Content Delivery) • Click ‘Create API’ • Choose the protocol, name and other details
  • 29. • Choose ‘Create Resource’ from the Actions menu. • Make sure to ‘Enable API Gateway CORS’
  • 30. Resource created - showteedesc • Select the resource and now click ‘Create Method’ • Choose ‘POST’
  • 31. Configure POST method - showteedesc • Select appropriate region and the function that we had created earlier for integration
  • 32. • Select a method and click “Enable CORS” • On the next screen, leave everything as is and click “Enable CORS and replace existing headers”
  • 33. • Select “Deploy API” from ‘Actions’ Choose [New Stage] and provide appropriate values
  • 34. • After deployment, the APIs would be available under stage • Click on POST method created for /showteedesc and see the API endpoint
  • 35. Bringing it all together… index.html runcystees.js showTeeDesc.py SERVERLESS TRINITY
  • 36. • Enable the APIs – Edit the JS function • Integrate the APIs with the relevant functions defined in runcystees.js to have them invoked
  • 37. 6. Host web files on S3 • Select ‘S3’ from the services list (under Storage) • Click ‘Create bucket’ • Provide appropriate ‘Bucket name’ and ‘Region’ • Click ‘Create’
  • 38. • Select the bucket that you created earlier • From the “Properties” tab select ‘Static website hosting’
  • 39. • Provide appropriate ‘Index document’ and hit Save • You will now see an ‘Endpoint’ available which will serve you the website content
  • 40. • Click on the ‘Permissions’ tab • Select ‘Bucket Policy’ • Enter the above policy to make it world readable
  • 41. 7. Generate certificate • Select ‘Certificate Manager’ from the services (under Security, Identity & Compliance) • Click ‘Request a certificate’ • Select ‘Request a public certificate’ • Choose region as N. Virginia
  • 42. Enter domain name for generating the certificate Select DNS validation
  • 43. • Choose ‘Create record in Route 53’ to make the appropriate DNS entry for certificates • An entry would be created under Route 53 • Certificate status would be shown as Issued (~30 mins)
  • 44. 8. Make CloudFront distribution • Select ‘CloudFront’ from the services (under Networking & Content Delivery) • Click ‘Create Distribution’ • Select ‘Web’ as the delivery method for content
  • 45. • Provide ‘Origin Domain Name’ as the S3 bucket • Set protocol policy as ‘Redirect HTTP to HTTPS’
  • 46. • Provide appropriate CNAME entries • Select the certificate created earlier from the custom list
  • 47. • Click on ‘Create Distribution’ • Wait for the distribution to be created (~30 mins) • Set the default root object as the first html page
  • 48. • Select ‘Route 53’ from the services list (under Networking & Content Delivery) 9. DNS redirection • Select the Hosted Zone displayed for your domain • Click on the ‘Create Record Set’ button
  • 49. • Create a record set of type A as alias • Provide CloudFront domain name as the alias hosted target • The site is now available https://runcystees.com
  • 50. • Your website is ** NOW LIVE ** @runcyoommen https://runcy.me