How to Deploy a Serverless Web App on AWS: Complete Guide
By Braincuber Team
Published on March 6, 2026
Managing physical servers or traditional virtual machines is no longer the standard for modern web applications. Scaling issues, continuous security patching, and paying for idle uptime are financial drains. This step by step beginner guide shows you how to bypass those headaches entirely by adopting a serverless architecture on Amazon Web Services (AWS). We will build a functional web-based calculator that leverages Amazon DynamoDB for persistent storage, AWS Lambda for on-demand execution logic, Amazon API Gateway for RESTful routing, and AWS Amplify to host the frontend. By the end of this tutorial, your application will scale automatically and you'll only pay for the exact milliseconds your code runs.
What You'll Learn:
- Setting up an Amazon DynamoDB table with a primary Partition Key for fast data retrievals.
- Writing a Python-based AWS Lambda function to act as serverless backend logic.
- Connecting your frontend and backend securely using Amazon API Gateway integrations.
- Deploying a complete static HTML/JS frontend manually using the AWS Amplify console.
Serverless Architecture Breakdown
Before diving into the AWS console, it is crucial to understand how these independent cloud services interact to form a cohesive, infinitely scalable application. Serverless doesn't mean "no servers" — it means you no longer manage them.
| AWS Service | Role in Application |
|---|---|
| DynamoDB | NoSQL database for persistently storing calculation results without schema maintenance. |
| AWS Lambda | Serverless compute engine executing Python business logic in isolated containers. |
| API Gateway | HTTP REST endpoint receiving frontend POST requests and routing to Lambda. |
| AWS Amplify | Global hosting and CDN distribution for static frontend assets (HTML/CSS/JS). |
Step by Step Guide to Deploying Your Web App
Set Up Amazon DynamoDB
Navigate to the DynamoDB Console and click Create table. Set the Table name to myTable and the Partition key to ID. The Partition Key acts as the primary identifier for each calculation record. Once the table is created, copy the Table ARN found under the Summary tab — this precise ARN will be required to grant Lambda secure access later.
Create Backend Logic with AWS Lambda
Open the Lambda Console and select Author from scratch. Name the function SumCalculatorFunction and choose Python 3.9 as the runtime environment. Within the Code source interface, replace the default lambda_function.py content with your Python syntax. This script parses incoming JSON payloads and executes DynamoDB put_item commands via the powerful Boto3 library.
Granting Database Permissions
By default, your newly deployed AWS Lambda function operates within entirely restrictive secure boundaries and cannot write to DynamoDB. You must navigate into your function's Execution Role within IAM policies and attach an inline policy granting dynamodb:PutItem privileges targeting your specific table's ARN. Failing to deploy this permission leads strictly to 500 Internal Server Execution Errors.
Connect the Frontend using API Gateway
Create a new REST API within the API Gateway Console named SumCalculatorAPI. Under the root resource path (/), configure a new POST method integrating with your Lambda function. Vitally, ensure you toggle Lambda Proxy integration. This streamlined setting automatically bundles headers, body fragments, and query parameters straight from the browser's HTTP request directly into your Python Lambda handler.
Deploy Your Application with AWS Amplify
Compile your client-facing code (index.html, app.js, and style.css) into a single unnested ZIP archive. Open the AWS Amplify interface and select Deploy without Git provider. Drag and drop your compiled zip file payload, assign the deployment environment as dev, and initiate the deployment sequence. Amplify seamlessly provisions cloud storage and orchestrates worldwide content delivery via Edge networks.
Core Principles of Serverless Applications
Trading traditional virtual machines for serverless architectures immediately transforms operational economics and engineering scalability. Consider these immense strategic advantages:
Zero Idle Costs
Unlike provisioning fixed EC2 instances processing requests endlessly, Lambda explicitly bills only for the computational micro-milliseconds your exact deployment executes. You never reimburse unused server wait time.
Infinite Scaling
API Gateway handling incoming requests and Lambda processing logic flawlessly scale entirely independently. If traffic surges wildly to 15,000 requests, backend parallelization rapidly initializes concurrent functions automatically.
NoSQL Freedom
DynamoDB furnishes lightning millisecond latency through efficient non-relational modeling strategies, bypassing standard database migration pipelines and relentless database maintenance windows completely.
Global Edge Delivery
Publishing static applications through AWS Amplify dynamically bridges frontend deliverables throughout robust CloudFront cache servers positioned densely across global Edge network hubs guaranteeing rapid access.
Sample DynamoDB Integration Payload
When API Gateway successfully proxies the frontend POST request, your backend Lambda logic processes the comprehensive event dictionary utilizing standard Boto3 libraries. You must handle CORS directly in the return.
import json
import boto3
from decimal import Decimal
dynamodb = boto3.resource('dynamodb')
table = dynamodb.Table('myTable')
def lambda_handler(event, context):
# Parse frontend request body
body = json.loads(event['body'])
result = Decimal(str(body['num1'])) + Decimal(str(body['num2']))
# Store record persistently in DynamoDB
table.put_item(
Item={
'ID': context.aws_request_id,
'result': result
}
)
# Return valid REST response requiring CORS header
return {
'statusCode': 200,
'headers': {
'Access-Control-Allow-Origin': '*'
},
'body': json.dumps({'sum': float(result)})
}
Frequently Asked Questions
Why am I getting a CORS error when my frontend calls API Gateway?
CORS (Cross-Origin Resource Sharing) must be decisively enabled natively through the API Gateway GUI dashboard. Furthermore, your Lambda proxy integration requires meticulously appending the Access-Control-Allow-Origin string embedded inside the return code dictionary headers.
What is the functional advantage of Lambda proxy integration?
It drastically accelerates environment configuration mapping. API Gateway indiscriminately relays HTTP connection context directly towards Python's internal event variables without requiring frustrating granular templates detailing specific schema keys.
How much does hosting an initial site upon AWS Amplify fundamentally cost?
Starting AWS accounts obtain generous Free Tier advantages spanning exactly 1,000 build minutes alongside 15 GB total global web payload deployment each month across the first comprehensive year. This effectively operates simple learning infrastructures for zero capital.
Why is my backend Lambda code exhibiting timeouts?
Amazon defines unconfigured Lambda executions with strict 3.0 second hardware timeouts initially to prevent catastrophic loops. Complicated API iterations or slower DynamoDB reads frequently require administratively expanding this parameter directly from the function's internal General Configuration tab.
Can I structure extensive directory folders inside my AWS Amplify zip file?
Drag-and-drop mechanism deployments absolutely dictate raw unnested frontend assets prioritizing an exact index.html anchor located identically at the root folder hierarchy directory level otherwise the automated provisioning process immediately fails searching for internal launch points.
Scale Your Cloud Architecture Effectively.
Constructing a straightforward serverless calculator application clearly illustrates simple cloud provisioning, yet successfully transforming legacy company enterprises requires tremendous expert insight dictating stable VPC networking, uncompromising IAM security guardrails, and rapid CI/CD deployment mechanics. Braincuber constructs incredibly solid serverless infrastructures guaranteed to immediately slash backend operating budgets reliably and scale exponentially alongside demand.