Human-Centered AI: Supporting, Not Replacing, Frontend Developers
summary
AI acts as a pair programmer for React + TypeScript work, generating full refactors and tests in seconds but sometimes breaks real users when it covers only the happy path; a 500-test overgenerate and a multi-file 500-line change both required rollbacks. Workflow emphasizes lead AI by framing tasks, reviewing every line, and verifying with unit tests and screenshots. Uses model choice (Claude, Gemini), agent skills (/refactor, DDD verify), and a browser MCP that drives Playwright and compares to Figma — useful but not pixel perfect, so keep small dedicated component scope and verify on evidence.
AI-written summary · about
chapters (12)
- 0:00Introduction and AI journey
- 1:11From vending machine to teammate
- 3:39AI as a teammate in development
- 6:27Daily workflow with AI
- 8:59Teaching AI with skills and agents
- 10:04Improving PRs and team communication
- 12:14Hidden bugs and AI pitfalls
- 13:43Staying in control of AI
- 16:38Responsible pair programming with AI
- 18:25AI and fundamental programming
- 19:34Model Context Protocol demo
- 20:20Summary and Q&A
related talks
17mAI-Driven Frontend Development: Beyond Traditional
53mDid AI Kill Frontend?
40mHuman Centric Software Development Augmented by AI
08mAI in Front-End Dev: Your Creative Partner or Job Snatcher?
26mFrontend After the AI Shift
18mAI Can End Your Career, But Not in the Way You Think
37mThe Augmented Engineer: Evolving Sensible Defaults through Human-Centric AI
26mAI Agents as Your Co-Developer