In this tutorial, you will learn how to make a serverless static website with AWS Lambda functions. You can get 1 million free Lambda calls per month which as part of the AWS Always Free tier. This essentially equates to 1 million free page view per month.
Below are multiple examples of Lambda Python function calls that return HTML which are accessible at a public URL with HTTPS.
Note that if you find AWS Lambda hosting too complicated or too limiting, there are many other ways to host a free website.
1. Get Started with AWS Lambda
Go to https://aws.amazon.com/lambda/ and click the orange Get started with AWS Lambda button. Sign up for an AWS account if you don’t already have one.
2. Create a Very Simple Lambda Function
Click on the orange Create Function button in the upper right corner of the AWS Lambda dashboard.
Choose a function name and runtime. I picked home and Python 3.9 respectively.
On the next screen you will see a basic Lambda function that simply returns the text “Hello from Lambda!” with a 200 status code.
import json
def lambda_handler(event, context):
# TODO implement
return {
'statusCode': 200,
'body': json.dumps('Hello from Lambda!')
}
Let’s add a trigger so that we can exercise the function in a web browser.
Click on Add trigger. For the trigger configuration dropdown, select API Gateway. Create an API of type HTTP API with Open security. Keep all other fields the defaults.
On the next page, copy and paste the API endpoint URL into a web browser and you will see the “Hello from Lambda!” string displayed.
2. Lambda Function with HTML
Edit the lambda function with the following code to return HTML instead of JSON.
def lambda_handler(event, context):
body = '''
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Homepage</title>
</head>
<body>
<h1>Home</h1>
<p>Hi! My name is Tony. I like to teach people about websites.</p>
<img src="https://tonyteaches.tech/wp-content/uploads/2021/08/tony-teaches-tech-youtube-banner.jpg" width="500" />
<p>Like, comment, subscribe!</p>
<p>Check out my <a href="/blog">blog</a>.</p>
</body>
</html>'''
response = {
'statusCode': 200,
'headers': {"Content-Type": "text/html",},
'body': body
}
return response
Feel free to modify the HTML for your purposes.
Navigate to the same URL in a web browser and you will see the HTML displayed as expected.
3. Multiple Page Lambda Function Website
Create another Lambda function named blog. Replace the default lambda function with the following.
def lambda_handler(event, context):
body = '''
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Blog</title>
</head>
<body>
<h1>Blog</h1>
<p>This is my blog. I haven't written any posts yet.</p>
</body>
</html>'''
response = {
'statusCode': 200,
'headers': {"Content-Type": "text/html",},
'body': body
}
return response
Deploy the function and test that the link to the blog page works.
Feel free to create a Lambda function for as many pages as you’d like. For your convenience, the following is a detailed video walkthrough of the steps in this tutorial.
Next, check out some of the many other ways to host a free website.
2 Responses
There’s a typo in step 2.
The quotation marks are mismatched (single/double).
Check out my blog.
You might also want to mention the steps in creating an API Gateway trigger for this blog lambda function (Use existing API, select Step 1’s HTTP API, set deployment stage to Default and Security to Open). These steps are addressed in the video, but not the text of this page.
Hope that helps!
Sorry, “Check out my blog.” was meant to reference the bad line of code.
But it processed my comment as HTML and, oddly enough, didn’t mind the mismatched quotation marks when it did.
Here’s the snippet with the error:
‘/blog”