DevSecOps & CI/CD 2026

Alae's Portfolio Website (Personal DevSecOps Implementation)

Modern Static Architecture with Automated 4-Stage GitLab DevSecOps CI/CD Pipeline & Pages Deployment

Organization: Personal Engineering Project

My Role: Full-Stack & DevSecOps Engineer

Project Overview

Built a custom static portfolio using Astro and TypeScript, treating my personal site as a production application.

Implemented a complete 4-stage GitLab CI/CD pipeline featuring Secret Detection, SAST, Dependency Scanning, and automated deployment to GitLab Pages.

Engineered responsive bilingual internationalization (EN/FR) and dark/light mode toggles with zero layout shift and lightweight static performance.

Designed an automated asset redaction workflow in Python to sanitize confidential internal network information from enterprise project screenshots prior to release.

System & Infrastructure Architecture

Static Site Generation: Astro compiler outputs pre-rendered HTML, scoped CSS, and zero unnecessary client JS runtime.
CI/CD Orchestration: GitLab SaaS runners execute validate, security, build, and deploy stages sequentially.
Security Gates: GitLab Secret-Detection, Semgrep SAST analyzer, and npm audit high-severity verification.
Hosting & CDN: Direct static publication on GitLab Pages with custom domain and HTTPS routing.

DevSecOps & Security Enforcement

Shift-Left Pipeline: Every push to main triggers automated Secret-Detection and Semgrep SAST before build.
Secret Prevention: Strict Gitleaks patterns block accidental exposure of credentials, private keys, or API tokens.
Dependency Audit: Automated npm audit flags high and critical CVEs in packages before artifact packaging.
Automated Redaction: Enterprise project evidence is sanitized via Python Pillow scripts before commit.

Measurable Outcomes & Key Takeaways

100% automated CI/CD pipeline passing code validation, Secret-Detection, and Semgrep security gates on commit.
Sub-second page load times with static generation and optimized WebP media delivery.
Complete bilingual English and French translation across all pages, case studies, and gallery views.
Production release automated via GitLab Pages with zero manual deployment steps.

Verified Screenshots & Implementation Gallery (5 items)

Click any screenshot to view high-resolution details. All sensitive IP addresses and proprietary enterprise directories have been pre-reviewed and sanitized.