book

Beyond Vibe Coding

by Addy Osmani

August 2025

Intermediate to advanced

254 pages

7h 51m

English

O'Reilly Media, Inc.

Book available

Read now

Unlock full access

Who This Book Is ForWhat to ExpectConventions Used in This BookO’Reilly Online LearningHow to Contact Us
The AI Coding Spectrum: From Vibe Coding to AI-Assisted EngineeringThe Vibe-Coding Approach: Code by ConversationThe AI-Assisted Engineering Approach: Structure with an AI PartnerDifferent Mindsets, Different ExpectationsFinding Your Place on the SpectrumBeyond Lines of Code: Programming with IntentThe Rise of the Prompt: From Instructions to DescriptionsHow It Works: The Iterative Cycle and AI’s Role in Code GenerationProductivity, Accessibility, and the Changing Nature of ProgrammingA Glimpse of the Tools: The Emerging EcosystemVSCode + Copilot: Microsoft’s Integrated AI Development PlatformVSCode + Cline: The Open Source Autonomous Coding AgentCursor: The AI-Driven Code EditorWindsurf: An AI-Powered IDE with Full Codebase IndexingAI Models: The Landscape for Code GenerationUnderstanding Model CategoriesChoosing the Right Model for Your TaskPractical Tips for Any ModelMajor ModelsGoogle Gemini: The Multimodal Coding PowerhouseClaude: The Reasoning VirtuosoChatGPT: The Versatile Coding CompanionChoosing the Right Model for Your NeedsThe Benefits and Limitations of Vibe Coding: A Nuanced ViewIdeal Use Cases for Vibe CodingWhere AI Still StrugglesSummary and Next Steps
Prompt Engineering FundamentalsSpecificity and Clarity: Writing Prompts That DeliverIterative Refinement: The Feedback Loop with the AIComparing Two PromptsPoor promptImproved promptPrompting Techniques: A Toolbox for Effective CommunicationZero-Shot PromptingOne-Shot and Few-Shot PromptingChain-of-Thought PromptingRole PromptingContextual PromptingMetapromptingSelf-Consistency (Multiple Outputs and Majority Voting)ReAct (Reason + Act) PromptingAdvanced Prompting: Combining Techniques and Handling ComplexityKnow the Model’s LimitsStateful Conversation Versus One-Shot PromptingCommon Prompt Antipatterns and How to Avoid ThemSummary and Next Steps
How Developers Are Actually Using AICommon Failure PatternsWhat Actually Works: Practical Workflow PatternsThe Golden Rules of Vibe Coding0. Summary and Next Steps
Senior Engineers and Developers: Leverage Your Experience with AIBe the Architect and the Editor in ChiefUse AI as a Force Multiplier for Big InitiativesMentor and Set StandardsContinue to Cultivate Domain Mastery and ForesightHone Your Soft Skills and LeadershipMidlevel Engineers: Adapt and SpecializeLearn to Manage Systems Integration and BoundariesBuild Your Domain ExpertiseMaster Performance Optimization and DevOpsFocus on Code Review and Quality AssuranceLearn Systems ThinkingBe Adaptable—and Never Stop LearningGet Good at Cross-Functional CommunicationLearn System Design and ArchitectureUse AI!Venture into UI and UX DesignJunior Developers: Thrive Alongside AILearn the Fundamentals—Don’t Skip the “Why”Practice Problem Solving and Debugging Without the AI Safety NetFocus on Testing and VerificationBuild an Eye for MaintainabilityDevelop Your Prompting and Tooling Skills (Wisely)Seek Feedback and MentorshipCommunicate and CollaborateShift Your Mindset: From Consuming to CreatingSummary and Next Steps
From Intent to Implementation: Understanding the AI’s InterpretationThe “Majority” Problem: Most Common Doesn’t Mean Most AppropriateCode Readability and Structure: Patterns and Potential IssuesDebugging Strategies: Finding and Fixing ErrorsRefactoring for Maintainability: Making AI Code Your CodeThe Importance of Testing: Unit, Integration, and End to EndSummary and Next Steps
Rapid Prototyping with AI AssistantsAI Prototyping ToolsFrom Concept to Prototype: Iterative RefinementEvolving a Prototype Toward ProductionAddressing Challenges in AI PrototypingSummary and Next Steps
Setting Up the Project: Scaffolding with AIFrontend Development Patterns with AIBackend/API Development Patterns with AIDatabase Design and IntegrationUsing an ORMDatabase QueriesChecking AI-Generated QueriesFull Stack Integration: Marrying Frontend and BackendAligning Frontend and Backend ContractsReal-Time Collaboration with AITesting and Validation for AI-Generated Web ApplicationsExamples of Successful AI-Built Web ProjectsSummary and Next Steps

