Skip to content
All projects

Personal Website / Full-Stack & DevOps Portfolio

Website Portfolio

This website: a statically exported Next.js site built for Amazon S3 and CloudFront, with infrastructure defined in Terraform and deployments through GitHub Actions.

Status
This site
Discipline
DevOps & Cloud
Key stack
Next.js, TypeScript
Repository
View on GitHub

Overview

Overview

What it does

A single-page portfolio with light and dark themes, a CI/CD pipeline illustration, detailed project pages, an experience timeline, grouped skills, verifiable certifications and a contact form.

It is exported as static files at build time, with no server runtime, so it can be served from object storage behind a CDN.

Problem

To create a professional online presence that showcases my full-stack engineering, DevOps, cloud infrastructure and AI engineering experience, with every claim verifiable against my resume and public repositories.

Who it helps

Recruiters, hiring managers and engineers evaluating my work.

Solution

Solution

  • Content lives in typed data modules, separate from components, and each claim is traceable to the resume or a repository.
  • Accessible by design: semantic structure, keyboard navigation, visible focus, reduced-motion support and automated axe checks in both themes.
  • A small performance budget: static HTML, CSS-first animation, and Motion for React only where it is needed.
  • A contact form that sends through the site's own API (API Gateway, Lambda and SES, with Cloudflare Turnstile and rate limits), with clear sending, success and error states.
  • Deployments gated on linting, type checks, unit tests, end-to-end and accessibility tests, and Terraform validation.

Technology stack

Frontend
  • Next.js (static export)
  • React
  • TypeScript
  • Tailwind CSS
  • Motion for React
Testing & quality
  • Vitest
  • Testing Library
  • Playwright
  • axe-core
  • ESLint
  • Prettier
DevOps
  • GitHub Actions
  • Terraform
Cloud services
  • Amazon S3
  • Amazon CloudFront
  • AWS Certificate Manager
  • AWS IAM (OIDC)
Integrations
  • Cloudflare Turnstile
  • Cal.com (booking)

Infrastructure & architecture

Infrastructure & architecture

The infrastructure and delivery pipeline are implemented as code and validated in CI. Provisioning in AWS and pointing alibacelonia.dev at CloudFront are the remaining steps.

  1. GitHub
  2. GitHub Actions
  3. Next.js static build
  4. Amazon S3
  5. Amazon CloudFront
  6. alibacelonia.dev
Hosting
Private S3 bucket (public access blocked, encrypted, versioned) readable only by CloudFront through Origin Access Control.
CDN & TLS
CloudFront with HTTPS redirect, HTTP/2 and HTTP/3, security headers (CSP, HSTS) and an ACM certificate in us-east-1.
Infrastructure as code
Terraform for S3, CloudFront, ACM, an index-rewrite function and the deploy role, validated in CI.
CI/CD
GitHub Actions runs CI on pull requests. Pushes to main rerun CI, publish the build with year-long caching for hashed assets, and invalidate CloudFront.
Security
GitHub OIDC federation into a role limited to one bucket and one distribution, so there are no long-lived AWS keys.
AWS provisioningplanned
terraform apply in the production AWS account.
Custom domainplanned
alibacelonia.dev pointed at CloudFront through Cloudflare DNS.
Next project: cloud-incident-service