AWS S3M Pattern: 5 Steps to marry Serverless & Microservice Securely

“Save your time with this Abstract Pattern to make complex Cloud Architectures”

Use case :

Project Architecture

Global Architecture for S3M Pattern
Global Architecture for S3M Pattern
S3M: Architecture

Steps for Technical Implementation

Step 1: let create our Angular Front-End :

npm install -g @angular/cli

Step 2: let create our backend with .net core :

S3A Backen Step
S3A Backen Step
Controller example
app.UseCors("AllowOrigin");services.AddCors(c =>
{
c.AddPolicy("AllowOrigin",
options => AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod());
});

Step 3: let make a local test :

npm i // to install all dependencyng serve
Local Test of Testing Decoupled Web Application
Local Test of Testing Decoupled Web Application
Local Test of Testing Decoupled Web Application

Step 4: let prepare our AWS infrastructure:

Create a Repository into Elastic Container Registry for docker images
Create a Repository into Elastic Container Registry for docker images
Elastic Container Registry
ECS Cluster Template
ECS Cluster Template
ECS Cluster
Create an Elastic Container Cluster with Network Template
Create an Elastic Container Cluster with Network Template
Cluster Networking Template
Route Table
0.0.0.0/0 => NatGateway
Add Route 0.0.0.0/0 targeting NAT Gateway
Route Table Subnets Association
Load Balancers Types
Create a Network Load Balancer
Create a Network Load Balancer
NLB
Get the DNS of Network Load Balancer
Get the DNS of Network Load Balancer
NLB DNS
Create a VPC Link
Create a VPC Link
VPC Link
Create API Gateway Resource as proxy
Create API Gateway Resource as proxy
API Gateway Resource
Api Gateway Proxy mode with NLB and VPC Link
Api Gateway Proxy mode with NLB and VPC Link
Setup Proxy for ApiGateway
Create a Lambda Function
Upload a zip to an  AWS Lambda
Upload a zip to an  AWS Lambda
Upload Lambda as a ZIp
Attach Lambda Authorizer to Api Gateway Authorizer, #Authorizer
Attach Lambda Authorizer to Api Gateway Authorizer, #Authorizer
Deploy th Api Gateway and Copy-paste the endpoint into the Front
Deploy th Api Gateway and Copy-paste the endpoint into the Front
Deploy the API Gateway and Copy-paste the endpoint into the Front

Step 5: Bring All Pieces together (Deployment):

ng build --prod
Host Angular Front in S3 Bucket for hosting static website
Host Angular Front in S3 Bucket for hosting static website
Deploy Angular Front to S3
docker build -t s3m-test -f .\S3MExampleBackend\Dockerfile .
Build .net docker image and push it to ECR
Build .net docker image and push it to ECR
Deploy Backend
Task Definition
Create an ECS Service
Create an ECS Service
ECS Service

Test the Applications

Yeeeeeeees everything work like a magic 😜

JWT
if(decodedJwt.admin) by if(!decodedJwt.admin)

Conclusion

Software Lead Architect Enjoy designing, creating, coding, and Cloud Deploy. https://elgafa.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store