Common Security Vulnerabilities in AI-Generated CodeImproper Authentication and AuthorizationPackage Management IssuesSecurity AuditsLeverage Automated Security ScannersUse a Separate AI as a ReviewerPerform a Human Code Review with a Security ChecklistPenetration Testing and FuzzingAdd Security-Focused Unit TestsProvide Updates to Compensate for Training CutoffsOptimize Your Logging PracticesUse Updated Models or Tools with a Security FocusPay Attention to Warnings in ContextSlow DownBuilding Effective Testing Frameworks for AI-Generated SystemsPerformance OptimizationEnsuring Maintainability in AI-Accelerated CodebasesWhile PromptingWorking with Code OutputFollow-UpCode Review StrategiesBest Practices for Reliable DeploymentBefore and During DeploymentOngoing Best PracticesSummary and Next Steps
Intellectual Property ConsiderationsWhat to Do If You Get Suspicious OutputGray AreasTransparency and AttributionBias and FairnessGolden Rules for Responsible AI UseSummary and Next Steps
From Copilots to Autonomous Agents: What Are Background Coding Agents?How Do Autonomous Coding Agents Work?How Do Background Agents Compare to In-IDE AI Assistants?Combining Multiple AI Models to Maximize StrengthsDifferentiate Models by Task TypeUse an Orchestration SystemHuman-AI Hybrid TeamsMajor Players in Autonomous Coding AgentsChallenges and LimitationsBest Practices for Using AI Coding Agents EffectivelyStrategically Select the Tasks Autonomous Agents Are Going to ImplementLeverage Agent-Specific Planning and Oversight FeaturesManage Concurrent Agent OperationsEvolve Your Team Practices to Integrate AgentsBuild Feedback Loops with Autonomous SystemsSummary and Next Steps
AI in Testing, Debugging, and MaintenanceAutomated Test GenerationIntelligent DebuggingPredictive Maintenance and RefactoringAI-Driven Design and User Experience PersonalizationGenerative Design ToolsAI for UX ResearchPersonalized User ExperiencesThe Evolution of Project Management with AIHow Autonomous Agents Could Change Software EngineeringThe Future of Programming Languages: Natural-Language-Driven Development?How Vibe Coding Is Reshaping the IndustrySummary and Next Steps

Content preview from Beyond Vibe Coding

Chapter 7. Building Web Applications with AI

This chapter shifts the focus from prompting quick prototypes to developing complete web applications using AI assistance. Web apps typically involve a frontend (often written in frameworks like React, Angular, or Vue), a backend (APIs, databases, servers), and glue to connect everything. Vibe coding can accelerate each of these layers.

I’ll walk you through an end-to-end workflow for building a web application with an AI pair programmer, including:

Setting up the project and its scaffolding
Coding the frontend UI
Implementing backend logic
Integrating with a database
Testing and validating the whole stack

Along the way, I’ll highlight AI development patterns for frontends (for example, having AI generate React or Vue components from descriptions) and backends (writing routes, business logic, and database queries through natural-language prompts). I’ll also cover how to optimize collaboration between humans and AI in a full stack project, ensuring that each side contributes its strongest work. By the end of this chapter, you should have a clear roadmap for using AI not just for isolated coding tasks but for managing entire web development workflow efficiently and effectively.

Setting Up the Project: Scaffolding with AI

Every web application starts with some scaffolding—the initial setup of build tools, file structure, dependencies, etc. AI can automate the creation of a lot of the boilerplate. Modern web frameworks often ...