Modern technology stack

Built for performance, security, and scale

Portfolio is a full-stack Next.js application with secure authentication, cloud-native hosting, and a production-grade toolchain. Below is the exact stack and architecture currently powering the live site.

Technology Stack Overview

The core frameworks, languages, and services that keep the experience fast, reliable, and easy to evolve.

Frontend Framework

Next.js 16

React framework with App Router, server components, and Turbopack for blazing fast development

Key Features:
App RouterServer ComponentsTurbopackISR & SSG
⚛️

React 19

Latest React with concurrent features, server components, and enhanced performance

Key Features:
Concurrent ModeSuspenseServer ComponentsHooks
🔷

TypeScript 5.9

Strict typing for reliability, refactoring safety, and better DX

Key Features:
Type SafetyIntelliSenseRefactoringError Prevention

Styling & UI

🎨

TailwindCSS v4

Utility-first CSS framework for rapid UI development with professional design system

Key Features:
Utility ClassesResponsive DesignCustom ComponentsPerformance

Authentication

🔐

NextAuth.js v5

Complete authentication solution with OAuth providers and secure session handling

Key Features:
OAuth ProvidersJWT SessionsSecure SecretsSession Management

Database & Backend

☁️

Azure Cosmos DB

Globally distributed NoSQL database with multi-model support and automatic scaling

Key Features:
NoSQL APIGlobal DistributionLow LatencyElastic Scale
📦

Azure Cosmos DB SDK

Native JavaScript SDK for seamless integration with Azure Cosmos DB NoSQL API

Key Features:
Type SafetyQuery APIDirect IntegrationHigh Performance

Development Tools

🔍

ESLint

JavaScript linter for identifying and fixing code quality issues

Key Features:
Code QualityError DetectionStyle ConsistencyAuto-fixing
🧩

PostCSS

Plugin-based CSS transformations for a smooth styling workflow

Key Features:
AutoprefixingModern CSSOptimizationsPipeline Friendly

Operations & Infrastructure

🚀

Azure Container Apps

Serverless containers with autoscaling, managed ingress, and observability

Key Features:
AutoscalingManaged IngressHTTPSObservability
🤖

GitHub Actions

CI/CD pipeline for linting, building, scanning, and deploying

Key Features:
CI/CDSecurity ScansDocker BuildAutomated Deploy

Software Stack & DevOps

Full-stack JavaScript with a production-ready pipeline from code to cloud.

🎨

Frontend

Next.js 16 with App Router

Server Components, Turbopack, and static optimizations for fast loads and SEO.

React 19

Concurrent rendering, Suspense, and an updated hooks ecosystem.

TypeScript 5.9

Strict typing across the app to catch issues at build time.

TailwindCSS v4

Utility-first styling for rapid UI delivery with consistent design tokens.

⚙️

Backend & Services

Azure Cosmos DB

Global NoSQL with elastic scale and low latency.

NextAuth.js v5

OAuth (Google, GitHub) with secure JWT sessions and secrets.

Node.js 20 Runtime

Modern LTS runtime for both build and production containers.

ESLint & Type Checking

Enforced code quality and consistency on every commit.

🛠️

DevOps & Deployment

CI/CD Pipeline

GitHub Actions builds, lints, tests, scans, and ships every push to Azure Container Apps.

  • • ESLint validation and code quality checks
  • • Automated Next.js build & type safety
  • • Docker image build & push to ACR
  • • Security scanning with Trivy

Container & Hosting

Serverless containers on Azure with scaling from 1→3 replicas.

  • • Node.js 20-alpine base image
  • • Azure Container Registry for images
  • • Azure Container Apps for hosting
  • • Auto-scaling and regional redundancy
🌐

Domain

GoDaddy Hosted Domain

Professional domain registration and management through GoDaddy.

DNS Configuration

Custom DNS records pointing to Azure Container Apps ingress endpoint.

Global Availability

Domain registered for worldwide access with reliable DNS resolution.

🔒

SSL/TLS Certificate

Azure Managed Certificate

Enterprise-grade SSL/TLS certificate managed automatically by Azure.

Auto-Renewal

Certificate automatically renewed before expiration with zero downtime.

HTTPS Enforcement

All traffic secured with TLS 1.2+ for data protection and SEO benefits.

Architecture & Infrastructure

Cloud-native design with clear layers, secure auth, and automated delivery.

How It Fits Together

1

Client Layer

React/Next.js UI with Server Components for fast rendering and SEO.

2

API Layer

Next.js App Router APIs handle validation, business logic, and typed responses.

3

Authentication

NextAuth.js with OAuth providers and secure JWT sessions.

4

Data Layer

Azure Cosmos DB for globally distributed data with lazy client initialization.

5

Deployment

GitHub Actions -> ACR -> Azure Container Apps with environment-configured secrets.

☁️

Cloud Infrastructure

Azure Subscription

Enterprise-grade security and compliance with regional deployment (West Europe).

Container Apps

Serverless containers with 1–3 replicas and managed ingress on port 3000.

Container Registry

Private Azure Container Registry storing signed images from CI.

Monitoring & Logging

Azure Log Analytics workspace capturing app logs and performance metrics.

🔄

Deployment Pipeline

Build & Test

Node.js 20, npm ci, ESLint, and Next.js build with type checking.

Security Scanning

Trivy scans file system and container images; CodeQL optional.

Image Build & Push

Multi-stage Docker build with standalone output pushed to ACR (latest + SHA tags).

Container App Deploy

Azure CLI creates/updates the Container App with env vars and image reference.

Architecture Benefits

High Performance

Server components and efficient queries for sub-second responses.

📈

Auto-Scaling

Container Apps scale replicas between 1–3 based on demand.

🔒

Enterprise Security

OAuth 2.0, encrypted secrets, HTTPS, and dependency scanning.

🚀

Automated Delivery

CI/CD on every push keeps environments consistent.

🌍

Global Ready

Cosmos DB distribution and CDN-friendly static assets.

📊

Observability

Centralized logging and metrics in Azure Log Analytics.

Secure App Pages (authenticated)

These experiences require sign-in and use role-aware data from Cosmos DB.

Dashboard

Personalized KPIs, recent activity, and quick access tiles for portfolio, time tracking, and applications.

Dashboard overview (screenshot placeholder)

Time Tracking

Create time entries, view weekly totals, and sync with project timelines.

Time tracking timeline (screenshot placeholder)

Job Applications

Track pipeline stages, interviews, outcomes, and notes with calendar integration.

Applications board (screenshot placeholder)

Settings

Manage profile visibility, authentication providers, and notification preferences.

Settings and preferences (screenshot placeholder)