|
| 1 | +--- |
| 2 | +title: "Building a Serverless Quiz Application with LocalStack" |
| 3 | +description: Build an interactive serverless quiz application using AWS Lambda, DynamoDB, and API Gateway. Learn how to create, deploy, and test a complete serverless architecture locally with LocalStack, featuring quiz creation, submission handling, and scoring mechanisms. |
| 4 | +services: |
| 5 | +- lambda |
| 6 | +- ddb |
| 7 | +- agw |
| 8 | +- s3 |
| 9 | +platform: |
| 10 | +- Python |
| 11 | +deployment: |
| 12 | +- awscli |
| 13 | +pro: true |
| 14 | +leadimage: "serverless-quiz-app-featured-image.png" |
| 15 | +--- |
| 16 | + |
| 17 | +## Introduction |
| 18 | + |
| 19 | +Interactive quiz applications are popular for education, training, and engagement platforms. Building them with serverless architecture provides scalability, cost-effectiveness, and simplified maintenance. In this tutorial, we'll create a complete serverless quiz application using AWS Lambda, DynamoDB, and API Gateway. |
| 20 | + |
| 21 | +Our quiz application will allow users to: |
| 22 | +- Create new quizzes with multiple-choice questions |
| 23 | +- Submit quiz responses and receive immediate scoring |
| 24 | +- View quiz results and leaderboards |
| 25 | + |
| 26 | +Using LocalStack, we can develop and test this entire serverless infrastructure locally before deploying to AWS, enabling rapid development cycles and cost-effective testing. |
| 27 | + |
| 28 | +## Prerequisites |
| 29 | + |
| 30 | +For this tutorial, you will need: |
| 31 | + |
| 32 | +- [LocalStack Pro](https://localstack.cloud/pricing/) with a valid auth token |
| 33 | +- [AWS CLI](https://docs.localstack.cloud/user-guide/integrations/aws-cli/) with [`awslocal` wrapper](https://docs.localstack.cloud/user-guide/integrations/aws-cli/#localstack-aws-cli-awslocal) |
| 34 | +- [AWS CDK](https://docs.localstack.cloud/user-guide/integrations/aws-cdk/) with [`cdklocal` wrapper](https://github.com/localstack/aws-cdk-local) (**optional**) |
| 35 | +- [Python 3.11+](https://www.python.org/downloads/) and `pip` |
| 36 | +- [curl](https://curl.se/) for testing API endpoints |
| 37 | +- [`make`](https://www.gnu.org/software/make/) (**optional**, but recommended for running the sample application) |
| 38 | + |
| 39 | +## Architecture |
| 40 | + |
| 41 | +The following diagram shows the serverless architecture we'll build: |
| 42 | + |
| 43 | + |
| 44 | + |
| 45 | +The architecture consists of: |
| 46 | + |
| 47 | +- **API Gateway**: REST API endpoints for quiz operations with Lambda integrations |
| 48 | +- **Lambda Functions**: Serverless functions handling quiz operations (create, submit, score, retrieve) |
| 49 | +- **DynamoDB Tables**: NoSQL database storing quiz metadata (`Quizzes`) and user submissions (`UserSubmissions`) |
| 50 | +- **CloudFront Distribution**: Global delivery of frontend assets with caching |
| 51 | +- **S3 Bucket**: Static website hosting for the quiz frontend interface |
| 52 | +- **SQS**: Managing asynchronous submissions with Dead Letter Queue for failed processing |
| 53 | +- **SNS Topics**: Alert notifications and system integration |
| 54 | +- **Step Functions**: Email notification workflows |
| 55 | +- **IAM Roles and Policies**: Least-privilege access control for all services |
| 56 | + |
| 57 | +### Request Flow |
| 58 | + |
| 59 | +1. Client sends HTTP requests to API Gateway endpoints |
| 60 | +2. API Gateway triggers corresponding Lambda functions |
| 61 | +3. Lambda functions interact with DynamoDB for data persistence |
| 62 | +4. Responses are returned through API Gateway to the client |
| 63 | +5. Static frontend is served from S3 bucket via CloudFront distribution |
| 64 | + |
| 65 | +## Getting Started |
| 66 | + |
| 67 | +### Clone the Repository |
| 68 | + |
| 69 | +First, clone the sample repository and navigate to the project directory: |
| 70 | + |
| 71 | +```bash |
| 72 | +git clone https://github.com/localstack-samples/sample-serverless-quiz-app.git |
| 73 | +cd sample-serverless-quiz-app |
| 74 | +``` |
| 75 | + |
| 76 | +### Set up the Environment |
| 77 | + |
| 78 | +Create a Python virtual environment and install dependencies: |
| 79 | + |
| 80 | +```bash |
| 81 | +python -m venv .venv |
| 82 | +source .venv/bin/activate # On Windows: .venv\Scripts\activate |
| 83 | +pip install -r tests/requirements-dev.txt |
| 84 | +``` |
| 85 | + |
| 86 | +## Deploying the Application |
| 87 | + |
| 88 | +### Start LocalStack |
| 89 | + |
| 90 | +First, start LocalStack with your auth token: |
| 91 | + |
| 92 | +```bash |
| 93 | +localstack auth set-token <your-auth-token> |
| 94 | +localstack start |
| 95 | +``` |
| 96 | + |
| 97 | +### Deploy the Infrastructure |
| 98 | + |
| 99 | +You can deploy the application using either AWS CLI or CDK: |
| 100 | + |
| 101 | +#### Option 1: AWS CLI Deployment (Recommended) |
| 102 | + |
| 103 | +Deploy the complete serverless infrastructure using the provided script: |
| 104 | + |
| 105 | +```bash |
| 106 | +bin/deploy.sh |
| 107 | +``` |
| 108 | + |
| 109 | +#### Option 2: CDK Deployment |
| 110 | + |
| 111 | +Alternatively, deploy using AWS CDK with LocalStack: |
| 112 | + |
| 113 | +```bash |
| 114 | +cd cdk |
| 115 | +cdklocal bootstrap |
| 116 | +AWS_CMD=awslocal CDK_CMD=cdklocal bash ../bin/deploy_cdk.sh |
| 117 | +``` |
| 118 | + |
| 119 | +Both deployment methods will: |
| 120 | +1. Create DynamoDB tables for quizzes and submissions |
| 121 | +2. Deploy Lambda functions for quiz operations |
| 122 | +3. Set up API Gateway endpoints |
| 123 | +4. Configure S3 bucket for static hosting |
| 124 | +5. Seed sample quiz data |
| 125 | + |
| 126 | +The deployment output will show: |
| 127 | + |
| 128 | +```bash |
| 129 | +CloudFront URL: https://1e372b81.cloudfront.localhost.localstack.cloud |
| 130 | +API Gateway Endpoint: http://localhost:4566/_aws/execute-api/4xu5emxibf/test |
| 131 | +``` |
| 132 | + |
| 133 | +## Testing the Application |
| 134 | + |
| 135 | +The application includes comprehensive testing capabilities across multiple dimensions: |
| 136 | + |
| 137 | +### Manual Testing |
| 138 | + |
| 139 | +Navigate to the CloudFront URL from the deployment output to interact with the quiz application. The interface allows you to: |
| 140 | + |
| 141 | +- Create new quizzes with multiple choice questions |
| 142 | +- Submit quiz responses and receive immediate scoring |
| 143 | +- View leaderboards with top performers |
| 144 | +- Test email notifications through the MailHog extension |
| 145 | + |
| 146 | +**Note**: If you have deployed the application using AWS CLI, sample quiz data would have been seeded to make local testing easier. |
| 147 | + |
| 148 | +### End-to-End Integration Testing |
| 149 | + |
| 150 | +Run the complete test suite to validate quiz creation, submission, and scoring: |
| 151 | + |
| 152 | +```bash |
| 153 | +pytest tests/test_infra.py |
| 154 | +``` |
| 155 | + |
| 156 | +The automated tests utilize the AWS SDK for Python (boto3) and the `requests` library to interact with the quiz application API. |
| 157 | + |
| 158 | +## Advanced Features with LocalStack Pro |
| 159 | + |
| 160 | +### Resource Browser |
| 161 | + |
| 162 | +Use the LocalStack Web Application to inspect your deployed resources: |
| 163 | + |
| 164 | +- [DynamoDB Tables](https://app.localstack.cloud/inst/default/resources/dynamodb): View table data and query operations |
| 165 | +- [Lambda Functions](https://app.localstack.cloud/inst/default/resources/lambda/functions): Monitor function invocations and logs |
| 166 | +- [API Gateway](https://app.localstack.cloud/inst/default/resources/apigateway): Inspect API endpoints and request routing |
| 167 | + |
| 168 | +### Cloud Pods for Quick Setup |
| 169 | + |
| 170 | +Skip the deployment step by loading a pre-configured environment: |
| 171 | + |
| 172 | +```bash |
| 173 | +localstack restart |
| 174 | +localstack pod load serverless-quiz-app |
| 175 | +``` |
| 176 | + |
| 177 | +This instantly loads the complete application infrastructure from a saved state. |
| 178 | + |
| 179 | +## Conclusion |
| 180 | + |
| 181 | +In this tutorial, we've built a complete serverless quiz application demonstrating key serverless patterns: |
| 182 | + |
| 183 | +- **Event-driven architecture** with API Gateway triggering Lambda functions |
| 184 | +- **NoSQL data persistence** using DynamoDB for scalable storage |
| 185 | +- **Stateless function design** enabling automatic scaling |
| 186 | +- **RESTful API design** for clean client-server communication |
| 187 | + |
| 188 | +The application showcases how LocalStack enables rapid serverless development by providing a local AWS environment for testing and iteration. This approach allows developers to: |
| 189 | + |
| 190 | +- Test serverless applications without cloud costs |
| 191 | +- Develop offline with full AWS service emulation |
| 192 | +- Validate application logic before production deployment |
| 193 | +- Iterate quickly during development cycles |
| 194 | + |
| 195 | +For production deployment, the same code and configuration can be deployed to AWS with minimal changes, demonstrating the power of LocalStack for serverless development workflows. |
0 commit comments