実績・プロジェクト/Humphrey ポートフォリオ (Laravel + React)

PHP 8.4Laravel 12React 19Inertia.js v2TypeScriptTailwind CSS v4PostgreSQL 17RedisDocker

Humphrey ポートフォリオ (Laravel + React)

live · maintained

言語を切り替える:

Laravel 12、React 19、Inertia.js v2、そしてMCPサーバー統合で構築されたフルスタックポートフォリオ&コンテンツエンジン。

本番サイト ↗ソースコード ↗

humphrey.humfurie.org

Humphrey ポートフォリオ (Laravel + React) screenshot 1

Cover

Laravel 12、React 19、Inertia.js v2で構築された、高性能なフルスタック個人ポートフォリオ、ブログプラットフォーム、そしてヘッドレスMCPコンテンツシステム。マルチ層キャッシング(HomepageCacheService)、非同期の閲覧数カウントキューワーカー、動的Schema.org JSON-LD SEOを備えたTipTap v3リッチテキストエディタ、AIエージェントとの連携のためのModel Context Protocol(MCP)ツールサーバー統合、そしてエンタープライズ向けRBAC管理パネルを特徴とする。

Featured Engineering & Architecture

How the Hardest Problems Were Solved

Key architectural decisions, concrete code implementations, and performance wins behind this project.

Explore repository →

Architectureapp/Mcp/Servers/PortfolioServer.php

Model Context Protocol (MCP) Server Integration

The Challenge

Enabling external AI agents to securely query and mutate portfolio content and site metrics without custom one-off API adapters.

The Architectural Solution

Implemented an MCP Server using Laravel MCP tools, OAuth 2.0 discovery endpoints, and strict FormRequest-backed schema validators.

Impact:Enables end-to-end headless AI agent management with strict validation and RBAC parity.

app/Mcp/Servers/PortfolioServer.php

class PortfolioServer extends Server

{

protected string $name = 'Humphrey Portfolio';

protected string $version = '1.0.0';

protected array $tools = [

ListBlogs::class,

GetBlog::class,

CreateBlog::class,

ListProjects::class,

GetProject::class,

CreateProject::class,

UpdateProject::class,

GetDashboardStats::class,

];

}

Discuss this snippet (app/Mcp/Servers/PortfolioServer.php)

Databaseapp/Services/HomepageCacheService.php

Multi-Layer Cache Invalidation with Model Observers

The Challenge

Aggregating complex relational datasets on every homepage visit causes high database CPU utilization and slow TTFB.

The Architectural Solution

Built HomepageCacheService with fine-grained TTLs coupled to Eloquent Observers that surgically flush keys upon create/update/delete events.

Impact:Maintains sub-40ms TTFB across the homepage with 0% risk of stale cache drifts.

Backendapp/Jobs/IncrementViewCount.php

Non-Blocking Asynchronous View Counting Queue

The Challenge

Synchronously incrementing view counters on high-traffic content triggers database row write-lock contention.

The Architectural Solution

Decoupled metrics tracking into an asynchronous queue job implementing ShouldQueue dispatched non-blockingly during requests.

Impact:Eliminated page view write bottlenecks, reducing project show endpoint latency by ~65%.

Databasedatabase/migrations/2025_12_11_000000_migrate_projects_to_real_estate_projects.php

Zero-Downtime Migration from Real Estate to Dual-Domain Schema

The Challenge

Repurposing the legacy real estate 'projects' table for a software developer portfolio while preserving legacy data and polymorphic image bindings.

The Architectural Solution

Executed atomic schema migration with dynamic table introspection, data copying into 'real_estate_projects', and batch updates on polymorphic morph types.

Impact:100% data integrity preservation with zero broken polymorphic image references.

Databasedatabase/migrations/2026_01_12_212839_add_composite_indexes_to_images_table.php

Polymorphic Composite Indexing for Media Relations

The Challenge

Media lookups across Project, Blog, and Deployment models were causing sequential scans as the images table expanded.

The Architectural Solution

Created composite indexes targeting general queries, primary image lookups, and sequence display ordering.

Impact:Lowered image relation query execution times down to 1.5ms (40-60% query speedup).

Backendapp/Services/ImageService.php

Automated Multi-Resolution Responsive Image Pipeline

The Challenge

High-resolution user-uploaded assets ballooning frontend payload sizes and harming Core Web Vitals.

The Architectural Solution

Engineered an image processing pipeline using Intervention Image that auto-resizes uploads into small (300px), medium (800px), and large (1200px) tiers.

Impact:Reduced bandwidth consumption by over 75% on card listings and mobile viewport displays.

Seoapp/Http/Controllers/OgImageController.php

On-Demand Dynamic OpenGraph Social Card Generator

The Challenge

Static social previews fail to capture dynamic blog titles, project tech tags, and author branding when shared across social channels.

The Architectural Solution

Implemented dynamic server-side image generation endpoints with disk-based caching responding to /og-image/{type}/{slug}.

Impact:100% automated, high-DPI branded social share cards for every single project and article.

Securityapp/Http/Controllers/Admin/ProjectController.php

PHP 8 Attribute-Driven Declarative RBAC Authorization

The Challenge

Imperative policy validation inside controller actions creates boilerplate and increases the risk of forgotten permission checks.

The Architectural Solution

Applied native PHP 8 #[Authorize] attributes to route handlers bound to centralized Laravel Policies and DB permission matrices.

Impact:Zero-boilerplate declarative security model preventing authorization bypasses.

// community_discussion

Architecture Feedback & Questions

Have thoughts, questions, or ideas regarding this system's architecture? Leave a comment below with your GitHub account.