The AI-First Developer's Guide to Primitive Web Stacks and Claude Code

Published on July 2, 2025by Jared Likes

How choosing primitive technologies and systematic workflows unlocks the full potential of AI coding assistants

The web development landscape of 2025 is paradoxical. While frameworks grow increasingly complex, the smartest developers are moving in the opposite direction—toward primitive stacks that AI can actually understand and reliably generate code for. After months of experimenting with Claude Code, I've discovered that the secret to AI-powered development isn't better prompts or more sophisticated tools—it's choosing technologies that AI can master.

The Hidden Problem with Modern Web Development

Modern web development has a dirty secret: our tools have become too complex for reliable AI assistance. When you ask an AI to generate React code, you're rolling the dice on:

  • Hallucinated framework APIs that don't exist
  • Version compatibility nightmares across the ecosystem
  • Complex debugging when AI gets patterns wrong
  • Framework churn that makes training data obsolete

Meanwhile, teams struggle with:

  • Dependency hell and security vulnerabilities
  • Build tool complexity that requires dedicated DevOps knowledge
  • Framework lock-in that limits future technology choices
  • Performance overhead from abstractions nobody fully understands

The Primitive Stack Revolution

The solution isn't better frameworks—it's going back to fundamentals. I've moved to what I call a "primitive stack":

  • Frontend: Preact/Web Components + vanilla JavaScript
  • Backend: Deno + Oak framework
  • Database: MongoDB with direct queries (no ORM)
  • Deployment: Single binary compilation

This isn't about being a purist or avoiding modern conveniences. It's about choosing technologies that AI can reliably understand and generate code for.

Why AI Loves Primitive Technologies

Web standards are AI's sweet spot:

  • Web APIs are thoroughly documented in training data
  • Standards evolve slowly and maintain backward compatibility
  • AI can reliably generate working vanilla JavaScript every time
  • No framework-specific patterns to hallucinate incorrectly

Debugging becomes trivial:

  • When AI generates a bug, you can actually understand and fix it
  • Stack traces are readable without framework-specific knowledge
  • No need to debug AI's misunderstanding of complex abstractions

Future-proof against AI model changes:

  • Web standards will be understood by any future AI model
  • Framework-specific knowledge becomes obsolete as frameworks evolve
  • Your codebase remains comprehensible to new AI tools

Building a Systematic Workflow with Claude Code

The key to leveraging AI effectively isn't just choosing the right stack—it's building systematic workflows that prevent the common pitfalls of AI-assisted development.

Essential Claude Code Commands

I've developed a comprehensive set of custom commands for my .claude configuration:

# Development Workflow Commands
/start-project:
  description: "Initialize new project with full workflow setup"
  context: |
    Set up project structure including:
    - Requirements gathering template
    - Design phase checklist
    - Architecture decision records (ADR) template
    - CI/CD pipeline configuration
    - Testing strategy outline

/ai-code-review:
  description: "Review AI-generated code for primitive stack best practices"
  context: |
    When AI generates code, verify:
    - Uses web standards instead of framework-specific patterns
    - Implements manual solutions over library dependencies
    - Follows vanilla JavaScript best practices
    - Maintains readability for future AI iteration

/spiral-check:
  description: "Detect if we're stuck in unproductive loops"
  context: |
    Analyze recent activity for:
    - Repeated file modifications without progress
    - Increasing complexity without clear benefits  
    - Circular refactoring patterns
    - Suggest simplified approaches or context reset

/dependency-audit:
  description: "Audit dependencies for complexity and necessity"
  context: |
    Review current dependencies for:
    - Dependency tree depth and complexity
    - Opportunities to replace with web standards
    - Unused or redundant packages
    - Suggest minimal alternatives or manual implementations

Phase-Based Development Structure

Every project follows a clear structure that Claude Code can understand and execute:

  1. Discovery & Planning - Requirements, user stories, constraints
  2. Design Phase - UX wireframes, UI mockups, architecture diagrams
  3. Development Setup - Project scaffolding, CI/CD, environment config
  4. Implementation - Feature development with iterative reviews
  5. Testing & Deployment - Automated testing, staging, production
  6. Maintenance - Monitoring, updates, documentation

Each phase has specific deliverables and success criteria, making it easy for Claude Code to provide contextually relevant assistance.

Preventing AI Development Pitfalls

The biggest risk with AI coding assistants is getting stuck in "spiral scenarios"—unproductive loops where the AI repeatedly modifies code without making real progress. My workflow includes systematic checks:

Red flags to watch for:

  • AI repeatedly modifying the same files without clear progress
  • Responses becoming increasingly generic or repetitive
  • Solutions becoming overly complex for simple problems
  • Getting stuck in endless refactoring loops

Recovery strategies:

  • Use structured prompts with clear context about current state
  • Break large tasks into smaller, verifiable chunks
  • Reset context with fresh summaries when stuck
  • Set specific, measurable success criteria before beginning

Frontend Strategy: Primitive vs Framework

