Unlocking Superpowers in Web App Development with AI: A Deep Dive into an AI Coding Workflow

In recent weeks, I’ve been experimenting with an AI-driven coding workflow using Cloud Code and GitHub to build a new web app. The experience has been nothing short of transformative, unlocking new “superpowers” in how I approach software development. In this post, I’ll share the workflow, why it matters, and practical insights from each phase: planning, creating, testing, and deploying.

The AI-Powered Software Development Workflow: An Overview

At a high level, my workflow revolves around integrating AI as a coding assistant within a traditional software development lifecycle, blending human oversight with AI efficiency. Here’s the core loop:

1. Create GitHub Issues: Define all the work to be done on the app as GitHub issues.
2. Slash Commands in Cloud Code: Use detailed slash commands with instructions to process each issue.
3. Planning with Scratch Pads: Break down large issues into smaller, atomic tasks using “scratch pads” where the AI plans its work.
4. Code Generation: After planning, the AI writes the necessary code.
5. Testing: The AI runs tests in two ways — through the test suite and using Puppeteer to interact with the UI in a browser.
6. Commit and Pull Request: It then commits the work and opens a pull request for review.
7. Review: I review the pull requests, sometimes assisted by another AI command designed for PR reviews.
8. Continuous Integration: GitHub Actions automatically run tests and linters on every commit to ensure code quality.
9. Context Reset: After merging, I clear the context to start fresh on the next issue.

This cycle essentially mirrors the classic software development life cycle phases: Plan, Create, Test, and Deploy.

Why Adopt an AI-Driven Workflow?

You might wonder, “If AI can write code, why maintain a structured workflow?” The answer lies in the complexity of software development beyond just coding. Writing code is just one piece of the puzzle — planning, testing, reviewing, and deploying are equally critical.

This workflow borrows heavily from GitHub Flow, a proven strategy designed for small, agile teams — or in this case, a single human paired with an AI coding assistant. By adopting this well-known cycle, you bring structure and discipline that maximize the AI’s usefulness while keeping you in control.

Phase 1: Planning with Detailed GitHub Issues

The journey begins by creating and refining GitHub issues. Initially, I started with a rough requirements document generated from a dictation session and refined with AI assistance. From there, Claude Code created around 30-40 issues automatically.

However, I quickly realized that jumping straight from AI-generated issues to coding was overly optimistic. The key lesson: granularity and specificity matter. The more atomic and tightly scoped each issue is, the better the AI performs.

My role shifted back to that of an engineering manager—writing detailed specs, reviewing AI-generated code, giving feedback, and sometimes scrapping work that didn’t meet expectations. If you want a taste of engineering management while coding, this process offers it in spades.

Phase 2: Creating a Robust Foundation

Before rapid development can begin, you need a solid foundation:

• Set up a GitHub repository with your app.
• Implement a comprehensive test suite (Rails’ MVC framework is great for modularity and testing).
• Configure continuous integration via GitHub Actions so tests run automatically on every commit.
• Use Puppeteer for UI testing, enabling the AI to interact with the app in a browser to verify UI changes and functionality.

Watching Cloud Code “click” around a browser to test its work is surprisingly satisfying and adds confidence that UI changes behave as expected.

Phase 3: Planning Work with Custom Slash Commands

To orchestrate AI work on each issue, I created a custom slash command in Cloud Code. This command:

• Takes an issue number as input.
• Retrieves the issue details using the GitHub CLI.
• Searches the scratch pads and previous PRs for related work.
• Uses Anthropic’s “think harder” prompt to encourage thorough planning.
• Breaks the issue into manageable tasks, writing the plan into a scratch pad linked to the issue.

This step is critical — planning is the most important phase to direct the AI effectively.

Phase 4: Create, Test, and Deploy with Human Oversight

After planning, Claude Code writes the code and commits changes. A major question is whether to allow AI to commit directly or handle commits yourself. Inspired by insights from AI coding advocate Thomas Tacic, I lean toward trusting AI commits but always review pull requests carefully.

Testing plays a vital role here. A strong test suite gives me confidence that AI can modify features without breaking existing functionality. I don’t require 100% coverage, but high confidence is essential.

For deployment, I use Render, which automatically deploys from GitHub’s main branch. Merging a pull request equates roughly to deploying to production.

Reviewing and Iterating

Pull requests are where you, the human, really shine:

• Review AI’s code.
• Leave comments and request changes.
• Use a separate slash command to have Claude review PRs in the style of coding luminaries like Sandy Metz, uncovering maintainability improvements you might miss.

Sometimes, after AI writes and reviews code, passes tests, and I approve, I merge the PR with confidence.

Managing Context and Next Steps

After merging, I run a /clear command to wipe the AI’s context, forcing it to start fresh on each new issue. This keeps the AI focused and reduces token usage, as each issue should be self-contained with all necessary information.

Additional Insights: GitHub Actions, Work Trees, and Parallelism

• Claude in GitHub Actions: While it’s possible to tag Claude directly in GitHub for small fixes, I prefer using Cloud Code in the console for major work to avoid unexpected API billing and gain better control.

• Work Trees for Parallel Agents: You can run multiple Claude instances in parallel using Git work trees, akin to multitabling in poker. However, in early-stage projects with lots of iterative work and shared code, this can be clunky and requires reauthorizing permissions frequently. For now, a single AI instance suffices.

Final Thoughts

This AI-powered workflow is not only about automating code generation but about integrating AI into a structured software development process that balances automation with human judgment. Planning remains my most involved phase, while creating, testing, and deploying can be largely delegated.

If you’re interested in AI-assisted coding, adopting a workflow like this can make the process smoother and more productive. And if you want to dive deeper, check out my companion video on Claude Code pro tips.

Harnessing AI in coding isn’t just a futuristic idea—it’s happening now. With the right workflow, tools, and mindset, you can unlock a new level of productivity and creativity in software development. Give it a try and experience the superpowers for yourself!