Portfolio v2: The Ubuntu Terminal Experience

A full-stack, enterprise-grade portfolio platform and custom Content Management System (CMS) designed specifically for DevOps engineers and software developers. This project implements a sophisticated user interface inspired by the Ubuntu desktop environment and Linux terminal aesthetics, providing a unique and interactive professional showcase.

Project Overview

The platform serves as both a professional portfolio and a demonstration of modern full-stack engineering. By utilizing a custom-built CMS, the system eliminates reliance on third-party headless services, offering total control over data architecture, media storage, and real-time database reactivity.

Technical Architecture

• Frontend Framework: TanStack Start (React 19) utilizing TypeScript and Tailwind CSS v4.
• State Management & Routing: TanStack Router for type-safe navigation and TanStack Query for server-state synchronization.
• Backend Infrastructure: Self-hosted Convex instance for reactive database operations and serverless function execution.
• Persistence Layer: PostgreSQL (managed via Coolify) and R2-compatible Convex File Storage for high-availability media assets.
• Security: Convex Auth implementation for robust, password-based administrative access control.
• Deployment: Containerized via Docker and orchestrated through a self-hosted Coolify PaaS instance.

Core Functionality

• Terminal-Inspired Design System: A meticulously crafted UI utilizing Ubuntu Mono typography, window-style project containers, and command-line interface (CLI) prompt simulations.
• Administrative Content Management: A centralized dashboard providing full CRUD capabilities for:
  • Project Portfolios: Grid-based displays with technical stack filtering and integrated image galleries.
  • Technical Blog: A complete publishing workflow featuring a custom Tiptap editor, automated reading time estimation, and multi-language syntax highlighting.
  • Skill Matrices: Categorized technical competencies with granular proficiency indicators.
• Automated Resume Generation: Integrated PDF engine using @react-pdf/renderer that dynamically generates ATS-friendly resumes directly from the CMS database.
• Optimized Performance: Implementation of Server-Side Rendering (SSR) for instantaneous hydration, achieving high Lighthouse scores for performance, accessibility, and SEO.

DevOps and Continuous Integration

The infrastructure is fully automated using a GitHub Actions CI/CD pipeline. This workflow manages automated unit testing, multi-stage Docker builds, and synchronized Convex schema migrations, ensuring a reliable and streamlined deployment process to the production environment.