Posts
All the articles I've posted.
-
Claude Code's Five-Layer Architecture Explained: How MCP, Skills, Agent, Subagents, and Agent Teams Work Together
Anthropic officially describes Claude Code as a five-layer architecture: MCP for connectivity, Skills for task knowledge, Agent as the main worker, Subagents for parallel isolation, and Agent Teams for coordination. This post breaks down each layer's role and collaboration patterns, with a real-world example from my blog's blog-preflight Skill showing three layers working together.
-
Frontman Deep Dive: What an AI Agent Can Do When It Sees Your Code from the Browser, Paired with Frontend Skills
Cursor and Claude Code both start from source code, but a frontend engineer's real work happens in the browser—the actual color on hover, the real DOM after SSR, the re-render triggered by the third useState. Frontman works in the opposite direction: from the browser back to the code. This post breaks down its architecture and combines it with Anthropic's frontend-design Skill and others into a complete frontend AI workflow.
-
Claude Code Skills in Practice: Building a Reusable Cross-Project Skill from Scratch
Pull your repetitive playbooks, checklists, and multi-step workflows out of CLAUDE.md and turn them into Skills. Using a "pre-publish blog check" as the running example, this post covers the SKILL.md structure, every frontmatter field, context fork isolation, the boundaries with Slash Commands and Sub Agents, plus debugging and sharing.
-
GPT-5.5 vs Claude Opus 4.6 vs Gemini 2.5 Pro: Coding Capability Comparison 2026
A 2026 head-to-head coding comparison of the leading large language models: benchmark numbers, pricing, and real-world coding performance for GPT-5.5, Claude Opus 4.6, and Gemini 2.5 Pro — to help you pick the right model for everyday development.
-
Choosing a React Chart Library: Recharts vs. ECharts vs. Nivo vs. Lightweight Charts
An in-depth comparison of the leading React chart libraries in 2026—Recharts, Apache ECharts, Nivo, and TradingView Lightweight Charts—across three core scenarios (candlestick charts, bar charts, treemaps), with recommendations based on performance, bundle size, and ease of use.
-
The 2026 AI Coding Tools Scorecard: An Honest Review of Claude Code, Cursor, Copilot, Windsurf, and Gemini CLI
An in-depth comparison of the leading AI coding tools in 2026: Claude Code, Cursor, GitHub Copilot, Windsurf, Trae, Cline, Gemini CLI, and Aider — covering real-world data, current pricing, and use cases to help developers pick the right tool.
-
AI Agent Success Rates Jumped from 12% to 66%: How Frontend Developers Should Prepare for the Era of 'Usable' Agents
Stanford's 2026 AI Index report shows AI agent success rates on real computer tasks jumped from 12% to 66% in a single year—just 6 percentage points shy of the human baseline. Here's what that means for frontend developers and how to adjust your workflow to take advantage of this inflection point.
-
AI Toolchain Supply Chain Security: A Full Post-Mortem of the Vercel Breach
A post-mortem of the April 2026 Vercel breach and its full attack chain: Roblox cheat script → Lumma Stealer → over-permissive OAuth → SSO lateral movement → leaked environment variables. We break down the security blind spot behind each link and the defenses developers should put in place.