After analyzing the 2025 frontend landscape, here's how different approaches align with AI-first development:

Perfect for AI: Web Components + Vanilla JS

Pros:

  • Zero framework dependencies and vendor lock-in
  • Excellent performance with native browser functionality
  • Future-proof built on web standards
  • AI can reliably generate and debug code

Cons:

  • Higher development overhead for complex interactions
  • Limited SSR support
  • Requires comfort with web fundamentals

Excellent Backup: Preact

Pros:

  • React API with 90% smaller bundle size
  • Access to React ecosystem without the bulk
  • AI can generate React-like code reliably
  • Easy migration path from React

Cons:

  • Still some framework-specific patterns
  • Smaller plugin ecosystem than React

AI-Friendly Alternative: Svelte

Pros:

  • Compiles to optimized vanilla JavaScript
  • No virtual DOM overhead
  • Clean, minimal syntax
  • Final output is just standard web code

Cons:

  • Compile-time complexity
  • Smaller ecosystem than established frameworks

Avoid for AI Development: React/Angular

While popular, these frameworks introduce too much complexity for reliable AI generation:

  • Large ecosystems mean many dependencies to manage
  • Complex state management patterns AI often gets wrong
  • Framework-specific debugging knowledge required
  • Rapid evolution makes AI training data stale

The AI Development Loop

My optimized development process leverages AI strengths while avoiding common pitfalls:

  1. Define requirements in plain English - AI understands intent better than technical specs
  2. Generate primitive code - Let AI create vanilla implementations using web standards
  3. Iterate with systematic reviews - Use /ai-code-review to ensure primitive principles
  4. Document patterns - Build context for future AI iterations
  5. Refactor when complex - Keep code simple and AI-friendly

Example: AI-Generated Web Component

Instead of asking AI to generate a complex React component, I prompt for a simple Web Component:

"Create a Web Component for a user profile card that:
- Uses Shadow DOM for encapsulation
- Accepts name, avatar, and role as attributes
- Handles click events with custom events
- Uses CSS custom properties for theming
- Follows web component best practices"

The result is reliable, debuggable code that AI can consistently generate and modify.

Managing Evolution: Living Documentation

Static documentation becomes stale quickly. I've built a living system where documentation evolves alongside code:

/update-docs:
  description: "Review and update project documentation based on recent changes"
  context: |
    Analyze recent commits and decisions to update:
    - Architecture diagrams and current-state docs
    - Process documentation that may be outdated
    - Best practices based on new learnings
    - Tech debt documentation

/retrospective:
  description: "Conduct development retrospective and capture learnings"
  context: |
    Review recent development cycle for:
    - What worked well (add to best practices)
    - What didn't work (update anti-patterns)
    - Process improvements needed
    - Documentation gaps identified

This ensures your practices evolve based on real project experience rather than becoming rigid dogma.

The Results

This AI-first, primitive stack approach has transformed my development process:

Faster Development:

  • AI generates reliable code on first attempt
  • Less time debugging framework-specific issues
  • Simpler deployment and dependency management

Better Code Quality:

  • Explicit, understandable implementations
  • Fewer hidden dependencies and side effects
  • Performance optimizations are visible and controllable

Future-Proof Architecture:

  • Code remains comprehensible to future AI models
  • No framework lock-in or migration pressure
  • Built on stable web standards rather than moving targets

Reduced Complexity:

  • Single binary deployments
  • Direct database access without ORM complexity
  • Clear separation of concerns

Getting Started

  1. Choose your primitive stack - Start with Deno + Oak + MongoDB, or similar minimal technologies
  2. Set up Claude Code with custom commands - Use the configurations provided above
  3. Practice AI-first development - Focus on clear requirements and web standards
  4. Build systematic workflows - Implement phase-based development and spiral detection
  5. Iterate and improve - Let your processes evolve based on what works

The Future of AI-Assisted Development

The web development industry is at an inflection point. AI coding assistants are becoming exponentially more capable, but only for codebases they can understand. Frameworks add layers of abstraction that make AI assistance unreliable, while primitive approaches unlock AI's full potential.

The developers who recognize this shift early—who choose simplicity over complexity, standards over frameworks, and systematic workflows over ad-hoc development—will have an enormous competitive advantage.

The question isn't whether AI will transform software development. It's whether you'll choose technologies that let AI help you, or fight against AI limitations while your competitors race ahead.

Conclusion

The primitive stack isn't about rejecting progress—it's about choosing the right abstractions. By building on web standards instead of framework abstractions, using systematic workflows instead of ad-hoc development, and leveraging AI for what it does best, we can build better software faster than ever before.

The future belongs to developers who understand that the most sophisticated approach is often the simplest one. Start with the primitives, add AI assistance, and watch your productivity soar.

This workflow continues to evolve as both AI capabilities and web standards advance. The key is maintaining the systematic approach while staying flexible enough to incorporate new tools and techniques as they become available.

Claude Artifact