Oct 5, 2025 · Oct 5, 2025 · Oct 5, 2025 · Oct 5, 2025 · Oct 5, 2025 · Oct 28, 2025
diff --git a/src/content/docs/aws/tutorials/image-resizer-hot-reload.md b/src/content/docs/aws/tutorials/image-resizer-hot-reload.md
 ---
 title: S3 Image Resizer with Lambda (Hot Reload)
 description: Learn how to build and test a serverless image resizing pipeline locally using LocalStack Pro with Lambda hot reload support.
 services:
 - sqs
 - lmb
 - s3
 platform:
 - nodejs
 pro: true
 deployment:
 - docker-compose
 leadimage: "image-resizer-hot-reload.png"
 ---

 # S3 Image Resizer with Lambda (Hot Reload)

 ## Introduction

 In this tutorial, you’ll learn how to build and run a **serverless image resizing pipeline** locally using **LocalStack Pro**.
 The workflow is simple:

 1. Upload an image to an **S3 source bucket**.
 2. An **AWS Lambda** function automatically resizes the image.
 3. The resized image is written back to an **S3 target bucket**.
 4. Using **hot reload**, you can modify Lambda code locally and instantly test changes without redeployment.

 This pattern is ideal for developing and testing serverless media-processing workflows like thumbnails, avatars, and dynamic image scaling.


 ## Prerequisites

 Make sure you have the following installed and configured:

 - **LocalStack Pro** (hot reload support requires Pro)
 - **Docker** (to run LocalStack services)
 - **Node.js** *or* **Python** (depending on the Lambda runtime used)
 - **AWS CLI** or **awslocal**
 - **Make** (optional, for running build scripts)
 - Basic understanding of AWS Lambda and S3 event triggers

 ## Why / Use Case
 Image resizing is a fundamental part of many web applications — whether you’re:
 - A **CMS platform** generating thumbnails for uploaded images
 - An **e-commerce store** optimizing product visuals
 - A **developer** testing media pipelines before production

 Running this workflow locally with LocalStack lets you:
 - Develop and debug Lambdas faster (no redeploys)
 - Avoid AWS costs during experimentation
 - Simulate a realistic event-driven workflow
 ## Architecture Diagram

 ```text
          ┌────────────────────┐
          │    Source S3       │
          │ (e.g. input-bucket)│
          └───────┬────────────┘
                  │
           (S3 Event Trigger)
                  │
                  ▼
          ┌────────────────────┐
          │     Lambda         │
          │ (Image Resizer)    │
          └───────┬────────────┘
                  │
                  ▼
          ┌─────────────────────┐
          │  Target S3 Bucket   │
          │ (e.g. output-bucket)│
          └─────────────────────┘
 ```
 ## Steps
 ### 1. Clone the Repository
 ```
 git clone https://github.com/localstack-samples/sample-lambda-s3-image-resizer-hot-reload.git
 cd sample-lambda-s3-image-resizer-hot-reload
 ```
 ### 2. Install Dependencies

 If using Python:
 ```
 python -m venv .venv
 source .venv/bin/activate
 pip install -r requirements-dev.txt
 ```

 If using Node.js Lambdas:
 ```
 npm install
 ```
 ### 3. Start LocalStack

 Make sure your LocalStack Pro token is set:
 ```
 localstack auth set-token <your-auth-token>
 localstack start
 ```
 ### 4. Build and Deploy the Lambda
 ```
 Run the provided scripts to build and deploy:

 deployment/build-lambdas.sh
 deployment/awslocal/deploy.sh
 ```

 This sets up S3 buckets, event triggers, and deploys the Lambda function locally.

 ### 5. Upload a Sample Image

 Once deployment completes, upload a sample image to the input bucket:
 ```
 awslocal s3 cp ./samples/test-image.jpg s3://input-bucket/
 ```

 The Lambda will trigger automatically and write the resized image to s3://output-bucket/.

 ## Testing the Application
 ### Step 1: Verify the Resized Image

 * List files in the output bucket:
 ```
 awslocal s3 ls s3://output-bucket/

 ```
 * Download and inspect the resized image:
 ```
 awslocal s3 cp s3://output-bucket/test-image.jpg ./output/
 ```

 * Confirm the dimensions (e.g., via any image viewer or identify command from ImageMagick):
 ```
 identify ./output/test-image.jpg
 ```
 ### Step 2: Test Hot Reload

 * Modify your Lambda code locally (for example, change the resize dimensions or add a watermark).

 * Hot reload automatically detects changes—no redeploy needed.

 * Upload another image (or the same one under a new name):
 ```
 awslocal s3 cp ./samples/test-image2.jpg s3://input-bucket/
 ```

 Verify that the new logic is applied (e.g., updated size or watermark visible).

 ## Conclusion

 You’ve built and tested a complete serverless image pipeline on LocalStack, featuring:

 S3 → Lambda → S3 event-driven workflow

 Hot reload for rapid local iteration

 End-to-end testing of serverless image processing

 This pattern can easily extend to real-world use cases—such as photo galleries, CMS platforms, or social apps—where dynamic image transformation is essential.
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,159 @@
		---
		title: S3 Image Resizer with Lambda (Hot Reload)
		description: Learn how to build and test a serverless image resizing pipeline locally using LocalStack Pro with Lambda hot reload support.
		services:
		- sqs
		- lmb
		- s3
		platform:
		- nodejs
		pro: true
		deployment:
		- docker-compose
		leadimage: "image-resizer-hot-reload.png"
		---

		# S3 Image Resizer with Lambda (Hot Reload)

		## Introduction

		In this tutorial, you’ll learn how to build and run a serverless image resizing pipeline locally using LocalStack Pro.
		The workflow is simple:

		1. Upload an image to an S3 source bucket.
		2. An AWS Lambda function automatically resizes the image.
		3. The resized image is written back to an S3 target bucket.
		4. Using hot reload, you can modify Lambda code locally and instantly test changes without redeployment.

		This pattern is ideal for developing and testing serverless media-processing workflows like thumbnails, avatars, and dynamic image scaling.


		## Prerequisites

		Make sure you have the following installed and configured:

		- LocalStack Pro (hot reload support requires Pro)
		- Docker (to run LocalStack services)
		- Node.js or Python (depending on the Lambda runtime used)
		- AWS CLI or awslocal
		- Make (optional, for running build scripts)
		- Basic understanding of AWS Lambda and S3 event triggers

		## Why / Use Case
		Image resizing is a fundamental part of many web applications — whether you’re:
		- A CMS platform generating thumbnails for uploaded images
		- An e-commerce store optimizing product visuals
		- A developer testing media pipelines before production

		Running this workflow locally with LocalStack lets you:
		- Develop and debug Lambdas faster (no redeploys)
		- Avoid AWS costs during experimentation
		- Simulate a realistic event-driven workflow
		## Architecture Diagram

		```text
		┌────────────────────┐
		│ Source S3 │
		│ (e.g. input-bucket)│
		└───────┬────────────┘
		│
		(S3 Event Trigger)
		│
		▼
		┌────────────────────┐
		│ Lambda │
		│ (Image Resizer) │
		└───────┬────────────┘
		│
		▼
		┌─────────────────────┐
		│ Target S3 Bucket │
		│ (e.g. output-bucket)│
		└─────────────────────┘
		```
		## Steps
		### 1. Clone the Repository
		```
		git clone https://github.com/localstack-samples/sample-lambda-s3-image-resizer-hot-reload.git
		cd sample-lambda-s3-image-resizer-hot-reload
		```
		### 2. Install Dependencies

		If using Python:
		```
		python -m venv .venv
		source .venv/bin/activate
		pip install -r requirements-dev.txt
		```

		If using Node.js Lambdas:
		```
		npm install
		```
		### 3. Start LocalStack

		Make sure your LocalStack Pro token is set:
		```
		localstack auth set-token <your-auth-token>
		localstack start
		```
		### 4. Build and Deploy the Lambda
		```
		Run the provided scripts to build and deploy:

		deployment/build-lambdas.sh
		deployment/awslocal/deploy.sh
		```

		This sets up S3 buckets, event triggers, and deploys the Lambda function locally.

		### 5. Upload a Sample Image

		Once deployment completes, upload a sample image to the input bucket:
		```
		awslocal s3 cp ./samples/test-image.jpg s3://input-bucket/
		```

		The Lambda will trigger automatically and write the resized image to s3://output-bucket/.

		## Testing the Application
		### Step 1: Verify the Resized Image

		* List files in the output bucket:
		```
		awslocal s3 ls s3://output-bucket/

		```
		* Download and inspect the resized image:
		```
		awslocal s3 cp s3://output-bucket/test-image.jpg ./output/
		```

		* Confirm the dimensions (e.g., via any image viewer or identify command from ImageMagick):
		```
		identify ./output/test-image.jpg
		```
		### Step 2: Test Hot Reload

		* Modify your Lambda code locally (for example, change the resize dimensions or add a watermark).

		* Hot reload automatically detects changes—no redeploy needed.

		* Upload another image (or the same one under a new name):
		```
		awslocal s3 cp ./samples/test-image2.jpg s3://input-bucket/
		```

		Verify that the new logic is applied (e.g., updated size or watermark visible).

		## Conclusion

		You’ve built and tested a complete serverless image pipeline on LocalStack, featuring:

		S3 → Lambda → S3 event-driven workflow

		Hot reload for rapid local iteration

		End-to-end testing of serverless image processing

		This pattern can easily extend to real-world use cases—such as photo galleries, CMS platforms, or social apps—where dynamic image transformation is essential.