This portfolio is a custom-built, full-stack web application deployed on Railway using PHP 8.2, nginx, MySQL, and Docker — with no frameworks or page-building tools. Every page is hand-coded and served through PHP-FPM behind nginx, with Supervisor managing both processes inside a Docker container.
Homepage
The homepage opens with a hero section, then flows into an About section with a skills grid covering Languages (PHP, JavaScript, Perl, Python, SQL, AL), Frontend (HTML/CSS, jQuery, React, Responsive Design), and Backend & Tools (MySQL, PostgreSQL, REST APIs, Git, Docker, Linux). Featured projects are pulled from the database and displayed as interactive cards. Clicking any card opens a modal with a full screenshot gallery, tag list, rich text description, and links to GitHub and the live demo.
Projects Page
The /projects page loads every project from the database and groups them by type — Apps, Libraries, Components, Tools, APIs, and Other — each with a colored ■ badge. A live search bar filters by title, description, and tags simultaneously. Tag filter buttons (dynamically generated from all project tags in the database) let visitors narrow by technology. Type sections collapse automatically when they have no visible results, and a live results count updates as filters change.
Project Detail Page
Each project has its own dedicated page at /project/{id} with a breadcrumb, colored type badge, tag chips, GitHub and live demo buttons, a responsive screenshot gallery with thumbnail navigation, and a full rich-text description that supports headings, bold/italic, lists, blockquotes, code blocks, and links.
Contact Form
The contact form submits via AJAX to a PHP endpoint that validates all fields server-side, resolves the visitor's real IP through Railway's proxy headers, and stores the message in the database. A hard rate limit of one submission per email address per seven days prevents spam. All error and success states are shown inline without a page reload.
Theme & Responsiveness
A dark/light theme toggle is available on every page, with the preference stored in local storage so it persists across visits. The layout is fully responsive — the navigation collapses to a hamburger menu on small screens, and all grids reflow to single-column on mobile.
Security
All pages enforce HTTPS by checking the X-Forwarded-Proto header set by Railway's proxy and redirecting HTTP requests with a 301. An HSTS header is set on every response. The contact endpoint validates and sanitizes all input before touching the database. The admin portal uses session-based authentication with CSRF tokens on every state-changing form.
Admin Portal
A separate Railway service hosts a password-protected admin portal for managing site content. From there, projects can be created, edited, and deleted. The short description and full detail fields both use Quill.js rich text editors with distinct toolbars — the short description editor offers bold, italic, underline, and links; the full detail editor adds headings, bullet and numbered lists, blockquotes, code blocks, and links. Screenshots are uploaded directly to Cloudflare R2 object storage and served via a public bucket URL. Contact form submissions are viewable from the Contacts dashboard. All admin actions are protected by CSRF tokens and server-side session checks.