Quote Lambda TF

A full-stack serverless quote management application built with modern cloud-native technologies. This monorepo contains both the frontend React application and the backend Java Lambda API, demonstrating best practices for serverless architecture, infrastructure as code, and CI/CD automation.

Table of Contents

• 🌟 Live Demo
• 📋 Overview
• 🏗️ Architecture
• 📦 Repository Structure
  • Frontend - React Web Application
  • Backend - Java Lambda API
• 🚀 Quick Start
  • Prerequisites
  • Deploy the Complete Stack
• 🔧 Technology Stack
  • Frontend
  • Backend
  • Infrastructure
  • DevOps
• 📚 Documentation
  • Backend Documentation
  • Frontend Documentation
  • Shared Documentation
• 🔐 GitHub Actions Setup
  • Required GitHub Secret
  • Workflows
• 🎯 Learning Goals
• 💰 Cost Estimate
• 🤝 Contributing
• 📄 License
• 🔗 Links

🌟 Live Demo

Access the live application at:

Production Environment:

https://d5ly3miadik75.cloudfront.net/

Development Environment:

https://d1fzgis91zws1k.cloudfront.net/

📋 Overview

This application allows users to:

• Browse inspirational quotes from ZenQuotes API
• Get random quotes with smart filtering
• Like their favorite quotes
• View popular quotes sorted by likes

The project showcases:

• Serverless Architecture - AWS Lambda with SnapStart optimization
• Infrastructure as Code - Complete Terraform configurations
• Modern Frontend - React with TypeScript and Vite
• CI/CD Automation - GitHub Actions with OIDC authentication
• Cloud-Native Design - API Gateway, DynamoDB, S3, CloudFront

🏗️ Architecture

┌─────────────────────────────────────────────────────────────┐
│                        CloudFront CDN                        │
│                  (d5ly3miadik75.cloudfront.net)             │
└────────────────────────┬────────────────────────────────────┘
                         │
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                    S3 Static Website                         │
│              (quote-lambda-tf-frontend)                      │
│                   React + TypeScript                         │
└────────────────────────┬────────────────────────────────────┘
                         │
                         │ HTTPS API Calls
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                      API Gateway                             │
│         (blgydc5rjk.execute-api.eu-central-1...)            │
└────────────────────────┬────────────────────────────────────┘
                         │
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                    AWS Lambda (Java 21)                      │
│                  with SnapStart enabled                      │
│              (quote-lambda-tf-backend)                       │
└────────────────────────┬────────────────────────────────────┘
                         │
                         ▼
┌─────────────────────────────────────────────────────────────┐
│                       DynamoDB                               │
│                 (quote-lambda-tf-quotes)                     │
└─────────────────────────────────────────────────────────────┘

📦 Repository Structure

This monorepo contains two main modules:

Frontend - React Web Application

A modern, responsive web application built with:

• React 18 with TypeScript
• Vite for fast development and optimized builds
• TailwindCSS for styling
• Playwright for end-to-end testing
• Deployed on: AWS S3 + CloudFront CDN

📖 Frontend Documentation →

Backend - Java Lambda API

A serverless REST API built with:

• Java 21 (Amazon Corretto)
• AWS Lambda with SnapStart (~200ms cold starts)
• API Gateway for HTTP endpoints
• DynamoDB for data persistence
• Terraform for infrastructure management

📖 Backend Documentation →

🚀 Quick Start

Prerequisites

• AWS CLI configured with credentials
• Terraform >= 1.0.0
• Java 21 (for backend)
• Node.js 18+ (for frontend)
• Maven 3.x (for backend)

Deploy the Complete Stack

1. Set Up AWS OIDC for GitHub Actions

# Get your AWS account ID
AWS_ACCOUNT_ID=$(aws sts get-caller-identity --query Account --output text)

# Run the setup script (replace with your GitHub username)
.github/setup-aws-oidc.sh $AWS_ACCOUNT_ID YOUR_GITHUB_USERNAME

This creates an IAM role with permissions for both Lambda and S3/CloudFront deployments.

2. Deploy Backend Infrastructure

cd quote-lambda-tf-backend/infrastructure
terraform init
terraform apply

3. Deploy Backend Lambda Function

Use GitHub Actions or deploy manually:

