Building a Personal Cloud Portfolio on AWS

Deploying a production-ready cloud portfolio using AWS managed services.

Route 53CloudFrontS3CognitoAPI GatewayLambdaDynamoDB

Introduction

In this project I designed and deployed my personal cloud portfolio entirely on AWS using Infrastructure as Code.

The objective was not only to publish a portfolio website, but also to build a production-style cloud architecture that integrates authentication, serverless services, DNS management, HTTPS and automated infrastructure provisioning.

Services Used

Astro (Framework)
Amazon Route 53
AWS Certificate Manager (ACM)
Amazon CloudFront
Amazon S3
Amazon Cognito
Amazon API Gateway
AWS Lambda
Amazon DynamoDB
IAM
Terraform

Architecture

Configuration

Frontend

The project started by building the frontend using Astro. Although Astro simplifies static website generation, additional work was required to organize reusable components, configure routing, manage environment variables, and prepare the application for deployment on Amazon S3 and CloudFront. Separate development and production environments were also configured to simplify testing and deployments.

The application was structured into reusable components, while environment variables were configured to support both local development and production deployments.

More info: https://docs.astro.build/en/install-and-setup/

Challenges & Solutions

During the development of this project, several technical challenges were encountered. Solving them provided valuable hands-on experience with AWS services and helped improve the overall architecture of the solution.

Route 53 Domain Registration: A custom domain was purchased and configured using Amazon Route 53. DNS records had to be correctly created so that CloudFront, ACM and the hosted website could work together while providing secure HTTPS access.

ACM Certificate Validation: CloudFront requires SSL certificates to be issued in the us-east-1 region. Initially, the certificate could not be validated until the required DNS validation records were created in Route 53. Terraform was then used to automate the validation process.

CloudFront Custom Domain: Configuring CloudFront to serve the website through the custom domain required attaching the ACM certificate, configuring aliases and verifying that all traffic was redirected through HTTPS.

Private S3 Bucket: Instead of making the S3 bucket publicly accessible, Origin Access Control (OAC) was implemented so that CloudFront became the only service allowed to retrieve the website content, significantly improving the security of the architecture.

Amazon Cognito Authentication: Integrating Amazon Cognito was one of the most challenging parts of the project. The Hosted UI, callback URLs, logout URLs, user attributes and JWT token management all required careful configuration. Additional work was necessary to support both localhost and the production environment without changing the application code.

Comment System Integration: The comment system required integrating API Gateway, two AWS Lambda functions (Add Comment and Get Comments) and DynamoDB into a single workflow. Coordinating authentication, permissions and communication between these services required several iterations before the complete solution operated correctly.

API Gateway CORS: During development, requests from localhost were blocked because of Cross-Origin Resource Sharing (CORS) restrictions. The API Gateway configuration was updated to allow requests from both the local development environment and the production domain while maintaining a secure configuration.

Development vs Production: Supporting both environments required separate configuration files and environment variables. This approach allowed the application to run locally during development while using the production configuration after deployment without modifying the source code.

UTC Timestamp Management: Comments were stored in DynamoDB using UTC timestamps, which initially caused incorrect times to be displayed in the frontend. The issue was solved by converting UTC values into the user’s local timezone before rendering them.

CloudFront Cache Invalidation: After each deployment, CloudFront continued serving cached files, preventing users from seeing the latest changes immediately. The deployment workflow was updated to include cache invalidation after every release, ensuring that the newest version of the portfolio became available as soon as the deployment finished.

Project Results

Personal cloud portfolio deployed on AWS.
Secure authentication.
Serverless backend.
Custom domain with HTTPS.
Automated infrastructure with Terraform.

References

Project Code

You can find the Terraform code used in this project in the following GitHub directory.

View on GitHub