Lease Match Cloud Architecture

📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Prerequisites
  • Setup, Install & Deployment
  • Usage
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• ❓ FAQ (OPTIONAL)
• 📝 License

📖 LeaseMatch

LeaseMatch simplifies the rental process by offering a fair, transparent, and flexible marketplace for housing. Whether you're looking to rent an apartment or list your property, LeaseMatch puts the power of choice and negotiation in your hands.

LeaseMatch is a project to showcase the concepts learned in the Bootcamp Arquitectura en la Nube of MinTIC Colombia

🛠 Built With

Architecture

This project is the deployment of the infrastructure required to create a complete website on AWS and following security guidelines and good practices. It uses of AWS CDK Infrastructure as a Code.

Components

• Lambda function: Used to manage backend logic. The properties_lambda_function property defines the behavior of the function and the path to the code ("./infra/api"). in the code, we assume that you will have a properties.py file inside the api directory, where the logic for managing property data resides.

• DynamoDB: This is the NoSQL database used to store property data. The LeaseMatch_table has a primary key id that uniquely identifies each property. The Lambda function has full access to the table, allowing it to perform all database operations (CRUD).

• API Gateway: Acts as the entry point to the backend services, routing HTTP requests to the appropriate Lambda functions. It enables secure and scalable communication between clients and the backend, and supports enabling CORS to allow requests from different domains.

• Amplify (React Vite): AWS Amplify integrates the React Vite application with AWS services, simplifying the implementation of backend features like authentication, storage, and API interactions. Amplify also provides seamless hosting and deployment options for the frontend application.

• Cognito: Handles user authentication and authorization, providing features such as user registration, login, and secure access to resources. It integrates easily with Amplify and supports standards like OAuth2 and OpenID Connect.

• CloudFront: A content delivery network (CDN) service used to distribute and cache the frontend application and other static assets globally, ensuring low latency and high availability for end users.

• WAF (Web Application Firewall): Protects the application from malicious traffic by filtering requests based on custom rules, such as blocking traffic from specific geographic regions or IP addresses.

• CI/CD: Continuous Integration and Continuous Deployment pipelines automate the process of building, testing, and deploying the application. This ensures rapid, consistent, and error-free updates to both the frontend and backend services.

Tech Stack

Frontend

• To deploy the frontend on Amplify, the [AWS Quickstart Deployment Template] was used, following AWS recommendations. This guide helps developers integrate AWS Amplify into a React application, providing step-by-step instructions to set up a React project, install Amplify, configure it to use AWS services (Cognito, Vite React TS,CI/CD, and APIs), and add cloud-powered features like authentication and hosting.
  AWS Quickstart Deployment Template V2

Backend

To deploy the backend, we used an AWS CDK stack that allows to integrate and deploy the following AWS services: apigateway, lambda, dynamodb (LeaseMatch/devops/infra/api_stack.py)
• API Gateway
• Lambda Function

Database

• Dynamo DB

Firewall

AWS WAF is used to protect the CloudFront distribution and source servers.
• AWS WAF

Frontend Deployment

AWS Amplify

Git Authorization

App deploy

Api Gateway & Lambdas

Dynamo DB

Cloud formation

Cognito

WAF blocked and allowed

### Key Features

• Use of Infrastructure as Code
• Use of API Gateway to expose services from Lambda functions and enable CORS.
• Creation and integration of Amplify, React Vite TS, Cognito, and CI/CD using the AWS template.
• WAF (Web Application Firewall) to allow and block traffic by region.

(back to top)

🚀 Live Demo

• Live Demo Link

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps. Step 1 (Backend)

• Clone the repository using:

git clone https://github.com/LeaseMatch/LeaseMatch.git

Step 2 (Frontend)

• Clone the Front repository in your Github account:

git clone https://github.com/LeaseMatch/Front.git

Prerequisites

In order to run this project you need:

• AWS Account
• Docker
• Visual Studio

Setup, Install & Deployment

Step 1 (CDK Api Services)

• Open the LeaseMatch project on VS Code and execute the Reopen in Container button Dev Containers
• Set AWS Credentials: https://docs.aws.amazon.com/cli/v1/userguide/cli-configure-envvars.html
• Move to the location of app.py file (/devops)
• Run the command:

 cdk deploy api

• (api url is generated)
• Enter to your AWS Account and validate deployed REST services using Postman or other tool
• After test don´t forget to run the command to destroy infrastructure

  cdk destroy api

Step 2 (Deploy Amplify Frontend)

• Update required URLs in src/components folder
• Run the command to construct project dependencies

 npm i

• Run the command to validate if app is working

 npm run dev

• Commit and Push changes to your repository
• Enter to AWS Amplify and click "Deploy App" button
• Follow the instructions to authorize and select repository and branch
• Deploy the app
• Populate properties table with the required data
• Enter to generated URL, create a new user and validate functionality

Step 3 (Execute WAF Stack)

• Open the LeaseMatch project on VS Code and execute the Reopen in Container button Dev Containers
• Set AWS Credentials: https://docs.aws.amazon.com/cli/v1/userguide/cli-configure-envvars.html
• update domain name with the URL app generated in previous step
• Move to the location of app.py file (/devops)
• Run the command:

  cdk deploy waf

• Enter to your AWS Account and validate deployed in AWS Firewall Manager
• Validate blocked and allowed access
• After test don´t forget to run the command to destroy infrastructure

  cdk destroy waf

Usage

• You can test backend services using Postman
• To execute the app use the Amplify deployed
• To restrict access you can include IP address or Country code

Lease Match App

(back to top)

👥 Authors

👤 Elio Nelson Cortés

• GitHub: @NeckerFree
• LinkedIn: Elio Cortés

👤 Alexandra Baquero

• GitHub: @alexabaqueroc
• LinkedIn: LinkedIn

👤 Ferney Medina

👤 Juan Marciglia

👤 Andrés

👤 Kevin

(back to top)

🔭 Future Features

Describe 1 - 3 features you will add to the project.

• [Configure AWS environment vars]
• [Create complete CRUD opertions]
• [Create the complete deployment using CDK]

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project please give us a star

(back to top)

🙏 Acknowledgments

We would like to thank our instructor Nicolas

(back to top)

❓ FAQ (OPTIONAL)

Add at least 2 questions new developers would ask when they decide to use your project.

• How to install devcontainers in a CDK project

  • Installing Dev Containers (devcontainers) in a CDK (AWS Cloud Development Kit) project involves setting up a development environment using Visual Studio Code's Dev Containers extension. This provides a containerized environment tailored for your project.

• How to create Amplify Reac App

  • Follow the instructions in the Quickstar Guide

(back to top)

📝 License

This project is MIT licensed.

NOTE: we recommend using the MIT license - you can set it up quickly by using templates available on GitHub. You can also use any other license if you wish.

(back to top)