cd quote-lambda-tf-backend
mvn clean package
aws lambda update-function-code \
  --function-name quote-lambda-tf-backend \
  --zip-file fileb://target/quote-lambda-tf-backend-1.0-SNAPSHOT.jar \
  --region eu-central-1

4. Deploy Frontend Infrastructure

cd quote-lambda-tf-frontend/infrastructure
terraform init
terraform apply

5. Deploy Frontend Application

cd quote-lambda-tf-frontend
npm install
npm run build
aws s3 sync dist/ s3://quote-lambda-tf-frontend --delete

🔧 Technology Stack

Frontend

• Framework: React 18 with TypeScript
• Build Tool: Vite
• Styling: TailwindCSS
• Testing: Playwright
• Hosting: AWS S3 + CloudFront

Backend

• Language: Java 21 (Amazon Corretto)
• Runtime: AWS Lambda with SnapStart
• API: API Gateway (HTTP API)
• Database: DynamoDB
• External API: ZenQuotes.io

Infrastructure

• IaC: Terraform
• State Management: S3 + DynamoDB locking
• CI/CD: GitHub Actions
• Authentication: AWS OIDC (no long-lived credentials)

DevOps

• Version Control: Git + GitHub
• Automation: GitHub Actions workflows
• Monitoring: CloudWatch Logs
• Security: IAM roles with least-privilege policies

📚 Documentation

Backend Documentation

• Infrastructure Setup - Terraform configuration and deployment
• GitHub Workflows - CI/CD pipeline setup
• SnapStart Setup - Lambda cold start optimization
• API Testing - HTTP request examples

Frontend Documentation

• Infrastructure Setup - S3 and CloudFront deployment
• GitHub Workflows - Deployment automation

Shared Documentation

• Terraform State Architecture - Complete state management architecture
• Multi-Environment Setup - Dev/Prod environment configuration
• AWS OIDC Setup Script - Automated IAM role configuration

🔐 GitHub Actions Setup

Both frontend and backend use GitHub Actions for automated deployments with OIDC authentication.

Required GitHub Secret

Add this secret to your repository:

Secret Name	Value	Description
AWS_ROLE_ARN	arn:aws:iam::ACCOUNT_ID:role/GitHubActionsLambdaDeployRole	IAM role for deployments

Workflows

• deploy-lambda.yml - Builds and deploys the backend Lambda function
• deploy-frontend.yml - Builds and deploys the frontend to S3
• playwright.yml - Runs end-to-end tests

🎯 Learning Goals

This project demonstrates:

1. Serverless Architecture

   • Building REST APIs with AWS Lambda
   • Optimizing cold starts with SnapStart
   • API Gateway configuration and throttling

2. Infrastructure as Code

   • Managing AWS resources with Terraform
   • Remote state management with S3 and DynamoDB
   • Modular infrastructure design

3. Modern Frontend Development

   • React with TypeScript and Vite
   • Responsive design with TailwindCSS
   • End-to-end testing with Playwright

4. DevOps Best Practices

   • CI/CD with GitHub Actions
   • OIDC authentication (no long-lived credentials)
   • Automated testing and deployment

5. Cloud-Native Patterns

   • Static website hosting with S3 and CloudFront
   • NoSQL data modeling with DynamoDB
   • RESTful API design

💰 Cost Estimate

This application runs on AWS Free Tier eligible services:

• Lambda: ~1M free requests/month
• API Gateway: ~1M free requests/month (first 12 months)
• DynamoDB: 25GB storage + 25 RCU/WCU free
• S3: 5GB storage + 20K GET requests free
• CloudFront: 1TB data transfer + 10M requests free (first 12 months)

Estimated monthly cost: $0-5 for low traffic

🤝 Contributing

This is a learning project, but suggestions and improvements are welcome!

📄 License

This project is open source and available for educational purposes.

🔗 Links

• Live Application (Production): https://d5ly3miadik75.cloudfront.net/
• Live Application (Development): https://d1fzgis91zws1k.cloudfront.net/
• API Endpoint: https://blgydc5rjk.execute-api.eu-central-1.amazonaws.com
• ZenQuotes API: https://zenquotes.io/

---

Built with ❤️ to learn serverless architecture and modern web development