Architecture

System Overview

This portfolio has been designed as a production style web application rather than a static website. One of the primary goals of the project is to explore the technologies, tooling and engineering practices commonly used to build and operate modern cloud-native applications.

The current architecture centres around a containerised Next.js application deployed on AWS ECS Fargate behind an Application Load Balancer. Supporting infrastructure, including networking, DNS and deployment resources, is provisioned using Terraform, while application deployments are automated through GitHub Actions.

Although the application currently focuses on the frontend experience, the surrounding architecture has been designed to support additional backend services, third-party integrations and future portfolio projects without requiring significant structural changes.

%% title: High-Level Architecture
flowchart LR
    Browser[Browser]
    DNS[Route 53]
    ALB[Application Load Balancer]
    ECS[ECS Service]
    APP[Next.js Application]

    Browser --> DNS
    DNS --> ALB
    ALB --> ECS
    ECS --> APP

Request Flow

When a user visits the portfolio, their request is first resolved through Route 53 before being forwarded to the Application Load Balancer. The load balancer terminates the HTTPS connection using an AWS Certificate Manager (ACM) certificate and forwards the request to the running ECS service.

The ECS service runs the containerised Next.js application, which processes the request, renders the appropriate page and returns the response to the user's browser.

While the current request flow is relatively simple, the surrounding infrastructure has been designed so that additional backend services and external integrations can be introduced without fundamentally changing the architecture.

Components

Environments

The application is deployed using separate staging and production environments that share the same overall architecture while remaining independently deployable.

Maintaining separate environments allows infrastructure changes, deployment pipelines and application updates to be validated in staging before being promoted to production, reducing deployment risk while keeping both environments consistent.

Future Expansion

The current architecture intentionally focuses on a single frontend application while establishing the foundation for future growth.

%% title: Future
flowchart TB

    Browser --> Route53
    Route53 --> ALB

    ALB --> Next[Next.js]

    Next --> FastAPI[Future Python API]

    FastAPI --> GitHub[GitHub API]
    FastAPI --> AWS[AWS APIs]

Planned enhancements include:

• A Python backend providing APIs and background services.
• Integrations with external platforms such as GitHub and AWS to surface live project information.
• Additional portfolio projects that share common infrastructure, deployment workflows and documentation.
• Continued expansion of monitoring, observability and automated testing.

As the portfolio grows, the intention is to evolve the architecture while maintaining the same engineering principles of automation, reproducibility and clear documentation.