The Democratization of Software Development
The developer job as we knew it is ending. Handoff chains collapse into teams of generalists who own requests end to end, directing AI agents to design, code, and test. What that means for the role.
alexop.dev
A Personal Blog from a simple web developer
Latest posts
Clean Code Is Sexy Again: Making Your Vue Project AI-Ready
My Vue MAD 2026 talk, written up. What an agent actually is, and the three things every Vue project needs to get more out of AI: context, feedback loops, and discoverability. The twist is that none of it is new.
How VS Code Copilot Chat Compacts Your Conversation
A reference on conversation compaction in VS Code Copilot's agent (now in microsoft/vscode under extensions/copilot): when it triggers, the budget math, what survives, the 8-section summary format, and the config keys. Traced from the source, with interactive diagrams.
Open Knowledge Format: I Already Do This, and Now It Has a Name
Google Cloud just shipped the Open Knowledge Format: a directory of Markdown files with YAML frontmatter as portable knowledge for AI agents. I already run this in every repo. Here is why having an actual format is the good part.
The Four Types of Memory for AI Agents (and How Claude Code Implements Each)
Working, semantic, procedural, episodic. The CoALA framework splits agent memory into four kinds. Here is what each one is, and how Claude Code actually implements them on disk.
Build Your Own Eval Harness from Scratch with Bun and claude -p
A hands-on tutorial: build a real, working eval harness for an AI agent in a single Bun file. Run the agent in a sandbox, grade it deterministically and with an LLM judge, vote across trials, and gate CI on the result.
I Rebuilt Cloudflare's AI Code Review in a 250-Line Workflow
Cloudflare runs a fleet of specialized AI reviewers across tens of thousands of merge requests. I didn't have GitLab CI or OpenCode, but I had Claude Code workflows. Here's how I rebuilt the idea as one script, and the one thing I changed.
How I Became an International Speaker
I was too scared to publish my first blog post and ended up on stage at Vue Amsterdam. Here's the honest path from zero to international speaker, visibility first.
Claude Code Workflows: Deterministic Multi-Agent Orchestration
Workflows let you script how Claude Code fans out across dozens of subagents, then synthesizes the results. Here's how they work, the primitives, and the small example I built to understand them.
How to do AFK Coding
A pipeline for shipping a 5-point ticket while you're away from the keyboard: spec with the human in the loop, slice into vertical tickets, run a Ralph loop with TDD per slice, refactor, then let an agent-browser do QA.
How to Write UI Components That Stay Flexible
Most components break under their second or third variant — props pile up, shells get copy-pasted. Here's how compound components (the pattern behind Reka UI and shadcn-vue) keep a Dialog flexible without flag soup.
A Modern Quality Pipeline and Testing Strategy for Frontend Projects
A short, framework-agnostic concept of what a modern quality pipeline and testing strategy look like for any JavaScript or TypeScript frontend project.
Exploratory QA with AI Agents: Building a Site-Agnostic Harness
A thin Bun runner that hands a coding agent one charter and lets it drive a real browser through an exploratory QA session. Works with Claude, Codex, or Copilot, and any browser CLI.
How to Use Claude Code as an AI QA Tester with Agent Browser
Claude Code and Agent Browser let you test your web app in a real browser without hardcoded selectors. Manual browser control, AI-driven exploration, and structured JSON output.
How to Catch Hydration Errors in Playwright Tests (Astro, Nuxt, React SSR)
A Playwright fixture that listens to the browser console for hydration mismatch warnings and fails your E2E tests when server and client HTML disagree.
App Screenshots: An AI Coding Agent Skill for Visual Documentation
Automate annotated screenshot documentation for any web app or live website using an AI coding agent skill. Works with Claude Code, Cursor, Windsurf, or any agent that supports custom skills.
The Software Factory: Why Your Team Will Never Work the Same Again
We already have everything we need to build software factories. Teams will change. The only variable is speed.
Building a Real-Time Todo App with Jazz and Vue 3
Build a real-time, offline-capable todo app with Jazz and Vue 3. Learn CoValues, drag-and-drop with fractional indexing, and shareable URLs. No backend needed.
How I Turned Claude Code's Thinking Indicator into a One Piece Adventure
Replace Claude Code's default spinner verbs with custom One Piece references using the spinnerVerbs config in settings.json.
How I Added Sound Effects to Claude Code with Hooks
Claude Code hooks let you run shell commands on lifecycle events. I wired up Age of Empires sound effects to session start, prompt submission, task completion, and context compaction.
Building a Walkthrough Skill for AI Coding Agents
How I built a skill that generates interactive codebase walkthroughs with clickable Mermaid diagrams—works with Claude Code, Amp, and any agent that supports the skills standard.
Claude Code Agent Teams: How Multiple Sessions Coordinate (2026)
Agent teams let multiple Claude Code sessions coordinate, communicate, and self-organize. Here's how they work, when to use them, and what they cost.
VMark: Hand-Drawn Annotations for Presentations
Learn how to add animated hand-drawn annotations to your presentations using VMark. A complete tutorial covering all annotation types, colors, and timing controls.
Spec-Driven Development with Claude Code in Action
A practical workflow for tackling large refactors with Claude Code using parallel research subagents, written specs, and the new task system for context-efficient implementation.
My Opinionated ESLint + Oxlint Setup for Vue Projects
A battle-tested linting configuration that catches real bugs, enforces clean architecture, and runs fast using Oxlint and ESLint together.
Next Level GitHub Copilot: Agents, Instructions & Automation in VS Code
Workshop covering the transformation from LLM to Agent, context engineering, AGENTS.md, subagents, and skills in VS Code Copilot.
What's New in VS Code Copilot: January 2026 Update
Major updates to VS Code Copilot including parallel subagent execution, a new skills system, deeper Claude integration with extended thinking, terminal improvements with kitty keyboard protocol, and instruction files that now work everywhere.
Presentation Mode: Turn Your Blog Posts into Slides
A complete demo of presentation mode with v-click animations and drawing annotations. Press P to see keyboard navigation, incremental reveals, and press D to draw on slides!
Stop Bloating Your CLAUDE.md: Progressive Disclosure for AI Coding Tools
AI coding tools are stateless—every session starts fresh. The solution isn't cramming everything into CLAUDE.md, but building a layered context system where learnings accumulate in docs and specialized agents load on-demand.
How I Built a Skill That Lets Me Talk to Claude's Conversation Memory
How I built a skill that lets Claude search its own conversation history, turning it into a persistent coding partner that remembers past solutions.
In Five Years, Developers Won't Write Code By Hand
Software development as translation work is dying. Software engineering—the strategic, architectural discipline—is more valuable than ever. The shift is already here.
Mutation Testing with AI Agents When Stryker Doesn't Work
When Stryker doesn't support your test stack, AI agents can execute mutation testing manually. A practical approach for Vitest browser mode and Playwright.
Why You Don't Need the Nuxt MCP When You Use Claude Code
Why I use custom research agents instead of MCP servers for AI-assisted development. Learn how llms.txt enables context-efficient documentation fetching with a practical Nuxt Content agent example.
Claude Code Customization Guide (2026): CLAUDE.md vs Skills vs Subagents
When should you use CLAUDE.md, a slash command, a skill, or a subagent in Claude Code? A decision guide with real examples for each, so you stop guessing which one fits the job.
How to Customize Your Claude Code Status Line
Learn how to display model name, context usage, and cost directly in your terminal while using Claude Code. A step-by-step guide to creating custom status line scripts.
Vue 3 Testing Pyramid: A Practical Guide with Vitest Browser Mode
Learn a practical testing strategy for Vue 3 applications using composable unit tests, Vitest browser mode integration tests, and visual regression testing.
Building an AI QA Engineer with Claude Code and Playwright MCP
Learn how to build an automated QA engineer using Claude Code and Playwright MCP that tests your web app like a real user, runs on every pull request, and writes detailed bug reports.
Vue Composables Style Guide: Lessons from VueUse's Codebase
A practical guide for writing production-quality Vue 3 composables, distilled from studying VueUse's patterns for SSR safety, cleanup, and TypeScript.
A Claude Code TDD Skill: Forcing Red-Green-Refactor Discipline
Build a custom TDD workflow with Claude Code using skills and subagents that enforce Red-Green-Refactor discipline for your Vue projects.
Claude Code Notifications: Get Alerts When Tasks Finish (Hooks Setup)
How to set up Claude Code notifications using hooks. Get desktop alerts when Claude finishes a task, needs your input, or requests permission, instead of watching the terminal.
Claude Code Slash Commands: A Complete Guide (2026)
Learn how to transform Claude Code from a chatbot into a deterministic engine using Slash Commands. This guide covers the technical setup and a complete 'Full Circle' workflow that automates your entire feature lifecycle.
Claude Code Explained (2026): MCP, Skills, Subagents, Hooks & Plugins
A practical guide to Claude Code's features: MCP, CLAUDE.md, slash commands, subagents, hooks, plugins, skills, and scheduled tasks. Updated April 2026 with deferred tool loading, worktree isolation, agent teams, and more.
How to Build a Claude Code Plugin: Skills, Agents & Commands
How I built a Claude Code plugin to generate skills, agents, commands, and more—and stopped copy-pasting boilerplate.
Building a Modular Monolith with Nuxt Layers: A Practical Guide
Learn how to build scalable applications using Nuxt Layers to enforce clean architecture boundaries without the complexity of microservices.
How to Handle API Calls in Pinia with The Elm Pattern
Learn how to handle API calls in Pinia using the Elm pattern for predictable, testable side effects. Includes complete examples with the Pokemon API.
How to Write Better Pinia Stores with the Elm Pattern
Learn how to combine The Elm Architecture (TEA) principles with Pinia's private store pattern for testable, framework-agnostic state management in Vue applications.
How to build Microfrontends with Module Federation and Vue
Build a Vue 3 microfrontend app with Module Federation. Clear decisions, working code, and a small reference project.
Why You Need Something Hard in Your Life
The biggest paradox in life: the hardest things are usually the ones that help you grow. Exploring why challenge and difficulty are essential for meaning and personal development.
What Is the Model Context Protocol (MCP)? How It Works
Learn how MCP (Model Context Protocol) standardizes AI tool integration, enabling LLMs to interact with external services, databases, and APIs through a universal protocol similar to USB-C for AI applications.
How VueUse Solves SSR Window Errors in Vue Applications
Discover how VueUse solves SSR issues with browser APIs and keeps your Vue composables safe from 'window is not defined' errors.