<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Wasp</title>
    <description>The latest articles on DEV Community by Wasp (@wasp).</description>
    <link>https://dev.to/wasp</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Forganization%2Fprofile_image%2F3369%2Fc86918f8-76a9-4b01-accf-cc257f9ee56f.png</url>
      <title>DEV Community: Wasp</title>
      <link>https://dev.to/wasp</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/wasp"/>
    <language>en</language>
    <item>
      <title>What's the Best Way to Vibe Code a SaaS in 2026?</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Thu, 26 Mar 2026 09:05:13 +0000</pubDate>
      <link>https://dev.to/wasp/whats-the-best-way-to-vibe-code-a-saas-in-2026-9fh</link>
      <guid>https://dev.to/wasp/whats-the-best-way-to-vibe-code-a-saas-in-2026-9fh</guid>
      <description>&lt;p&gt;You've probably seen the tweets, the YouTube tutorials, and the "I built a SaaS in 24 hours with AI" posts. But if you've actually tried to vibe code a SaaS, you know the reality is &lt;em&gt;much&lt;/em&gt; messier than that.&lt;/p&gt;

&lt;p&gt;Luckily, there are a bunch of tools, SaaS boilerplate starters, and workflows that you can use to build a profitable (side) business with, as long as you know how to apply them correctly. &lt;/p&gt;

&lt;p&gt;So let's take a look at what's out there, and what really works.&lt;/p&gt;

&lt;h2&gt;
  
  
  TL;DR
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;AI-native platforms&lt;/strong&gt; (Replit, Lovable, Bolt) are great for prototyping but hit a ceiling as complexity grows. Code is coupled to their infra, and it quickly becomes expensive and difficult to maintain.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;AI coding tools&lt;/strong&gt; (Claude Code, Cursor, Codex) give you great code and full control, but they need the right foundation and you'll need some fundamental understanding of the underlying tools to work well with them.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;The winning combo:&lt;/strong&gt; Claude Code paired with a well-structured SaaS boilerplate like Open SaaS is the best way to vibe code a SaaS in 2026, giving you coherent code generation, along with better control as your app grows.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Two key techniques&lt;/strong&gt; for effective vibe coding: (1) LLM-friendly docs (llms.txt and beyond), (2) full-stack debugging visibility.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  The Vibe Coding Landscape in 2026
&lt;/h2&gt;

&lt;p&gt;AI-assisted coding tools come in different flavors, and understanding their differences is key to picking the right approach.&lt;/p&gt;

&lt;p&gt;In the table below, we quickly compare the two approaches. In the sections below that, we go into more detail about each approach.&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;&lt;/th&gt;
&lt;th&gt;AI-Native Platforms&lt;/th&gt;
&lt;th&gt;AI Coding Tools&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Examples&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Replit, Lovable, Bolt.new&lt;/td&gt;
&lt;td&gt;Claude Code, Cursor, Codex&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Setup&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Zero-config, browser-based&lt;/td&gt;
&lt;td&gt;Local install, terminal/code-focused&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Best for&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Quick prototypes and demos&lt;/td&gt;
&lt;td&gt;Production apps and SaaS businesses&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Code control&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Limited — AI makes structural decisions&lt;/td&gt;
&lt;td&gt;Full — you own and control everything&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Vendor lock-in&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;High — coupled to platform infra&lt;/td&gt;
&lt;td&gt;None — works with any stack&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Scalability&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Scalability degrades as complexity grows&lt;/td&gt;
&lt;td&gt;Scales with your codebase. No limitations.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Deployment&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Platform-hosted (limited options)&lt;/td&gt;
&lt;td&gt;Deploy anywhere (Railway, Fly.io, VPS)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Cost at scale&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Monthly fee + additional costs for debugging, storage, hosting, etc.&lt;/td&gt;
&lt;td&gt;Cheaper — monthly fee + choose your favorite hosting solution&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h3&gt;
  
  
  AI-Native Platforms
&lt;/h3&gt;

&lt;p&gt;Tools like Replit Agent, Lovable, Bolt.new, and v0  aim for a "zero-config", purer "vibe coding" approach, where you describe what you want and get a working app. They aim to remove setup, config, and having to touch the code and/or terminal as much as possible. They're impressive for demos and fast prototyping.&lt;/p&gt;

&lt;p&gt;The catch here is that most of these apps are then locked-in to their hosting, auth, and storage solutions. This isn't always bad, but things can easily get complicated and expensive as your app grows:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;The "70% problem"&lt;/strong&gt;: these tools get you roughly 70% of the way to a working product. The last 30% — auth hardening, error handling, performance, deployment config — &lt;a href="https://blog.codeitbro.com/bolt-new-review/" rel="noopener noreferrer"&gt;requires significant manual effort&lt;/a&gt;. One estimate puts the cost of making Bolt.new output production-ready at &lt;a href="https://trickle.so/blog/bolt-new-review" rel="noopener noreferrer"&gt;$5,000-$20,000&lt;/a&gt; in professional dev work.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Infrastructure coupling&lt;/strong&gt;: the code you export is tightly coupled to a specific service stack. Lovable, for example, generates code &lt;a href="https://www.ml6.eu/en/blog/the-anatomy-of-a-lovable-app-and-its-boundaries-in-enterprise-software" rel="noopener noreferrer"&gt;deeply wired into Supabase&lt;/a&gt;, a separate service for auth, storage, realtime, edge functions, etc. Leaving Lovable/Supabase means rewriting all of those integrations. Replit similarly relies on its default &lt;a href="https://docs.replit.com/replit-workspace/replit-auth" rel="noopener noreferrer"&gt;Auth&lt;/a&gt;, &lt;a href="https://docs.replit.com/cloud-services/storage-and-databases/object-storage" rel="noopener noreferrer"&gt;Storage&lt;/a&gt;, and &lt;a href="https://docs.replit.com/cloud-services/storage-and-databases/sql-database" rel="noopener noreferrer"&gt;database options&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Code quality degrades at scale&lt;/strong&gt;: Bolt.new projects with 15-20+ components experience &lt;a href="https://www.p0stman.com/guides/bolt-limitations/" rel="noopener noreferrer"&gt;severe AI context degradation&lt;/a&gt; — duplicated code, forgotten patterns, and inconsistencies. Replit Agent has been flagged for generating &lt;a href="https://www.dronahq.com/replit-ai-review/" rel="noopener noreferrer"&gt;"non-idiomatic or messy" code&lt;/a&gt; that becomes harder to maintain as projects grow. Multiple developers report spending &lt;a href="https://www.trustpilot.com/review/bolt.new" rel="noopener noreferrer"&gt;$1,000+ in tokens&lt;/a&gt; just debugging AI-generated bugs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Limited architectural control&lt;/strong&gt;: the AI makes structural decisions for you, and those decisions compound. Data models get rigid, logic gets tightly coupled, and by the time you want to refactor, you're looking at a near-rewrite anyway.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In the end, the most common feedback from users of these tools is that they allow you to move fast and to easily build initial prototypes, but &lt;a href="https://www.reddit.com/r/replit/comments/1rlndcc/once_your_mvp_is_working_in_lovablev0replit_do/" rel="noopener noreferrer"&gt;maintainence and upgrades quickly become complex and expensive&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;To solve this, working on code locally, instead of a platform, is the first step.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI Coding Tools
&lt;/h3&gt;

&lt;p&gt;Tools like Claude Code, Cursor, GitHub Copilot, and Codex work directly with your local files, and are better at generating production-ready code that you control.&lt;/p&gt;

&lt;p&gt;The pros here are: full control, no lock-in, works with any stack, and the added bonus is that it will be cheaper. You can version it, test it, deploy it anywhere, and switch tools whenever you want.&lt;/p&gt;

&lt;p&gt;But &lt;strong&gt;these tools require a bit more work&lt;/strong&gt; to get the most out of them. You'll have to be comfortable using the terminal, install a few more underlying tools, and its good to have a general understanding of the fundamentals when working with them. But, luckily, these tools can help you each step of the way, and if you set things up right (which we will show you how to do in this article) you can go all the way with them.&lt;/p&gt;

&lt;p&gt;In comparison to the AI-native platforms, if you're serious about building something substantial &lt;a href="https://www.reddit.com/answers/727395fa-476c-4817-895b-cf1c5937ec83/?q=pros+and+cons+of+claude+code&amp;amp;source=ANSWERS" rel="noopener noreferrer"&gt;these tools give better results at cheaper prices&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;We'll use Claude Code as the driving example throughout this post, but the same principles apply to Cursor, Codex, and others.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Winning Combo: Claude Code + SaaS Boilerplate
&lt;/h3&gt;

&lt;p&gt;Most of the tedious parts of building a SaaS are routine, boilerplate tasks like setting up authentication, payments, email sending, file uploads, admin dashboard, etc. These are the things that are time-consuming to set up, aren't very creative or interesting, but are 100% necessary for a functional SaaS.&lt;/p&gt;

&lt;p&gt;Luckily, tons of SaaS boilerplate starter kits exist, giving you a solid foundation to build your SaaS on top of. They provide all the necessary integrations, plumbing, and glue code, along with some nice extras, so you can just focus on building the fun part of your app.&lt;/p&gt;

&lt;p&gt;A well-structured boilerplate has some key benefits: it allows you to start working on the actual business logic of your SaaS from day one. It also gives the AI patterns, structure, and conventions to follow, making it easier for tools like Claude Code to generate clean, consistent code. &lt;/p&gt;

&lt;p&gt;&lt;em&gt;It's like giving a skilled carpenter a well-organized workshop instead of an empty shed. The tools are there, the materials are laid out, and there's a clear plan to follow.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;You keep the full control, but you skip the part where you (or your AI) have to make a hundred decisions about project structure, auth patterns, payment integration, and deployment config. That's all solved for you already by the starter kit.&lt;/p&gt;

&lt;p&gt;But, because so many boilerplate starters exist, choosing the right one can be a pain.&lt;/p&gt;

&lt;h2&gt;
  
  
  Choosing Your SaaS Boilerplate
&lt;/h2&gt;

&lt;p&gt;There's no shortage of SaaS boilerplates out there. The real question isn't just "which one has the best features?", it's which one sets you (and your AI coding tool) up for long-term success. A few factors matter more than you'd think: cost, deployment flexibility, community support, and how well the codebase structure plays with AI.&lt;/p&gt;

&lt;p&gt;In the table below, we quickly compare some popular, battle-tested starters. In the sections below that, we go into more detail about each of them.&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;&lt;/th&gt;
&lt;th&gt;Paid Boilerplates (ShipFast, Supastarter)&lt;/th&gt;
&lt;th&gt;Open SaaS&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Price&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;$250-$800+&lt;/td&gt;
&lt;td&gt;Free, open-source&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Auth&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Third-party providers (Clerk, Supabase auth, Better Auth)&lt;/td&gt;
&lt;td&gt;Built-in (email/password, Google, GitHub, Microsoft, Slack, etc.)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Payments&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Stripe, Lemon Squeezy, or Polar.sh, etc.&lt;/td&gt;
&lt;td&gt;Stripe, Lemon Squeezy, or Polar.sh&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Deployment&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Vercel + Supabase (typically)&lt;/td&gt;
&lt;td&gt;Railway, Fly.io, or any VPS&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Community&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;1-2 maintainers&lt;/td&gt;
&lt;td&gt;13,000+ GitHub stars, active open-source community&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;LLM-friendly docs&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;llms.txt&lt;/td&gt;
&lt;td&gt;llms.txt&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Codebase structure&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Multiple apps/packages with separate configs and third-party integrations wired together&lt;/td&gt;
&lt;td&gt;Single app, feature-based organization with fullstack code colocated&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h3&gt;
  
  
  Paid Boilerplates
&lt;/h3&gt;

&lt;p&gt;Options like &lt;a href="https://shipfa.st/" rel="noopener noreferrer"&gt;ShipFast&lt;/a&gt; ($250) and &lt;a href="https://supastarter.dev/" rel="noopener noreferrer"&gt;Supastarter&lt;/a&gt; (starting at $299) are popular choices. They're packed with lots of features and have a strong history of adoption and support.&lt;/p&gt;

&lt;p&gt;But there are a few things to consider:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Upfront cost&lt;/strong&gt;: $250-$800+ before you've written a line of business logic&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Vendor-leaning stacks&lt;/strong&gt;: many are built on top of Vercel + Supabase + third-party auth services. That's more vendor lock-in and recurring hosting costs on top of the purchase price. You're not just paying for the boilerplate, but you're also committing to a specific infrastructure stack.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Code Quality&lt;/strong&gt;: most paid boilerplates are maintained by a one or two developers. An open-source project, on the other hand, is maintained by many more people, and the community input is much larger, making it more robust and reliable.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Stack fragmentation&lt;/strong&gt;: ShipFast is a flat Next.js app where auth, payments, email, and database are each handled by separate third-party libraries you wire together yourself. Supastarter is a Turborepo monorepo with 4 separate Next.js apps and 8+ shared packages, each with its own config. Both approaches mean more files for an AI tool to navigate, more indirection to follow, and more context needed to make a single cross-cutting change.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;None of this means paid boilerplates are bad. They can absolutely save you time. But it's worth understanding what you're signing up for beyond the purchase price.&lt;/p&gt;

&lt;h3&gt;
  
  
  Open SaaS -- a free, open-source, production-ready SaaS boilerplate starter
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://opensaas.sh" rel="noopener noreferrer"&gt;Open SaaS&lt;/a&gt; is free, and open-source. It's powered by &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; — a batteries-included full-stack framework for React, Node.js, and Prisma apps.&lt;/p&gt;

&lt;p&gt;Here's what you get out of the box:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Auth&lt;/strong&gt;: email/password, Google, GitHub, all pre-configured and without third-party providers&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Payments&lt;/strong&gt;: Stripe, Lemon Squeezy, or Polar.sh. Take your pick.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Email, file uploads, admin dashboard, analytics, e2e tests&lt;/strong&gt;: the full SaaS toolkit.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Deploy anywhere&lt;/strong&gt;: Railway, Fly.io, or any VPS. No vendor lock-in.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;13,000+ GitHub stars&lt;/strong&gt; and an active open-source community backing it.&lt;/li&gt;
&lt;/ul&gt;


&lt;div class="ltag-quote"&gt;
  &lt;div class="ltag-quote__body"&gt;
    &lt;div class="ltag-quote__mark ltag-quote__mark--start"&gt;
      
        
      
    &lt;/div&gt;
    &lt;div class="ltag-quote__text"&gt;The documentation is a million times better for Open SaaS than for ShipFast... I got frustrated with ShipFast's terrible code and terrible documentation (or just the lack of) and I found Open SaaS. It's looking like it will be a better experience.&lt;/div&gt;
    &lt;div class="ltag-quote__mark ltag-quote__mark--end"&gt;
      
        
      
    &lt;/div&gt;
  &lt;/div&gt;
    &lt;div class="ltag-quote__rating"&gt;
        &lt;span class="ltag-quote__star ltag-quote__star--filled"&gt;★&lt;/span&gt;
        &lt;span class="ltag-quote__star ltag-quote__star--filled"&gt;★&lt;/span&gt;
        &lt;span class="ltag-quote__star ltag-quote__star--filled"&gt;★&lt;/span&gt;
        &lt;span class="ltag-quote__star ltag-quote__star--filled"&gt;★&lt;/span&gt;
        &lt;span class="ltag-quote__star ltag-quote__star--filled"&gt;★&lt;/span&gt;
    &lt;/div&gt;
  
  
    &lt;div class="ltag-quote__author-info"&gt;
        &lt;img class="ltag-quote__avatar" src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1787873578584793088%2FYo1wWG_p_400x400.jpg" alt="Sean Nam"&gt;
      &lt;div class="ltag-quote__meta"&gt;
        &lt;span class="ltag-quote__author"&gt;Sean Nam&lt;/span&gt;
          &lt;span class="ltag-quote__role"&gt;Founder @ NotePulse&lt;/span&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
&lt;/div&gt;


&lt;p&gt;Because Open SaaS is built on &lt;a href="https://wasp.sh/docs" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt;, everything lives under one roof. React frontend, Node.js backend, and Prisma database layer are all managed by a single framework, with a declarative config (&lt;code&gt;main.wasp&lt;/code&gt; or &lt;code&gt;main.wasp.ts&lt;/code&gt;) that defines your routes, pages, operations, auth, and background jobs. The codebase is organized by feature (e.g. auth, payments, file uploads) with backend logic and frontend components sitting side by side. When an AI coding tool reads &lt;code&gt;main.wasp&lt;/code&gt;, it immediately understands the full app structure without having to jump between separate apps, packages, or third-party service abstractions. One framework, one config, one mental model for the AI to follow.&lt;/p&gt;

&lt;h2&gt;
  
  
  Effectively Vibe Coding Your SaaS
&lt;/h2&gt;

&lt;p&gt;So we've got our AI-assisted coding tool and our SaaS boilerplate starter, but to get the most out of AI-assisted development, you need two more things working together. Note that these tips come from real-world experience building full-stack apps with Claude Code and Wasp, and we covered them in depth &lt;a href="https://wasp.sh/blog/2026/01/29/claude-code-fullstack-development-essentials" rel="noopener noreferrer"&gt;on the Wasp blog&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  1. LLM-Friendly Documentation
&lt;/h3&gt;

&lt;p&gt;LLMs don't always get things right, and may sometimes be out-of-date with the latest features of the tools you're using. For example, if you're using a framework that shipped a new version last week, your AI tool probably doesn't know about it, unless you give it the docs.&lt;/p&gt;

&lt;p&gt;But how you give it docs matters a lot, because LLMs don't have a long-term memory, rather they have context windows, which is like a limited memory of only the most recent conversations. So with each new session, you have to remind them of what you're working on, with, and what you want to do.&lt;/p&gt;

&lt;p&gt;One of the best solutions is to use &lt;code&gt;llms.txt&lt;/code&gt; files. These are structured docs in a single, machine-readable plain text file that's purpose-built for LLMs.&lt;/p&gt;

&lt;p&gt;Open SaaS and Wasp both provide these:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Open SaaS docs&lt;/strong&gt;: &lt;a href="https://docs.opensaas.sh/llms.txt" rel="noopener noreferrer"&gt;&lt;code&gt;https://docs.opensaas.sh/llms.txt&lt;/code&gt;&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Wasp framework docs&lt;/strong&gt;: &lt;a href="https://wasp.sh/llms.txt" rel="noopener noreferrer"&gt;&lt;code&gt;https://wasp.sh/llms.txt&lt;/code&gt;&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Just add these URLs to your AI coding tool's chat session or "memory" (e.g. &lt;code&gt;CLAUDE.md&lt;/code&gt;, &lt;code&gt;AGENTS.md&lt;/code&gt;). When the AI needs to, for example, understand how Wasp auth works or how to set up Stripe payments in Open SaaS, it has the full, up-to-date docs right there. &lt;/p&gt;

&lt;p&gt;And it's not just Open SaaS and Wasp. Most developer tools and integrations have adopted the &lt;code&gt;llms.txt&lt;/code&gt; standard. Try appending &lt;code&gt;/llms.txt&lt;/code&gt; to any tool's docs URL and see what comes back. You'd be surprised how many services already support it. When you're implementing a new integration, pass its &lt;code&gt;llms.txt&lt;/code&gt; to your coding agent so it has good guardrails for development.&lt;/p&gt;

&lt;p&gt;Another pro tip: when you're working on a specific feature, search the tool's docs for the relevant guide and look for a &lt;strong&gt;"Copy for LLMs"&lt;/strong&gt; button. Many doc sites now offer this. Or just try adding &lt;code&gt;.md&lt;/code&gt; to the end of a specific URL to get an LLM-friendly version of that page. For example, Stripe's guide on SaaS subscriptions is available at &lt;a href="https://docs.stripe.com/get-started/use-cases/saas-subscriptions.md" rel="noopener noreferrer"&gt;https://docs.stripe.com/get-started/use-cases/saas-subscriptions.md&lt;/a&gt;. Pass that to your agent and it'll have the knowledge it needs to implement Stripe subscriptions correctly.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Full-Stack Debugging Visibility
&lt;/h3&gt;

&lt;p&gt;AI can write code all day, but if it can't tell whether the code actually works, you're constantly stuck in the middle, running the app, checking the browser, copying error messages back and forth.&lt;/p&gt;

&lt;p&gt;The fix is giving your AI tool full-stack visibility into what's happening when the code runs, so it can see the errors, and fix them without you having to always intervene.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Background dev server&lt;/strong&gt;: Run your dev server as a background task so the AI can see server logs, compilation errors, and runtime exceptions in real time. In Claude Code, you can use background tasks (Ctrl+B) to keep &lt;code&gt;wasp start&lt;/code&gt; running while you work, or just tell it to "start the dev server as a background task".&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Browser automation&lt;/strong&gt;: Tools like &lt;a href="https://github.com/ChromeDevTools/chrome-devtools-mcp" rel="noopener noreferrer"&gt;Chrome DevTools MCP&lt;/a&gt; or &lt;a href="https://github.com/vercel-labs/agent-browser" rel="noopener noreferrer"&gt;Vercel's agent browser&lt;/a&gt; let AI see what's actually rendering in the browser -- console errors, network requests, DOM state -- without you having to screenshot anything. The AI can verify that the button it just added actually appears on the page and handles clicks correctly.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Together, these create a tight feedback loop: AI writes code → sees the result → spots the error → fixes it → verifies the fix. This improves the quality of the code it generates, and makes the entire process less tedious and more efficient.&lt;/p&gt;

&lt;h2&gt;
  
  
  Getting Started: From Zero to Vibe Coding
&lt;/h2&gt;

&lt;p&gt;Ready to try it? Here's how to go from nothing to vibe coding a SaaS in a few minutes.&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 1: Install Wasp and Get the Template
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm i &lt;span class="nt"&gt;-g&lt;/span&gt; @wasp.sh/wasp-cli
wasp new my-saas &lt;span class="nt"&gt;-t&lt;/span&gt; saas
&lt;span class="nb"&gt;cd &lt;/span&gt;my-saas
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This scaffolds a new Open SaaS project with auth, payments, email, file uploads, an admin dashboard, a landing page, and more — all pre-configured and ready to go.&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 2: Set Up Claude Code with the Wasp Plugin
&lt;/h3&gt;

&lt;p&gt;After &lt;a href="https://code.claude.com/docs/en/quickstart" rel="noopener noreferrer"&gt;installing Claude Code&lt;/a&gt;, add &lt;a href="https://github.com/wasp-lang/wasp-agent-plugins/tree/main/plugins/wasp" rel="noopener noreferrer"&gt;the Wasp plugin&lt;/a&gt; so that it has deep knowledge of the framework, as well as skills and instructions on how to properly use full-stack debugging visibility, llms.txt docs, and more:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;claude plugin marketplace add wasp-lang/wasp-agent-plugins
claude plugin &lt;span class="nb"&gt;install &lt;/span&gt;wasp@wasp-agent-plugins &lt;span class="nt"&gt;--scope&lt;/span&gt; project
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;NOTE: Other coding agents&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;If you're using a coding agent like Codex, OpenCode, Cursor, etc. you can get the same set of agent skills by running:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npx skills add wasp-lang/wasp-agent-plugins
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then, in a new session, run the plugin initialization skill command to initialize the plugin with Wasp best practices for your project:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;/wasp-plugin-init
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Step 3: Get Integrations Working (Stripe, Email Sender, OpenAI, etc)
&lt;/h3&gt;

&lt;p&gt;Next, you'll want to get your payment, email sender, and other integrations working (Stripe, Email Sender, OpenAI, etc) before you start building features.&lt;/p&gt;

&lt;p&gt;Luckily for you, we've got a complete walkthrough video that guides you step-by-step through creating accounts, adding your API keys, and getting each integration working:&lt;/p&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/lFGtwbwt66k"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Or if you want your agent to help guide you through the process, you can ask it to fetch the "getting started" guide from the &lt;a href="https://docs.opensaas.sh/llms.txt" rel="noopener noreferrer"&gt;Open SaaS LLMs.txt docs&lt;/a&gt; and follow the instructions step-by-step.&lt;/p&gt;

&lt;h3&gt;
  
  
  Step 4: Start Building
&lt;/h3&gt;

&lt;p&gt;Fire up your database and dev server:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;wasp start db
wasp start
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or just tell Claude Code to run &lt;code&gt;start the dev server as a background task&lt;/code&gt; and it will run the correct commands for you :)&lt;/p&gt;

&lt;p&gt;Now it's finally time to give Claude Code a real feature request — "add a user settings page where users can update their profile" — and watch it reference the Wasp config file(s) to understand your app's structure, reference the right patterns from the boilerplate, and implement the feature correctly.&lt;/p&gt;

&lt;p&gt;Because Wasp is opinionated, Claude won't have to guess where to put files, how to wire up routes, or which patterns to follow. It reads the config file(s), sees the existing conventions, and follows them. You get consistent, working code on the first try — or pretty close to it.&lt;/p&gt;

&lt;p&gt;Remember, if you're using Cursor, Copilot, or another tool, the same principles apply. Check out our &lt;a href="https://dev.to/guides/vibe-coding/"&gt;Vibe Coding guide&lt;/a&gt; more info.&lt;/p&gt;

&lt;h2&gt;
  
  
  FAQ
&lt;/h2&gt;

&lt;h3&gt;
  
  
  What's the difference between AI-native platforms and AI coding tools?
&lt;/h3&gt;

&lt;p&gt;AI-native platforms like Replit, Lovable, and Bolt.new aim for a zero-config experience where you describe what you want and get a working app. AI coding tools like Claude Code, Cursor, and Codex work directly with your codebase, giving you full control and no vendor lock-in. AI-native platforms are great for quick prototypes but hit a ceiling as complexity grows, while AI coding tools require more setup but produce more maintainable, production-ready code, and can actually be cheaper in the long run.&lt;/p&gt;

&lt;h3&gt;
  
  
  Can I export my code from Replit, Lovable, or Bolt.new?
&lt;/h3&gt;

&lt;p&gt;Yes, all three platforms let you export your code via GitHub sync or ZIP download. However, the exported code is often tightly coupled to their infrastructure — for example, Lovable generates code wired into Supabase, and Replit uses proprietary auth, storage, and database solutions. This means significant refactoring is needed if you want to deploy elsewhere or switch services.&lt;/p&gt;

&lt;h3&gt;
  
  
  What is llms.txt and why does it matter for vibe coding?
&lt;/h3&gt;

&lt;p&gt;llms.txt is a structured documentation file in plain text format, purpose-built for LLMs. It gives AI coding tools like Claude Code up-to-date knowledge about the frameworks and tools you're using, reducing hallucinations and outdated code suggestions. Most developer tools now support it -- just append /llms.txt to any tool's docs URL to check.&lt;/p&gt;

&lt;h3&gt;
  
  
  What is the best free SaaS boilerplate starter for AI-assisted development?
&lt;/h3&gt;

&lt;p&gt;Open SaaS is a free, open-source SaaS boilerplate for React, Node.js, and Prisma apps powered by the Wasp framework. It comes with auth, payments (Stripe, Lemon Squeezy, or Polar.sh), email sending, file uploads, an admin dashboard, and more, all pre-configured. Because it's built on Wasp, the entire stack is managed by a single framework with a declarative config file. The codebase is organized by feature with backend and frontend code colocated, so AI tools can understand the full app structure from one file instead of navigating multiple apps, packages, and third-party integrations.&lt;/p&gt;

&lt;h3&gt;
  
  
  Does codebase structure matter for AI-assisted development?
&lt;/h3&gt;

&lt;p&gt;Yes, significantly. AI coding tools work best when they can quickly understand the full picture of your app. A codebase organized by feature with colocated fullstack code — like Open SaaS, where backend logic and frontend components sit side by side — gives the AI one clear mental model to follow. In contrast, boilerplates that split code across multiple apps, packages, and third-party integrations require the AI to navigate more files and follow more indirection, which increases the chance of inconsistencies and errors.&lt;/p&gt;

&lt;h3&gt;
  
  
  How do I set up Claude Code for full-stack SaaS development?",
&lt;/h3&gt;

&lt;p&gt;Install Claude Code, then add the Wasp plugin for deep framework knowledge. Create a new Open SaaS project with 'wasp new my-saas -t saas', set up your integrations (Stripe, email, etc.), and run 'wasp start' as a background task so Claude Code can see server logs and errors in real time. Pair this with browser automation tools like Chrome DevTools MCP for full-stack debugging visibility."&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;The best way to vibe code a SaaS in 2026 isn't about finding the flashiest AI tool, it's about giving your AI tool the right foundation to work with.&lt;/p&gt;

&lt;p&gt;We suggest using Claude Code and giving it three things: a strong SaaS boilerplate starter kit, like Open SaaS, that gives AI a solid foundation to work with, LLM-friendly docs that help AI stay grounded without burning context, and full-stack debugging visibility that closes the feedback loop.&lt;/p&gt;

&lt;p&gt;Open SaaS + Claude Code gives you all of this: a free, open-source, production-ready SaaS foundation, the structure and conventions AI needs to generate clean, consistent code, complete LLM-friendly docs for both the template and the framework, and the tools for full-stack debugging visibility. And because it's all free and open source there's no upfront cost, no vendor lock-in, and you can deploy wherever you want.&lt;/p&gt;

&lt;p&gt;You spend your time on business logic and product, not the boring stuff.&lt;/p&gt;



</description>
      <category>webdev</category>
      <category>sass</category>
      <category>ai</category>
      <category>tooling</category>
    </item>
    <item>
      <title>What Are the Best Full-stack Web App Frameworks in 2026?</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Mon, 02 Mar 2026 16:00:27 +0000</pubDate>
      <link>https://dev.to/wasp/what-are-the-best-full-stack-web-app-frameworks-in-2026-3d9m</link>
      <guid>https://dev.to/wasp/what-are-the-best-full-stack-web-app-frameworks-in-2026-3d9m</guid>
      <description>&lt;h2&gt;
  
  
  TL;DR
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://laravel.com/" rel="noopener noreferrer"&gt;Laravel&lt;/a&gt;, &lt;a href="https://rubyonrails.org/" rel="noopener noreferrer"&gt;Rails&lt;/a&gt;, and &lt;a href="https://www.djangoproject.com/" rel="noopener noreferrer"&gt;Django&lt;/a&gt; remain the most battle-tested full-stack frameworks in 2026.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://nextjs.org/" rel="noopener noreferrer"&gt;Next.js&lt;/a&gt; dominates for React-first apps but requires significant assembly. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://wasp.sh/" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; brings the batteries-included experience of Laravel/Rails to the JS/TS ecosystem, with the strongest AI-coding compatibility of the five. &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If you want &lt;strong&gt;proven maturity&lt;/strong&gt;, go Laravel for PHP or Django for Python.&lt;br&gt;&lt;br&gt;
If you want to &lt;strong&gt;maximum flexibility&lt;/strong&gt; and don't mind the extra work, go with Next.js.&lt;br&gt;&lt;br&gt;
If you want to &lt;strong&gt;ship fast in JavaScript with minimal boilerplate&lt;/strong&gt;, go with Wasp.&lt;/p&gt;




&lt;h2&gt;
  
  
  What We're Comparing
&lt;/h2&gt;

&lt;p&gt;In this guide, we compare the most popular full-stack frameworks in 2026: &lt;strong&gt;Laravel&lt;/strong&gt;, &lt;strong&gt;Ruby on Rails&lt;/strong&gt;, &lt;strong&gt;Django&lt;/strong&gt;, and &lt;strong&gt;Next.js&lt;/strong&gt;. We also include &lt;strong&gt;Wasp&lt;/strong&gt;, the framework we're building. We think it's a compelling option in this space, and we wanted to put it side by side with the established players so you can judge for yourself. &lt;/p&gt;

&lt;p&gt;We look at what each does well, where each falls short, and which one fits your use case, whether you're a solo indie hacker, a startup team, or an enterprise engineering org.&lt;/p&gt;

&lt;p&gt;Beyond the usual criteria like developer experience and ecosystem size, we also evaluate how well each framework plays with AI coding tools like Cursor, Claude Code, Codex, Copilot, and OpenCode — because in 2026, that matters more than ever.&lt;/p&gt;




&lt;h2&gt;
  
  
  What Makes a Great Full-Stack Framework in 2026?
&lt;/h2&gt;

&lt;p&gt;We focused on five criteria when evaluating full-stack frameworks:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Developer Experience (DX):&lt;/strong&gt; How fast can you go from &lt;code&gt;init&lt;/code&gt; to a deployed app? How much configuration and boilerplate do you (not) have to deal with?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Ecosystem &amp;amp; Community:&lt;/strong&gt; Are there libraries, plugins, and guides for when you get stuck? Is it being actively maintained?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;AI-Friendliness:&lt;/strong&gt; How well does the framework work with AI coding assistants? Can an LLM understand your project structure and generate correct code?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Deployment Ease:&lt;/strong&gt; Can you deploy with a single command, or do you need to configure infrastructure manually?&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Full-Stack Coverage:&lt;/strong&gt; Does the framework cover the client, server, &lt;em&gt;and&lt;/em&gt; database layer, and how much assembly is required?&lt;/li&gt;
&lt;/ol&gt;




&lt;h2&gt;
  
  
  Different Flavors of Full-Stack
&lt;/h2&gt;

&lt;p&gt;All five frameworks in this guide can be used for full-stack development, but they take different approaches:&lt;/p&gt;

&lt;h3&gt;
  
  
  Backend-first full-stack (Laravel, Rails, Django)
&lt;/h3&gt;

&lt;p&gt;These are the original full-stack frameworks. They own the server and database layer with built-in ORMs, migrations, auth, background jobs, and more. Their frontend story varies, e.g. Laravel pairs with Inertia.js or Livewire, Rails has Hotwire/Turbo, and Django uses templates or a separate SPA. These are mature, battle-tested, and genuinely full-stack. If your definition of full-stack is "handles everything from HTTP request to database and back," these frameworks nailed it years ago.&lt;/p&gt;

&lt;h3&gt;
  
  
  Frontend-first full-stack (Next.js)
&lt;/h3&gt;

&lt;p&gt;Covers client-side rendering and server-side logic (API routes, server components), but the database layer is entirely Bring Your Own (BYO). You choose your ORM, your auth solution, your email provider, and you wire them together yourself.&lt;/p&gt;

&lt;h3&gt;
  
  
  All-in-one full-stack (Wasp)
&lt;/h3&gt;

&lt;p&gt;Wasp takes a different approach within the JavaScript ecosystem specifically. It uses a declarative configuration file that describes your routes, authentication, database models, server operations, and more in one place. The compiler then generates a React + Node.js + Prisma application. Unlike Laravel or Rails, Wasp removes the need to pick and assemble frontend solutions, and bundles everything within a single mental model. Wasp also brings the batteries-included philosophy of Laravel and Rails to the JS/TS ecosystem, where developers otherwise need to assemble everything from scratch.&lt;/p&gt;




&lt;h2&gt;
  
  
  Laravel (PHP)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;The battle-tested PHP powerhouse that keeps reinventing itself.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Laravel has been the dominant PHP framework for over a decade, and it shows no signs of slowing down. Laravel has a long tradition of incremental, developer-friendly improvements. With over &lt;a href="https://github.com/laravel/laravel" rel="noopener noreferrer"&gt;&lt;strong&gt;80,000 GitHub stars&lt;/strong&gt;&lt;/a&gt; and &lt;a href="https://blog.jetbrains.com/phpstorm/2024/09/laravel-trends-2024-the-latest-market-insights/" rel="noopener noreferrer"&gt;used by 61% of PHP developers&lt;/a&gt;, Laravel's community is massive and active.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Eloquent ORM&lt;/strong&gt; — expressive, ActiveRecord-style database layer&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;New Starter Kits (React, Vue, Livewire)&lt;/strong&gt; — built-in auth scaffolding for email with optional WorkOS AuthKit for social auth, passkeys, and SSO&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Laravel Cloud, or Forge&lt;/strong&gt; — fully-managed deployments with Laravel Cloud, or VPS server management with Forge&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Inertia.js integration&lt;/strong&gt; — use React or Vue as your frontend with server-driven routing&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Queues, events, broadcasting&lt;/strong&gt; — built-in job processing and real-time features&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Laravel Herd&lt;/strong&gt; — zero-config local development environment&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Incredibly mature ecosystem with solutions for nearly every problem&lt;/li&gt;
&lt;li&gt;Excellent documentation — often cited as the gold standard&lt;/li&gt;
&lt;li&gt;Huge job market, especially for agencies and SaaS companies&lt;/li&gt;
&lt;li&gt;First-party tools for deployment, billing (Cashier), search (Scout), and more&lt;/li&gt;
&lt;li&gt;Active release cycle with yearly major versions&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;PHP — love it or hate it, many JS/Python developers won't consider it&lt;/li&gt;
&lt;li&gt;Frontend story requires extra setup (Inertia.js, Livewire, or a separate SPA)&lt;/li&gt;
&lt;li&gt;Performance requires tuning for high-concurrency applications&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best For
&lt;/h3&gt;

&lt;p&gt;Enterprise applications, SaaS products, agencies, and teams already invested in PHP. Laravel is the safest bet if you need a proven framework with an answer for everything.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI/Vibe Coding Compatibility
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Good.&lt;/strong&gt; Laravel's consistent conventions and excellent documentation mean AI tools can generate reasonably accurate code. However, the PHP + JS split (if using Inertia or a React SPA) means the AI needs to understand two separate codebases. AI-coding tools work well with Laravel, but the full-stack context is split across languages.&lt;/p&gt;




&lt;h2&gt;
  
  
  Ruby on Rails
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;The original "convention over configuration" framework, still going strong.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Ruby on Rails practically invented modern web development conventions. &lt;a href="https://rubyonrails.org/2024/12/13/Rails-Version-8-0-1-has-been-released" rel="noopener noreferrer"&gt;Rails 8.0&lt;/a&gt; (released late 2024) doubled down on simplicity with Kamal 2 for deployment, Thruster for HTTP/2, and the Solid trifecta (Solid Cable, Solid Cache, Solid Queue) — replacing Redis dependencies with database-backed alternatives. Rails has approximately &lt;a href="https://github.com/rails/rails" rel="noopener noreferrer"&gt;&lt;strong&gt;56,000+ GitHub stars&lt;/strong&gt;&lt;/a&gt; and a loyal, experienced community.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Active Record&lt;/strong&gt; — the ORM that inspired every other ORM&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Kamal 2&lt;/strong&gt; — deploy anywhere with zero-downtime Docker deployments&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Hotwire (Turbo + Stimulus)&lt;/strong&gt; — modern frontend interactivity without heavy JS&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Solid Cable/Cache/Queue&lt;/strong&gt; — database-backed infrastructure, no Redis needed&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Built-in authentication generator&lt;/strong&gt; (new in Rails 8)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Action Mailer, Active Job, Active Storage&lt;/strong&gt; — batteries included for email, jobs, and file uploads&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Convention over configuration means less decision fatigue&lt;/li&gt;
&lt;li&gt;Extremely productive for CRUD applications and MVPs&lt;/li&gt;
&lt;li&gt;Mature ecosystem with gems for nearly everything&lt;/li&gt;
&lt;li&gt;Rails 8's "no PaaS" philosophy makes self-hosting straightforward&lt;/li&gt;
&lt;li&gt;Strong opinions lead to consistent, maintainable codebases&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Ruby's job market has shrunk compared to JS, Python, and PHP. &lt;a href="https://blog.jetbrains.com/research/2025/10/state-of-developer-ecosystem-2025/" rel="noopener noreferrer"&gt;JetBrains' 2025 survey&lt;/a&gt; classifies Ruby as a language in "long-term decline"&lt;/li&gt;
&lt;li&gt;Ruby has no opt-in type system akin to TypeScript — that's freeing for some developers and frustrating for others&lt;/li&gt;
&lt;li&gt;Performance can lag behind Node.js and Go for I/O-heavy workloads&lt;/li&gt;
&lt;li&gt;Frontend story (Hotwire) is polarizing — great for some, frustrating for React/Vue developers&lt;/li&gt;
&lt;li&gt;Smaller pool of new developers entering the ecosystem&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best For
&lt;/h3&gt;

&lt;p&gt;Startups that value speed-to-market, CRUD-heavy applications, and teams that appreciate strong conventions. Rails remains one of the fastest ways to go from idea to working product if you're comfortable with Ruby.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI/Vibe Coding Compatibility
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Good.&lt;/strong&gt; Rails' strong conventions make it relatively predictable for AI tools. The "Rails way" means there's usually one correct approach, which helps LLMs generate accurate code. However, like Laravel, the backend (Ruby) and any modern frontend (React via Inertia or API mode) are separate contexts the AI must juggle.&lt;/p&gt;




&lt;h2&gt;
  
  
  Django (Python)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Python's full-stack framework, now supercharged by the AI/ML ecosystem.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://docs.djangoproject.com/en/5.2/releases/5.2/" rel="noopener noreferrer"&gt;Django 5.2 LTS&lt;/a&gt; (released April 2025) is the latest long-term support release, with security fixes guaranteed through April 2028. With roughly &lt;a href="https://github.com/django/django" rel="noopener noreferrer"&gt;&lt;strong&gt;82,000+ GitHub stars&lt;/strong&gt;&lt;/a&gt;, Django has one of the largest open-source communities of any web framework. Its killer advantage in 2026? Python is the language of AI and data science, making Django a natural choice for teams that need web applications tightly integrated with ML pipelines.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Django ORM&lt;/strong&gt; — powerful, Pythonic database layer with migrations&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Django Admin&lt;/strong&gt; — automatic admin interface from your models&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Django REST Framework (DRF)&lt;/strong&gt; — the de facto standard for building APIs&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Built-in auth, sessions, CSRF protection&lt;/strong&gt; — security-first by default&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Excellent integration with Python ML/AI libraries&lt;/strong&gt; — NumPy, pandas, scikit-learn, PyTorch&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Python, &lt;a href="https://www.tiobe.com/tiobe-index/" rel="noopener noreferrer"&gt;the most popular programming language according to the TIOBE Index&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;Unmatched for applications that combine web + data science/ML&lt;/li&gt;
&lt;li&gt;Django Admin alone saves weeks of development time&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.djangoproject.com/start/overview/" rel="noopener noreferrer"&gt;Battle-tested at scale&lt;/a&gt; (Instagram, Pinterest, Mozilla)&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://docs.djangoproject.com/en/dev/internals/release-process/" rel="noopener noreferrer"&gt;LTS releases&lt;/a&gt; provide long-term stability — 3 years of security fixes per LTS version, the longest of any framework in this list&lt;/li&gt;
&lt;li&gt;Massive community with extensive third-party packages&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Frontend story is the weakest of the five. Django templates are server-rendered, and pairing with React requires a separate SPA + DRF API&lt;/li&gt;
&lt;li&gt;Async support is improving but still not as natural as Node.js&lt;/li&gt;
&lt;li&gt;"Monolithic" architecture can feel heavy for small projects&lt;/li&gt;
&lt;li&gt;Deployment requires more setup than modern deployment platforms&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best For
&lt;/h3&gt;

&lt;p&gt;Data-driven applications, ML-integrated products, and teams already writing Python. If your backend does heavy data processing or integrates with AI models, Django is a natural fit. Also excellent for government, education, and enterprise contexts where Python is standard.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI/Vibe Coding Compatibility
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Very good for backend, weaker for full-stack.&lt;/strong&gt; Python is the language AI tools understand best, so Django backend code gets excellent AI assistance. But the disconnect between Django's backend and a modern JS frontend means AI tools struggle with the full-stack picture. If you're building a Django + React app, the AI has to work across two very different codebases.&lt;/p&gt;




&lt;h2&gt;
  
  
  Next.js (React)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;The React meta-framework that dominates the JavaScript ecosystem.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Next.js pioneered server-side rendering in the React ecosystem and continues to push boundaries with React Server Components, Server Actions, and a serverless-first deployment model via Vercel. &lt;a href="https://nextjs.org/showcase" rel="noopener noreferrer"&gt;Used by companies like Netflix, TikTok, and Notion&lt;/a&gt;, it has over &lt;a href="https://github.com/vercel/next.js" rel="noopener noreferrer"&gt;&lt;strong&gt;130,000+ GitHub stars&lt;/strong&gt;&lt;/a&gt;, making it one of the most popular open-source frameworks.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;App Router&lt;/strong&gt; — React Server Components, layouts, and streaming&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Server Actions&lt;/strong&gt; — call server functions directly from client components&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Turbopack&lt;/strong&gt; — Rust-based bundler for faster builds&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;API Routes&lt;/strong&gt; — build backend endpoints alongside your frontend&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Vercel deployment&lt;/strong&gt; — git push to production in seconds&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Image optimization, fonts, metadata&lt;/strong&gt; — built-in performance features&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Largest ecosystem and community in the JavaScript full-stack space&lt;/li&gt;
&lt;li&gt;Vercel provides best-in-class deployment experience&lt;/li&gt;
&lt;li&gt;React skills are the most in-demand frontend skills in the job market&lt;/li&gt;
&lt;li&gt;Server Components and Server Actions blur the client/server boundary&lt;/li&gt;
&lt;li&gt;Excellent TypeScript support&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://nextjs.org/support-policy" rel="noopener noreferrer"&gt;Formal LTS support policy&lt;/a&gt; — each major version gets up to 2 years of maintenance&lt;/li&gt;
&lt;li&gt;Massive library of examples, templates, and tutorials&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;No built-in ORM, database layer, or auth — you need Prisma/Drizzle for DB, NextAuth/Clerk for auth, Resend for email, etc.&lt;/li&gt;
&lt;li&gt;Complexity has grown significantly — App Router, Server Components, caching strategies can be overwhelming&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://eduardoboucas.com/posts/2025-03-25-you-should-know-this-before-choosing-nextjs/" rel="noopener noreferrer"&gt;Vercel platform coupling&lt;/a&gt; — key features like ISR, image optimization, and serverless deployment work best (or only) on Vercel, with no official adapter system for other hosts&lt;/li&gt;
&lt;li&gt;Serverless-first billing model can lead to unpredictable costs at scale&lt;/li&gt;
&lt;li&gt;"Glue framework" problem — you spend significant time choosing and wiring together third-party solutions&lt;/li&gt;
&lt;li&gt;Frequent breaking changes like the migration from Pages to App Router, which effectively required rewriting large portions of existing apps&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best For
&lt;/h3&gt;

&lt;p&gt;Teams building React-first applications who want maximum flexibility. Next.js is the right choice when you need a highly customized frontend with complex UI, and you're comfortable assembling or connecting your own backend stack. It's the only framework in this list that works equally well as a pure frontend layer.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI/Vibe Coding Compatibility
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Mixed.&lt;/strong&gt; AI tools are excellent at generating React components and Next.js page structures. But because Next.js doesn't prescribe a database, auth, or backend architecture, the AI has to understand whatever custom stack you've assembled and spend a lot more time writing boilerplate and glue code. The complexity of the App Router, Server Components, and caching — plus breaking changes like the Pages to App Router migration — can also make it harder for AI to get things right.&lt;/p&gt;




&lt;h2&gt;
  
  
  Wasp (React + Node.js + Prisma)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;A declarative full-stack JS framework that gives React + Node.js + Prisma the batteries-included treatment.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Wasp (Web Application Specification) takes a different approach within the JavaScript ecosystem. Instead of giving you building blocks and telling you to assemble them, Wasp uses a declarative configuration file that describes your entire application: routes, pages, authentication, database models, server operations, and background jobs. The Wasp compiler then generates a complete React + Node.js + Prisma application. With &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;&lt;strong&gt;18,000+ GitHub stars&lt;/strong&gt;&lt;/a&gt; and a growing community, Wasp is earning attention as the opinionated alternative to the "assemble it yourself" JS ecosystem.&lt;/p&gt;

&lt;p&gt;This is our framework. We built Wasp because we felt the JS/TS ecosystem was missing the kind of batteries-included experience that Laravel, Rails, and Django developers have had for years. We think that earns it a spot in this comparison, but we'll let you be the judge.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Declarative &lt;code&gt;.wasp&lt;/code&gt; or &lt;code&gt;.wasp.ts&lt;/code&gt; config&lt;/strong&gt; — define your entire app — routes, auth, database, jobs — from a high level&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Full-stack type safety&lt;/strong&gt; — types flow from database to UI automatically&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Type-safe RPC&lt;/strong&gt; — call server functions from the client with automatic serialization and type checking, no API layer to write&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Built-in auth&lt;/strong&gt; — email/password, Google, GitHub, etc. with minimal config&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Background jobs&lt;/strong&gt; — declare async jobs in config, implement in Node.js&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;One-command deployment&lt;/strong&gt; — &lt;code&gt;wasp deploy&lt;/code&gt; to Railway, &lt;a href="http://fly.io/" rel="noopener noreferrer"&gt;Fly.io&lt;/a&gt; or other providers&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://opensaas.sh/" rel="noopener noreferrer"&gt;Open SaaS&lt;/a&gt;&lt;/strong&gt; — production-ready SaaS starter with &lt;a href="https://github.com/wasp-lang/open-saas" rel="noopener noreferrer"&gt;13,000+ GitHub stars&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Pros
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Dramatically less boilerplate than assembling Next.js + Prisma + NextAuth + etc. — which means a faster start and less maintenance later&lt;/li&gt;
&lt;li&gt;Wasp's config acts as a high-level map of your app that both you and AI coding tools can read to quickly understand the full picture&lt;/li&gt;
&lt;li&gt;Full-stack type safety without manual setup&lt;/li&gt;
&lt;li&gt;Built on React, Node.js, and Prisma — widely adopted, marketable technologies&lt;/li&gt;
&lt;li&gt;Simple by default, powerful when needed — common features work out of the box, but you can always drop into the underlying React, Node.js, and Prisma code for full flexibility&lt;/li&gt;
&lt;li&gt;No deployment lock-in — build artifacts are standard Node.js and React, deployable anywhere&lt;/li&gt;
&lt;li&gt;Helpful community with very active maintainers (according to the feedback of our users!)&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Cons
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Newer technology, which means faster changes and a still-growing ecosystem&lt;/li&gt;
&lt;li&gt;Not yet battle-tested at enterprise scale&lt;/li&gt;
&lt;li&gt;Currently only focused on the React + Node.js + Prisma stack&lt;/li&gt;
&lt;li&gt;No serverless deployment support (yet)&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Best For
&lt;/h3&gt;

&lt;p&gt;Solo developers, indie hackers, and startup teams who want a batteries-included full-stack experience in JavaScript/TypeScript. Also a strong fit for small-to-medium teams building SaaS products and enterprises building internal tools — anywhere speed-to-ship and low boilerplate matter more than maximum customization.&lt;/p&gt;

&lt;h3&gt;
  
  
  AI/Vibe Coding Compatibility
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Excellent.&lt;/strong&gt; The Wasp configuration gives AI an instant, high-level understanding of your entire application, including its routes, authentication methods, server operations, and more. The well-defined stack and clear structure allow AI to focus on your app's business logic while Wasp handles the glue and boilerplate. And because complexity is hidden until you need it, there's simply less for AI to get wrong, making it easier to generate coherent code across the entire stack.&lt;/p&gt;




&lt;h2&gt;
  
  
  Built-in Features: What You Get Out of the Box
&lt;/h2&gt;

&lt;p&gt;One of the biggest differences between frameworks is how much they give you versus how much you assemble yourself. Here's a detailed comparison of key features across all five frameworks.&lt;/p&gt;

&lt;h3&gt;
  
  
  Authentication
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Framework&lt;/th&gt;
&lt;th&gt;Built-in Solution&lt;/th&gt;
&lt;th&gt;Setup Effort&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Declarative auth in config — ~10 lines for email + social auth&lt;/td&gt;
&lt;td&gt;Minimal — declare it, done&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Laravel&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;New starter kits with email auth and optional WorkOS AuthKit for social auth, passkeys, SSO&lt;/td&gt;
&lt;td&gt;Low — one CLI command scaffolds views, controllers, routes&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Rails&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Built-in auth generator (Rails 8+). &lt;code&gt;rails generate authentication&lt;/code&gt;
&lt;/td&gt;
&lt;td&gt;Low — generates migration, model, controller, views&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Django&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;django.contrib.auth&lt;/code&gt; built into every project. Login/logout views, permissions, groups&lt;/td&gt;
&lt;td&gt;Low — included by default, add URLs and templates&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Next.js&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;None built-in. Use NextAuth.js/Auth.js (~50-100 lines config + route handler + middleware + provider setup) or Clerk (hosted, paid)&lt;/td&gt;
&lt;td&gt;Moderate-High — install package, configure providers, add middleware, handle sessions&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Where the established frameworks win:&lt;/strong&gt; Laravel, Rails, and Django have had over a decade to refine their auth systems. They handle edge cases (password resets, email verification, rate limiting, 2FA) that newer solutions are still maturing on. Django's permission system and Laravel's team management are particularly sophisticated. That said, Wasp stands out for how little code is needed to get auth working: a few lines of config vs. generated scaffolding in the other frameworks.&lt;/p&gt;

&lt;h3&gt;
  
  
  Background Jobs / Async Tasks
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Framework&lt;/th&gt;
&lt;th&gt;Built-in Solution&lt;/th&gt;
&lt;th&gt;External Dependencies&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Laravel&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Laravel Queues — first-party, supports Redis, SQS, database drivers. Horizon for monitoring&lt;/td&gt;
&lt;td&gt;None required (database driver works out of the box)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Rails&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Active Job — built-in abstraction. Solid Queue (Rails 8) eliminates Redis. Sidekiq for heavy workloads&lt;/td&gt;
&lt;td&gt;None with Solid Queue; Sidekiq needs Redis&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Django&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;None built-in. Celery is the de facto standard (~50-100 lines setup, needs broker like Redis/RabbitMQ)&lt;/td&gt;
&lt;td&gt;Celery + message broker&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Declare &lt;code&gt;job&lt;/code&gt; in &lt;code&gt;.wasp&lt;/code&gt; config (~5 lines), implement handler in Node.js&lt;/td&gt;
&lt;td&gt;None — uses pg-boss under-the-hood (PostgreSQL-backed)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Next.js&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;None built-in. Need Inngest, Trigger.dev, or BullMQ + separate worker process&lt;/td&gt;
&lt;td&gt;Third-party service or self-hosted worker&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Where Laravel, Rails, and Wasp dominate:&lt;/strong&gt; Laravel Queues and Rails' Active Job / Solid Queue are the gold standard for background processing. They support job chaining, rate limiting, retry logic, priority queues, and monitoring dashboards (Horizon, Solid Queue's admin). Wasp's job system is simpler to declare but less feature-rich for complex workflows.&lt;/p&gt;

&lt;h3&gt;
  
  
  Routing
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Framework&lt;/th&gt;
&lt;th&gt;Approach&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Next.js&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;File-based routing — create a file at &lt;code&gt;app/dashboard/page.tsx&lt;/code&gt; and the route exists. Intuitive but can get messy with complex layouts&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Laravel&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;routes/web.php&lt;/code&gt; — expressive, resourceful routing. &lt;code&gt;Route::resource('photos', PhotoController::class)&lt;/code&gt; gives you 7 CRUD routes in one line&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Rails&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;config/routes.rb&lt;/code&gt; — similar to Laravel. &lt;code&gt;resources :photos&lt;/code&gt; generates RESTful routes. Mature, powerful DSL&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Django&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;
&lt;code&gt;urlpatterns&lt;/code&gt; in &lt;code&gt;urls.py&lt;/code&gt; — explicit URL-to-view mapping. Flexible but more verbose than Rails/Laravel&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Declare &lt;code&gt;route&lt;/code&gt; + &lt;code&gt;page&lt;/code&gt; in &lt;code&gt;.wasp&lt;/code&gt; config — routes are paired with pages and get type-safe linking. Simpler but less flexible than Rails/Laravel&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Honest take:&lt;/strong&gt; Routing is largely a solved problem. Rails and Laravel have the most powerful routing DSLs. Next.js file-based routing is the most intuitive for simple apps. Wasp's routing is the most concise but also the least flexible for complex URL patterns.&lt;/p&gt;

&lt;h3&gt;
  
  
  Full-Stack Type Safety
&lt;/h3&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Framework&lt;/th&gt;
&lt;th&gt;Type Safety Story&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Automatic — types flow from Prisma schema through server operations to React components. No manual setup needed&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Next.js&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Possible with tRPC or Server Actions, but requires manual configuration. Server Actions provide some type flow but aren't end-to-end&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Laravel&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Limited — PHP has types, but no automatic flow to JS frontend. Inertia.js provides some type sharing with TypeScript&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Rails&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Minimal — Ruby is dynamically typed. Sorbet exists but isn't standard&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Django&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Limited — Python has type hints, but no automatic flow to JS frontend&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Wasp's genuine advantage:&lt;/strong&gt; This is one area where Wasp clearly leads. Having types flow automatically from your database schema to your UI components, with zero configuration, eliminates an entire class of bugs. In other frameworks, achieving this requires significant setup (tRPC in Next.js) or isn't practically possible (Rails, Django).&lt;/p&gt;




&lt;h2&gt;
  
  
  Head-to-Head Comparison
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Feature&lt;/th&gt;
&lt;th&gt;Laravel&lt;/th&gt;
&lt;th&gt;Ruby on Rails&lt;/th&gt;
&lt;th&gt;Django&lt;/th&gt;
&lt;th&gt;Next.js&lt;/th&gt;
&lt;th&gt;Wasp&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Language&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;PHP&lt;/td&gt;
&lt;td&gt;Ruby&lt;/td&gt;
&lt;td&gt;Python&lt;/td&gt;
&lt;td&gt;JavaScript/TypeScript&lt;/td&gt;
&lt;td&gt;JavaScript/TypeScript&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;GitHub Stars&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;83K+&lt;/td&gt;
&lt;td&gt;56K+&lt;/td&gt;
&lt;td&gt;82K+&lt;/td&gt;
&lt;td&gt;130K+&lt;/td&gt;
&lt;td&gt;18K+&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;ORM&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Eloquent&lt;/td&gt;
&lt;td&gt;Active Record&lt;/td&gt;
&lt;td&gt;Django ORM&lt;/td&gt;
&lt;td&gt;BYO (Prisma/Drizzle)&lt;/td&gt;
&lt;td&gt;Prisma (integrated)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Auth&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Starter kits + WorkOS AuthKit integration&lt;/td&gt;
&lt;td&gt;Generator (Rails 8)&lt;/td&gt;
&lt;td&gt;django.contrib.auth&lt;/td&gt;
&lt;td&gt;BYO (NextAuth/Clerk)&lt;/td&gt;
&lt;td&gt;Declarative config&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Background Jobs&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Queues + Horizon&lt;/td&gt;
&lt;td&gt;Active Job + Solid Queue&lt;/td&gt;
&lt;td&gt;(Celery)&lt;/td&gt;
&lt;td&gt;BYO (Inngest/Trigger.dev)&lt;/td&gt;
&lt;td&gt;Declarative config&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Modern React Frontend&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Via Inertia.js&lt;/td&gt;
&lt;td&gt;Via Hotwire/API&lt;/td&gt;
&lt;td&gt;Via separate SPA&lt;/td&gt;
&lt;td&gt;Native React&lt;/td&gt;
&lt;td&gt;Native React&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Full-Stack Type Safety&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Limited&lt;/td&gt;
&lt;td&gt;Minimal&lt;/td&gt;
&lt;td&gt;Limited&lt;/td&gt;
&lt;td&gt;Manual (tRPC)&lt;/td&gt;
&lt;td&gt;Automatic&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Easy Deployment&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Forge/Vapor&lt;/td&gt;
&lt;td&gt;Kamal 2&lt;/td&gt;
&lt;td&gt;Manual/PaaS&lt;/td&gt;
&lt;td&gt;Vercel (one-click)&lt;/td&gt;
&lt;td&gt;CLI deploy to Railway, Fly.io, or any VPS&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;AI-Friendliness&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Learning Curve&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Moderate&lt;/td&gt;
&lt;td&gt;Moderate&lt;/td&gt;
&lt;td&gt;Moderate&lt;/td&gt;
&lt;td&gt;Steep (App Router)&lt;/td&gt;
&lt;td&gt;Low-Moderate&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Job Market&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Large (PHP)&lt;/td&gt;
&lt;td&gt;Shrinking&lt;/td&gt;
&lt;td&gt;Large (Python)&lt;/td&gt;
&lt;td&gt;Very Large (React)&lt;/td&gt;
&lt;td&gt;Indirectly Very Large (Wasp is React/Node.js/Prisma)&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;strong&gt;Maturity / Enterprise Readiness&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐⭐&lt;/td&gt;
&lt;td&gt;⭐⭐⭐&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;h2&gt;
  
  
  Frequently Asked Questions
&lt;/h2&gt;

&lt;h3&gt;
  
  
  When should I choose Laravel vs Next.js vs Wasp?
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Choose Laravel&lt;/strong&gt; if you or your team knows PHP, you need a battle-tested solution for a complex business application, and you want a massive ecosystem with answers for every problem. &lt;strong&gt;Choose Next.js&lt;/strong&gt; if you're designing a marketing page and SEO is very important, or if you need a highly custom React frontend with maximum flexibility and you're comfortable assembling your own backend stack. &lt;strong&gt;Choose Wasp&lt;/strong&gt; if you want a batteries-included JS/TS full-stack experience without the assembly tax for building and shipping fast.&lt;/p&gt;

&lt;h3&gt;
  
  
  What's the best framework for solo developers?
&lt;/h3&gt;

&lt;p&gt;It depends on your language. &lt;strong&gt;Wasp&lt;/strong&gt; is excellent for JS/TS solo developers. The declarative config eliminates decision fatigue and AI tools work particularly well with it. &lt;strong&gt;Rails&lt;/strong&gt; has been the solo developer's best friend for two decades and is still incredibly productive. &lt;strong&gt;Laravel&lt;/strong&gt; is similarly productive if you know PHP. The common thread: pick a framework with strong opinions so you spend time building, not configuring.&lt;/p&gt;

&lt;h3&gt;
  
  
  Which framework is best for vibe coding / AI-assisted development?
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Wasp's&lt;/strong&gt; configuration makes it the best choice as it gives AI a boilerplate-free, high-level understanding of the entire app, and allows it to focus on building your app's business logic while Wasp handles the glue. But Django also performs well because Python is the language AI tools understand most deeply, and Laravel/Rails benefit from their strong conventions that reduce ambiguity.&lt;/p&gt;

&lt;h3&gt;
  
  
  Is Wasp production-ready?
&lt;/h3&gt;

&lt;p&gt;Yes, with caveats. Wasp is rapidly approaching a 1.0 release (currently in beta), which means API changes can occur between versions. However, real companies and indie hackers are running production applications built with Wasp. For enterprise-scale applications with complex requirements, you may want to wait for 1.0 or choose a more established framework. For startups, MVPs, and SaaS products, Wasp is production-viable.&lt;/p&gt;

&lt;h3&gt;
  
  
  What's the best framework for a startup MVP?
&lt;/h3&gt;

&lt;p&gt;For a &lt;strong&gt;JavaScript/TypeScript&lt;/strong&gt; startup: &lt;strong&gt;Wasp&lt;/strong&gt; gets you to a deployed MVP fast, especially with the Open SaaS template. For a &lt;strong&gt;Python&lt;/strong&gt; team: &lt;strong&gt;Django&lt;/strong&gt; with Django REST Framework. For a &lt;strong&gt;PHP&lt;/strong&gt; team: &lt;strong&gt;Laravel&lt;/strong&gt;. For speed-to-market in Ruby: &lt;strong&gt;Rails&lt;/strong&gt;. The common thread is choosing a framework that makes decisions for you so you can focus on your product.&lt;/p&gt;

&lt;h3&gt;
  
  
  Which framework has the best job market?
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Next.js / React&lt;/strong&gt; dominates the JavaScript job market. &lt;strong&gt;Django / Python&lt;/strong&gt; leads in data science, AI/ML, and many enterprise contexts. &lt;strong&gt;Laravel / PHP&lt;/strong&gt; remains strong for agencies, e-commerce, and WordPress-adjacent work. &lt;strong&gt;Rails&lt;/strong&gt; has a loyal but shrinking job market. &lt;strong&gt;Wasp&lt;/strong&gt; is too new for a meaningful job market of its own, but Wasp skills are really React + Node.js + Prisma skills — all highly marketable individually.&lt;/p&gt;

&lt;h3&gt;
  
  
  Can I use Next.js as a true full-stack framework?
&lt;/h3&gt;

&lt;p&gt;You can, but it requires significant assembly. Next.js provides the client and server layers, but you'll need to add your own ORM, authentication, email service, background jobs, and more. This gives you maximum flexibility but also maximum setup time. If you want a batteries-included JavaScript full-stack experience, Wasp is a better fit. If you want a customizable React-first framework and don't mind the assembly, Next.js remains the industry standard.&lt;/p&gt;




&lt;h2&gt;
  
  
  Conclusion: Which Framework Should You Choose?
&lt;/h2&gt;

&lt;p&gt;There's no single "best" framework but there is a best framework &lt;em&gt;for you&lt;/em&gt;:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;If you are...&lt;/th&gt;
&lt;th&gt;Choose...&lt;/th&gt;
&lt;th&gt;Why&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;An enterprise team with complex requirements&lt;/td&gt;
&lt;td&gt;
&lt;strong&gt;Laravel&lt;/strong&gt; or &lt;strong&gt;Django&lt;/strong&gt;
&lt;/td&gt;
&lt;td&gt;Battle-tested, massive ecosystems, proven at scale&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;A startup prioritizing speed-to-market&lt;/td&gt;
&lt;td&gt;
&lt;strong&gt;Rails&lt;/strong&gt; or &lt;strong&gt;Wasp&lt;/strong&gt;
&lt;/td&gt;
&lt;td&gt;Maximum productivity, minimum boilerplate&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Building a data/ML-heavy product&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;Django&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Python ecosystem integration is unmatched&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;A JS/TS developer who wants batteries included&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;The Laravel/Rails experience for the JavaScript ecosystem&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Need maximum frontend flexibility&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;Next.js&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;React ecosystem, Vercel deployment, custom everything&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Optimizing for job market value&lt;/td&gt;
&lt;td&gt;
&lt;strong&gt;Next.js&lt;/strong&gt; or &lt;strong&gt;Django&lt;/strong&gt;
&lt;/td&gt;
&lt;td&gt;Largest demand for React and Python skills&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Prioritizing AI-assisted development (vibe coding)&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;Wasp&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;Config-as-architecture, low boilerplate, batteries-included&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

</description>
      <category>webdev</category>
      <category>ai</category>
      <category>vibecoding</category>
      <category>fullstack</category>
    </item>
    <item>
      <title>Claude Code for Fullstack Development: The 3 Things You Actually Need</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Fri, 13 Feb 2026 13:00:00 +0000</pubDate>
      <link>https://dev.to/wasp/claude-code-for-fullstack-development-the-3-things-you-actually-need-1p6p</link>
      <guid>https://dev.to/wasp/claude-code-for-fullstack-development-the-3-things-you-actually-need-1p6p</guid>
      <description>&lt;h2&gt;
  
  
  How Can I Use Claude Code Effectively?
&lt;/h2&gt;

&lt;p&gt;There's a lot of hype around vibe coding with Claude Code.&lt;/p&gt;

&lt;p&gt;The good news is that it's warranted. Claude Code can take care of some &lt;a href="https://www.anthropic.com/news/claude-opus-4-5" rel="noopener noreferrer"&gt;surprisingly complex coding tasks&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The bad news is that it's over-hyped, with claims of amazing apps being vibe coded in a couple hours, or complex workflows that use 10 parallel sub-agents running in a loop to replace the work of 5 software engineers.&lt;/p&gt;

&lt;p&gt;If you're not already a Claude Code power user, all this hype can leave you questioning how to use it effectively. &lt;em&gt;Am I missing out on productivity gains by not adopting this insane new workflow? Should I be using subagents, commands, skills, or MCP servers for my use case? If so, how?&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;I was asking myself these exact questions, so I did a good few weeks of research and testing, and reached the following conclusion:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;With just a few well-picked tools, and Claude Code's basic features, you have enough to "vibe code" great full-stack apps.&lt;/strong&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  You Don't Need All its Features
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;Weird seeing all these complex LLM workflows and tools. Meanwhile I run one continuous Claude convo per project... I've never used a subagent. Never used MCP…&lt;br&gt;
And I have wildly good results ¯_(ツ)_/¯&lt;/em&gt;&lt;br&gt;&lt;br&gt;
— &lt;a href="https://x.com/chris_mccord/status/2016554559078883510" rel="noopener noreferrer"&gt;Chris McCord, creator of the Phoenix framework&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;While Claude Code's abilities are impressive, you quickly realize that there is a lot of feature overlap and stuff you just generally won't have to touch often if you get a few things right from the start. I'll explain what these are, and then go into more detail on each topic within this article.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1. Provide it with full-stack debugging visibility&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This allows Claude to actually see and respond to what it's coding, rather than us having to copy-paste errors, or describe issues.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;2. Give Claude Code access to up-to-date, LLM-friendly documentation&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is crucial when working with LLMs that may have outdated knowledge, hallucinate solutions, or get thrown off by "noisy" documentation that's not optimized for LLMs.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;3. Use the right tech stack or framework&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is probably the most overlooked of these three approaches. By picking the right framework, you give AI clear patterns to follow, and remove a lot of complexity right from the start.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;With this foundation, you'll be able to build and deploy fullstack apps easily by mostly using Claude Code's default workflows, and just a couple custom commands/skills (I also packed these ideas into a simple Claude Code plugin you can install and use, but I'll talk more about that later).&lt;/p&gt;

&lt;p&gt;This approach works because it provides guardrails and the right patterns for the agent to follow, so you can spend more time on business logic implementation, and less time working out specifications and technical details.&lt;/p&gt;

&lt;p&gt;Essentially, you get to work with the agent on &lt;em&gt;what&lt;/em&gt; you want, rather than having to explain &lt;em&gt;how&lt;/em&gt; you want it, bringing that magic feeling of AI-assisted coding to complex, full-stack apps.&lt;/p&gt;

&lt;p&gt;Let's dive in.&lt;/p&gt;




&lt;h2&gt;
  
  
  Giving Claude Code Full-Stack Vision
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Establishing a Tight Feedback Loop
&lt;/h3&gt;

&lt;p&gt;Our typical AI-assisted coding workflow tends to look like this: we prompt, then wait, then look over the generated code (maybe), then check on things in the browser. If we've got some errors or some bad looking frontend designs, we copy and paste them and try to (better) explain what we want.&lt;/p&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/gOMOpURvoRY"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;p&gt;What's worse is we might have to do this a few times before we're satisfied, or get things working again.&lt;/p&gt;

&lt;p&gt;By always keeping ourselves in the loop, &lt;a href="https://www.anthropic.com/research/estimating-productivity-gains" rel="noopener noreferrer"&gt;we're slowing things down a lot&lt;/a&gt;. We should, at times, just get out of the way and let the agent improve the code with each iteration until its done, before checking the result.&lt;/p&gt;

&lt;p&gt;But to do this, we need to give Claude Code a "set of eyes". Luckily, this is possible with the right features and tools, allowing it to see the results of the code it wrote, and quickly modify it autonomously if it encounters an error anywhere in the stack.&lt;/p&gt;

&lt;p&gt;Let's check out how.&lt;/p&gt;

&lt;h3&gt;
  
  
  Running the Dev Server as a Background Task
&lt;/h3&gt;

&lt;p&gt;Claude Code introduced their &lt;a href="https://code.claude.com/docs/en/interactive-mode#background-bash-commands" rel="noopener noreferrer"&gt;background tasks feature&lt;/a&gt; which lets it execute long-running tasks, like app development servers (e.g. &lt;code&gt;npm run dev&lt;/code&gt;), on the side without blocking Claude's progress on other work. The nice part is that Claude can continue to read and respond to the output of this task while you work.&lt;/p&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/ixT5Etvs9O0"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;p&gt;To run commands in the background, you can either:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Prompt Claude Code to run a command in the background, e.g. &lt;code&gt;"run my app's dev server in the background"&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;Press Ctrl+B to move a regular Bash tool invocation to the background, e.g. &lt;code&gt;"run the dev server"&lt;/code&gt; + &lt;code&gt;Ctrl+b&lt;/code&gt; as it starts&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Even though Claude can read the output of your background tasks, there are times you may want to check up on them yourself, and you still can do that. Just use the down arrow to highlight the background task message and click enter.&lt;/p&gt;

&lt;p&gt;This is great because now Claude can react to issues that occur from building and serving your code. Unfortunately, it still can't react to errors that occur while your app is running in the browser.&lt;/p&gt;

&lt;p&gt;But there's a cool way to solve this.&lt;/p&gt;

&lt;h3&gt;
  
  
  Browser Automation Tools
&lt;/h3&gt;

&lt;p&gt;The missing piece so far is giving Claude the ability to actually &lt;em&gt;see&lt;/em&gt; the result of the code it wrote, most typically what the UI looks like.&lt;/p&gt;

&lt;p&gt;Problems that only show up &lt;strong&gt;after the app is running in the browser&lt;/strong&gt;, like design issues and runtime errors, aren't yet visible to the agent. So this tends to be where the human steps in to report back to: &lt;em&gt;"the button is misaligned"&lt;/em&gt;, &lt;em&gt;"there's a 404 error when trying to login"&lt;/em&gt;, &lt;em&gt;"the console says something about &lt;code&gt;undefined&lt;/code&gt;"&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;But luckily, we can arm Claude Code with browser automation tools to solve for this. These tools allow for programmatic control of the browser, like loading pages, clicking buttons, inspecting elements, reading console logs, and even taking screenshots.&lt;/p&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/oyYwfbuNrtc"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;p&gt;This closes the loop for the &lt;em&gt;entire&lt;/em&gt; stack and gives Claude the autonomy to complete larger features tasks entirely on its own.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://developer.chrome.com/blog/chrome-devtools-mcp" rel="noopener noreferrer"&gt;Chrome DevTools MCP server&lt;/a&gt; is one of the best options currently out there, though there are many alternatives. It's easy to install, and specializes in browser debugging and performance insights.&lt;/p&gt;

&lt;p&gt;To install it, run the following command in the terminal to add it to your current project:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;claude mcp add chrome-devtools &lt;span class="nt"&gt;--scope&lt;/span&gt; project npx chrome-devtools-mcp@latest
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then start a new Claude session and give it a prompt like:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Verify in the browser that your change works as expected.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You should see a separate Chrome instance open up being controlled by Claude. Go ahead and give it more tasks like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;authenticating a test user&lt;/li&gt;
&lt;li&gt;checking the lighthouse performance score of a site (e.g. how fast it loads)&lt;/li&gt;
&lt;li&gt;giving you feedback on how to improve your app's design&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Tying it All Together
&lt;/h3&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/eS1Uio_rrP8"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;p&gt;Now, when you're implementing full-stack features in your app, ask Claude to verify the feature works correctly by checking the logs in the development server, as well as in the browser with the Chrome DevTools MCP.&lt;/p&gt;

&lt;p&gt;Alternatively, if you want Claude to &lt;em&gt;always&lt;/em&gt; automatically verify changes in the browser with the DevTools MCP without having to explicitly ask it to do so, you can &lt;a href="https://code.claude.com/docs/en/memory#set-up-project-memory" rel="noopener noreferrer"&gt;add a rule to Claude's memory in your &lt;code&gt;CLAUDE.md&lt;/code&gt; file&lt;/a&gt;.&lt;/p&gt;




&lt;h2&gt;
  
  
  Give the Agent Access to the Right Docs
&lt;/h2&gt;

&lt;h3&gt;
  
  
  The Versioning Problem
&lt;/h3&gt;

&lt;p&gt;You've probably experienced this: you're vibe coding using a library's API, and the AI confidently writes code that would have worked perfectly… two versions ago. Or it creates some crazy, over-engineered work-around to a known issue that has a simple solution in its documentation.&lt;/p&gt;

&lt;p&gt;This is because the model's training data has a cut-off date. LLMs and tools like Claude have no way of knowing about the updated code patterns, unless you give it access to the current documentation.&lt;/p&gt;

&lt;p&gt;But, as &lt;a href="https://x.com/karpathy/status/1899876370492383450" rel="noopener noreferrer"&gt;Andrej Karpathy observed&lt;/a&gt;, most documentation contains content that's not relevant for LLMs:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;99% of libraries still have docs that basically render to some pretty .html static pages assuming a human will click through them. In 2025 the docs should be a your_project.md text file that is intended to go into the context window of an LLM.&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;There's &lt;a href="https://research.trychroma.com/context-rot" rel="noopener noreferrer"&gt;research to back up his claim,&lt;/a&gt; showing that LLM performance degrades when irrelevant content, like HTML syntax or verbose instructions for humans, is added to context as it distracts from the task and reduces accuracy.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In other words, every unnecessary token in your context window makes the AI slightly worse at its job.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;So we need to be giving Claude Code the &lt;em&gt;right&lt;/em&gt; kind of docs.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Solution: Curated Doc Access
&lt;/h3&gt;

&lt;p&gt;The fix is simple: give the agent the ability to fetch and read the relevant, LLM-optimized documentation for the tools you're using.&lt;/p&gt;

&lt;p&gt;Here are the two main ways developers are accomplishing this:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;MCP Servers&lt;/strong&gt; — A standard for external systems to serve data to AI agents. Popular dev tools, such as &lt;a href="https://vercel.com/docs/mcp/vercel-mcp" rel="noopener noreferrer"&gt;Vercel&lt;/a&gt;, make these available with doc searching tools.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;llms.txt and doc maps&lt;/strong&gt; — A standard for publishing LLM-friendly documentation at a well-known URL, e.g. &lt;a href="https://wasp.sh/llms.txt" rel="noopener noreferrer"&gt;https://wasp.sh/llms.txt&lt;/a&gt;. The agent fetches structured docs optimized for LLM context windows.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  MCP Servers for Docs Fetching
&lt;/h3&gt;

&lt;p&gt;The &lt;a href="https://modelcontextprotocol.io/" rel="noopener noreferrer"&gt;Model Context Protocol (MCP)&lt;/a&gt; is an open standard for connecting AI applications (i.e. agents, LLMs) to external systems. Claude Code can communicate with an MCP server to access specialized tools and information.&lt;/p&gt;

&lt;p&gt;There are already tons of MCP servers for popular tools, like Supabase, Jira, Canva, Notion, and Vercel. Claude Code has &lt;a href="https://code.claude.com/docs/en/mcp#popular-mcp-servers" rel="noopener noreferrer"&gt;a docs section listing these and many more&lt;/a&gt;, with instructions on how to install them if you’re interested.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fom5hqjf4hp44bs0jbe9g.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fom5hqjf4hp44bs0jbe9g.png" alt="the Context7 MCP's  raw `get-library-docs` endraw  tool"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Developer Tool MCP servers like &lt;a href="https://supabase.com/docs/guides/getting-started/mcp" rel="noopener noreferrer"&gt;Supabase&lt;/a&gt; and &lt;a href="https://vercel.com/docs/ai-resources/vercel-mcp" rel="noopener noreferrer"&gt;Vercel&lt;/a&gt; have tools which will fetch documentation for the agent based on a query. There are some pros and cons to this approach, though. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pros&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;can do some pre-processing on the docs before sending them back&lt;/li&gt;
&lt;li&gt;can version-check, filter, and fetch relevant snippets across multiple docs/guides&lt;/li&gt;
&lt;li&gt;return structured outputs instead of raw text&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Cons&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;the MCP server decides what is relevant, ignoring potentially useful information&lt;/li&gt;
&lt;li&gt;all of its tools (not just doc fetching tools) get loaded into, and quickly fill up, the LLM’s context window, degrading the agent’s performance&lt;/li&gt;
&lt;li&gt;more overhead for the agent: evaluate prompt → find the right MCP tool → call it → wait for response from MCP server → evaluate response → take action&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Because LLMs don’t have a real memory, they have to load information into context with every new session, such as the tools they can use. A single MCP server can add around 15-30 tools to the context, and with multiple servers you can easily consume 10-20% or more of your LLM’s context window before you even begin working.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn8m9oshafywmfncilsbi.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn8m9oshafywmfncilsbi.webp" alt="Checking the context usage in a Claude Code session."&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you want to see how much of your context window is already used up, you can run the &lt;code&gt;/context&lt;/code&gt; slash command in an active Claude Code session.&lt;br&gt;
The example above shows that 2.5% of the context window is used up by just one MCP server.&lt;/p&gt;

&lt;p&gt;And as an LLM’s context window fills up, it’s performance degrades. Some devs even suggest starting a new session once the context is 75% full to avoid this, which is possible with the &lt;code&gt;/clear&lt;/code&gt; command in Claude Code. You can also run the &lt;code&gt;/compact&lt;/code&gt; command which creates a summary of your current session’s context and passes it along to the next session.&lt;/p&gt;

&lt;p&gt;Luckily, if your main reason for using an MCP server is just for documentation searching, then an alternative open standard exists that may be a better fit.&lt;/p&gt;
&lt;h3&gt;
  
  
  LLM-friendly Docs URLs — LLMs.txt
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://llmstxt.org/" rel="noopener noreferrer"&gt;LLMs.txt&lt;/a&gt; has quickly become the standard for providing LLMs with context-friendly versions of websites at an &lt;code&gt;/llms.txt&lt;/code&gt; path.&lt;/p&gt;

&lt;p&gt;Try it out on some of your favorite developer tools URLs, such as:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://stripe.com/llms.txt" rel="noopener noreferrer"&gt;stripe.com/llms.txt&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://supabase.com/llms.txt" rel="noopener noreferrer"&gt;supabase.com/llms.txt&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://wasp.sh/llms.txt" rel="noopener noreferrer"&gt;wasp.sh/llms.txt&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/zBsc8nIiXGk"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;p&gt;Although llms.txt files might vary widely in the content they surface, they always follow the same format of a simple markdown file with the title of the website and some links. That’s it! This allows LLMs to get precise information without all the fluff.&lt;/p&gt;

&lt;p&gt;Here are some of the pros and cons of using llms.txt for documentation fetching:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pros&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;curated list of the most relevant information for LLMs and agents&lt;/li&gt;
&lt;li&gt;extremely simple; works with any agent that can fetch URLs&lt;/li&gt;
&lt;li&gt;agents decide which links to follow and can see full source text&lt;/li&gt;
&lt;li&gt;very context window efficient&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Cons&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;raw docs / markdown files may transmit more information than needed&lt;/li&gt;
&lt;li&gt;the agent could fetch incompatible links / files&lt;/li&gt;
&lt;li&gt;the agent might need more guidance / rules on how to interact with the docs correctly&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In my opinion, I think that fetching docs via an &lt;code&gt;llms.txt&lt;/code&gt; URL is the better approach as its more context efficient. For example, a typical documentation file is ~100 tokens versus 5,000-10,000 tokens for just one MCP server.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;That’s a 10x reduction in context usage.&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;Claude Code is also great at navigating documentation maps to only fetch the most relevant information. Plus, you get the added benefit that &lt;code&gt;llms.txt&lt;/code&gt; files are easier for humans to reference as well.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp1r64tmx6d0f3lyoa4hf.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fp1r64tmx6d0f3lyoa4hf.webp" alt="Claude Code fetching the correct version of the Wasp docs via llms.txt"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It's also the method that Claude Code uses for its &lt;a href="https://simonwillison.net/2025/Oct/24/claude-code-docs-map/" rel="noopener noreferrer"&gt;own doc fetching internally&lt;/a&gt;. So when you ask it a question about its own features, it will first fetch its &lt;a href="https://simonwillison.net/2025/Oct/24/claude-code-docs-map/" rel="noopener noreferrer"&gt;documentation map markdown file URL&lt;/a&gt; to find the correct guides.&lt;/p&gt;

&lt;p&gt;So now that you know how to give Claude Code access to up-to-date documenation, the next question to answer is which tools might you need to provide the docs for? &lt;/p&gt;

&lt;p&gt;And the most obvious answer is the &lt;strong&gt;tech stack or framework&lt;/strong&gt; you’re building your full-stack app with.&lt;/p&gt;




&lt;h2&gt;
  
  
  Choosing the Right Tech Stack / Framework
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Popular Choices
&lt;/h3&gt;

&lt;p&gt;This is probably the most overlooked of the 3 pillars. &lt;/p&gt;

&lt;p&gt;Starting with a tech stack that AI can easily reason about will make the job of building the app you want significantly easier. There are a lot of options out there, but luckily there are many solid choices, such as:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; (React, NodeJS, Prisma)&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://nextjs.org/docs" rel="noopener noreferrer"&gt;NextJS&lt;/a&gt; (React, NodeJS)&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://laravel.com/docs" rel="noopener noreferrer"&gt;Laravel&lt;/a&gt; (PHP)&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://rubyonrails.org/docs" rel="noopener noreferrer"&gt;Ruby on Rails&lt;/a&gt; (Rails)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In 2026, you'll be able to get very far with Claude Code and any of the frameworks listed above. But while these frameworks all offer good conventions, and are responsible for stitching together the most important parts of the stack, most of these still require some sort of additional integration.&lt;/p&gt;

&lt;h3&gt;
  
  
  Which one should you go with?
&lt;/h3&gt;

&lt;p&gt;For NextJS, which is more client-side focused, you have to chose and connect your own database layer. For Laravel and Rails, which unify backend and database, you need to decide which client to use and how it will talk to your backend.&lt;/p&gt;

&lt;p&gt;That's why a lot of developers will reach for popular stacks/combos that include these frameworks, such as:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;NextJS + tRPC + Prisma + NextAuth (aka &lt;a href="https://create.t3.gg/en/introduction" rel="noopener noreferrer"&gt;T3 Stack&lt;/a&gt;)&lt;/li&gt;
&lt;li&gt;&lt;a href="https://inertiajs.com/docs/introduction" rel="noopener noreferrer"&gt;Laravel + Inertia.js + React&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://hotwired.dev/" rel="noopener noreferrer"&gt;Rails + Hotwire&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You might have noticed as well that the T3 Stack is the only one to include an authentication library, NextAuth. That's because the backend-focused frameworks, Laravel and Rails, have an opinionated way of adding authentication to your app already, but NextJS does not.&lt;/p&gt;

&lt;p&gt;Wasp, on the other hand, is the only one of the bunch that unifies all parts of the stack — client ↔ backend ↔ database — while also being opinionated on features.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;This is all great, but which one should you ultimately choose?&lt;/strong&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  The More Opinionated, The Better
&lt;/h3&gt;

&lt;p&gt;Well, the more opinionated the framework, the better it vibes with AI.&lt;/p&gt;

&lt;p&gt;If a framework is &lt;strong&gt;opinionated&lt;/strong&gt;, it means there's usually one obvious place to put code and one common pattern to follow. The AI doesn't have to guess. They've already made decisions ahead of time so you (and your agent) don't have to. They've encoded architectural wisdom into conventions, picked the libraries to use, the way authentication is wired, and how the app should be structured.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;So when there are fewer decisions to make, less boilerplate to write, and fewer tools to stitch together, the development process becomes more reliable.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;And as the app gets more complex, AI doesn't lose its focus, because the framework is handling a lot of underlying complexity.  You can also understand and inspect what is being generated more easily, and avoid building yourself into a messy corner.&lt;/p&gt;

&lt;p&gt;Consider that &lt;strong&gt;opinionated frameworks can reduce boilerplate by 60-80%&lt;/strong&gt;. Wasp's auth declaration, for example, replaces 500+ lines of typical authentication code with a 10 to 15-line config. That's 97% less code that needs to be generated and audited!&lt;/p&gt;

&lt;p&gt;Of these frameworks, Wasp is definitely the most opinionated but it's also the newest kid on the block. After that, Laravel and Rails are probably tied for a close second, but they are built on PHP and Rails, respectively, and come with their own distinct ecosystems, so you'll most likely have to pair them with a frontend JavaScript framework like React, too. NextJS, is the most popular but least opinionated of the bunch, so it means there is more complexity and up-front choices you and your AI have to deal with, but this offers more flexibility in the long run.&lt;/p&gt;

&lt;p&gt;So in the end, the choice you make largely depends on what you're trying to achieve, what you're comfortable with, and how much flexibility you need.&lt;/p&gt;

&lt;p&gt;Just remember, the more a framework gives you structure and defaults, the easier it is for AI to generate code that fits correctly — and the less time you spend fixing confusing or inconsistent output.&lt;/p&gt;

&lt;h3&gt;
  
  
  What This Means for Claude Code
&lt;/h3&gt;

&lt;p&gt;Ok. So we've established that working with an opinionated framework means that it it manages a lot of the complexity for you.&lt;/p&gt;

&lt;p&gt;But what does that practically mean when using it with Claude Code?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Subagents for architecture planning?&lt;/strong&gt; The framework already decided the architecture.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Elaborate plans for where code should live?&lt;/strong&gt; The conventions tell you.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Back-and-forth to agree on patterns?&lt;/strong&gt; The patterns are already decided.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Glueing the pieces of your app together?&lt;/strong&gt; The frameworks manage this code.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Context that explains your app structure?&lt;/strong&gt; It's embedded in the framework.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In a sense, the framework acts as a large specification that both you and Claude already understand and agree on.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Instead of multi-turn conversations to figure out HOW things should be built, you get to just say WHAT you want built.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;So when you tell Claude "add a new model for Comments" or "add a user account settings feature", Claude will know exactly what that means and where it all goes. And you also get the added benefit that the implementations follow best practices and are backed by the decisions of experienced professionals behind the framework, and is not just some &lt;a href="https://x.com/karpathy/status/2015883857489522876" rel="noopener noreferrer"&gt;LLM hastily implementing a feature on the wrong assumptions.&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This isn't to say that you no longer have to do good planning, create a good spec, or Product Requirement Doc for your agent to follow. This can still be a really important step when vibe coding (or practicing "&lt;a href="https://martinfowler.com/articles/exploring-gen-ai/sdd-3-tools.html" rel="noopener noreferrer"&gt;spec-driven development&lt;/a&gt;").&lt;/p&gt;

&lt;p&gt;But it does mean that, with an opinionated full-stack framework, much less of your planning phases need to be devoted to discussing architectural and technical implementation details.&lt;/p&gt;




&lt;h2&gt;
  
  
  This Approach, In a Plugin
&lt;/h2&gt;

&lt;p&gt;If you want to put this theoretical approach I discussed above to the practical test, then I suggest you try out the &lt;a href="https://github.com/wasp-lang/wasp-agent-plugins/tree/main/plugins/wasp" rel="noopener noreferrer"&gt;Wasp plugin we created for Claude Code&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;We, the Wasp framework creators, maintain the plugin, so we've battle tested it with Wasp. Plus we're a very responsive community and we're listening to feedback and improving it all the time.&lt;/p&gt;

&lt;p&gt;Here's how to get started:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Install Wasp&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm i &lt;span class="nt"&gt;-g&lt;/span&gt; @wasp.sh/wasp-cli
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Install the Claude Code plugin&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# add the Wasp marketplace to Claude&lt;/span&gt;
claude plugin marketplace add wasp-lang/wasp-agent-plugins

&lt;span class="c"&gt;# install the plugin from the marketplace&lt;/span&gt;
claude plugin &lt;span class="nb"&gt;install &lt;/span&gt;wasp@wasp-agent-plugins &lt;span class="nt"&gt;--scope&lt;/span&gt; project
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Start a new Wasp project&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# create a new project&lt;/span&gt;
wasp new

&lt;span class="c"&gt;# change into the project root directory&lt;/span&gt;
&lt;span class="nb"&gt;cd&lt;/span&gt; &amp;lt;your-wasp-project&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Start a Claude Code session&lt;/strong&gt; in your Wasp project directory
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;claude
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Run the init command&lt;/strong&gt; to set up the plugin
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;/wasp-plugin-init
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;From there, you can tell Claude to "start the dev server" and it will walk you through spinning up fullstack visibility as we outlined above. Or ask it to implement a Wasp feature and watch it fetch version-matched documentation guides for you!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftqgrs1kgtovwm7obmz3p.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftqgrs1kgtovwm7obmz3p.webp" alt="Wasp Claude Code plugin in action"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;More importantly, Wasp as a framework pushes into territory that's even more AI-native than the rest, because of its central configuration file(s) where the app is defined.&lt;/p&gt;

&lt;p&gt;This main config file is like your app's blueprint. Wasp takes these declarations, and manages the code for those features for you.&lt;/p&gt;

&lt;p&gt;Take this example config file authentication snippet as reference:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;app TaskManager {
  wasp: { version: "^0.21.0" },
  title: "Task Manager",
  auth: {
    userEntity: User,
    methods: {
      email: {},
      google: {}
    },
    onAuthFailedRedirectTo: "/login"
  }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This is what an authentication implementation in Wasp looks like. That's it.&lt;/p&gt;

&lt;p&gt;This 8-line config generates what would typically require 500-800 lines of code: components, session handling, password hashing, OAuth flows, and database schemas. Claude just needs to know what auth methods you want.&lt;/p&gt;

&lt;p&gt;Claude doesn't need to worry about choosing what kind of auth implementation to use, or generating any of the glue code. It can just get straight to work building features.&lt;/p&gt;




&lt;h2&gt;
  
  
  When You DO Need the Fancy Stuff
&lt;/h2&gt;

&lt;p&gt;I've spent this whole article arguing that you can ignore a lot Claude Code features for fullstack app development. But I don't want to leave you with the impression that those features are useless.&lt;/p&gt;

&lt;p&gt;Custom subagents, commands, and skills shine when you're doing the same task repeatedly with consistent criteria, e.g.:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Testing&lt;/strong&gt; — A dedicated test-runner subagent that knows your testing patterns, runs suites, analyzes failures, and suggests fixes.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;&lt;a href="https://code.claude.com/docs/en/sub-agents#code-reviewer" rel="noopener noreferrer"&gt;Code Reviews&lt;/a&gt;&lt;/strong&gt; — A code review command or subagent that runs tests, fixes bugs, and reviews code after every development.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Running Scripts&lt;/strong&gt; — Skills can be useful if you have deterministic tasks you run often, like a deployment script or using a cli tool to convert your blog images to webp. Define them in a Skill and link those scripts to them, and Claude Code will run them when it deems it fit for the task at hand.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;These are tasks where you want the same process followed every time and where a well-configured subagent with specific rules makes sense.&lt;/p&gt;

&lt;p&gt;In most cases, reach for complexity only when the simpler approach stops working.&lt;/p&gt;




&lt;h2&gt;
  
  
  Now Build!
&lt;/h2&gt;

&lt;p&gt;With these three ingredients I think most fullstack app developers can get the vast majority of the work done without reaching for much more:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;An opinionated framework that handles architecture/boilerplate so Claude doesn't have to&lt;/li&gt;
&lt;li&gt;Version-matched documentation so Claude has up-to-date implementation details&lt;/li&gt;
&lt;li&gt;Full-stack visibility so Claude can see what's happening and fix it on its own&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;With these in place, Claude Code's basic toolset—exploring, planning, reading, writing, running commands—is enough to build real, complex fullstack applications. The subagents, hooks, plugins, and complex configurations are there if you need them, but honestly most of the time, you won't.&lt;/p&gt;

</description>
      <category>vibecoding</category>
      <category>fullstack</category>
      <category>ai</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Turn Claude Code into a Fullstack web app expert 🔌</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Tue, 23 Dec 2025 14:58:03 +0000</pubDate>
      <link>https://dev.to/wasp/turn-claude-code-into-a-fullstack-web-app-expert-1hbk</link>
      <guid>https://dev.to/wasp/turn-claude-code-into-a-fullstack-web-app-expert-1hbk</guid>
      <description>&lt;h2&gt;
  
  
  Get Even More Out of Claude Code with the Wasp Plugin
&lt;/h2&gt;

&lt;p&gt;Batteries-included frameworks are a great match for AI-assisted coding tools like &lt;a href="https://docs.anthropic.com/en/docs/claude-code" rel="noopener noreferrer"&gt;Claude Code&lt;/a&gt;. The frameworks themselves are opinionated and already take care of a lot of routine tasks and boilerplate, which makes the AI's output more deterministic and predictable. &lt;/p&gt;

&lt;p&gt;In effect, frameworks like Wasp take care of a lot of grunt work for you and your AI assistants, shifting the focus to the more complex and creative parts of your app.&lt;/p&gt;

&lt;p&gt;And now with Claude Code's plugin system, which bundles skills, commands, hooks, and rules, you can make sure that Claude Code has expert knowledge of Wasp.&lt;/p&gt;

&lt;p&gt;But configuring, testing, and maintaining all these Claude Code features for your specific projects can be a lot of work. Almost as much as just writing the code yourself (ironic, isn't it?)!&lt;/p&gt;

&lt;p&gt;Luckily for you, the the Wasp Team has created the &lt;a href="https://github.com/wasp-lang/claude-plugins/tree/main/plugins/wasp" rel="noopener noreferrer"&gt;Wasp Claude Code plugin&lt;/a&gt;, curated with the help of community and their own experience, that ensures you are getting the most out of Claude Code. &lt;/p&gt;

&lt;p&gt;

  &lt;iframe src="https://www.youtube.com/embed/beUTJYW65Bw"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;h2&gt;
  
  
  Turn Claude into a Wasp Expert
&lt;/h2&gt;

&lt;p&gt;Claude Code knows it can’t do everything perfectly, which is why it allows for user-defined commands, skills, hooks, and rules, which act as sources of knowledge and guardrails when working in your project. &lt;/p&gt;

&lt;p&gt;We’ve done the tedious work for you, and bundled a bunch of the essentials into the Claude Code plugin for Wasp. &lt;/p&gt;

&lt;p&gt;Here’s how you can try it once you’ve got &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; and &lt;a href="https://www.claude.com/product/claude-code" rel="noopener noreferrer"&gt;Claude Code&lt;/a&gt; installed:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; Add the Wasp x Claude Code Plugin Marketplace:
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;claude plugin marketplace add wasp-lang/claude-plugins
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;Install the plugin:
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;claude plugin install wasp@wasp-plugins --scope project
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;Once installed, initialize the plugin in a Claude Code session and follow the instructions:
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;/wasp:init
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2z67jbnowlzoeqe8988k.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2z67jbnowlzoeqe8988k.png" alt="Init the Claude Code x Wasp plugin"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With the plugin installed, Claude turns into a true Wasp expert by:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Using the right documentation&lt;/strong&gt; — Automatically fetches the correct Wasp docs for your project's version during development and debugging&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Avoiding common mistakes&lt;/strong&gt; — Provides Wasp-specific tips, patterns, and best practices so Claude doesn't hallucinate or use outdated approaches&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Guided workflows&lt;/strong&gt; — Skills and commands so Claude can walk you through setting up Wasp's batteries-included features: auth, email, database, deploying, etc.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Full debugging visibility&lt;/strong&gt; — Start managed databases, dev servers, and connect browser console access so Claude has full development and debugging visibility across the entire stack&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The result: Claude actually understands Wasp instead of guessing and can get the most out of Wasp features to help you spend less time managing boilerplate or debugging errors, and more time building and shipping app features.&lt;/p&gt;

&lt;h2&gt;
  
  
  Give Claude the Wheel, Or Let it Be Your Backseat Driver
&lt;/h2&gt;

&lt;p&gt;One of the most important features of the plugin is that it gives Claude everything it needs to get your Wasp app setup and running locally, with full visibility into what’s going on with your app.&lt;/p&gt;

&lt;p&gt;For example, Claude can use the Plugin’s skills to easily setup, run and monitor Wasp’s:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;managed Postgres DB server,&lt;/li&gt;
&lt;li&gt;local development servers, and&lt;/li&gt;
&lt;li&gt;a Chrome instance&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;By leveraging these Wasp features, you give Claude &lt;em&gt;instant&lt;/em&gt; access to logs across the entire stack and can drastically reduce development and debugging feedback loops.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F76psm63ke9ro4rbt3h6w.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F76psm63ke9ro4rbt3h6w.png" alt="Claude Code fetching Wasp LLM-friendly Docs"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;On top of that, we’ve added hooks to ensure Claude checks your project’s Wasp version and always pulls the correct LLM-friendly docs before performing important Wasp-related tasks.&lt;/p&gt;

&lt;p&gt;Here are some examples of things you can ask Claude to help with: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;em&gt;"Add &lt;code&gt;Google authentication&lt;/code&gt; to my app"&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;"Migrate the database from &lt;code&gt;SQLite&lt;/code&gt; to &lt;code&gt;PostgreSQL&lt;/code&gt; and start it for me”&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;"Deploy my app to &lt;code&gt;Railway&lt;/code&gt; for me”&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;"Help me add &lt;code&gt;ShadCN UI&lt;/code&gt; to my app to build a dashboard"&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;"Start a new SaaS app using &lt;code&gt;Wasp's SaaS starter template&lt;/code&gt;"&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;"Why isn't my &lt;code&gt;recurring job&lt;/code&gt; working?"&lt;/em&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;With the Wasp plugin, Claude Code will know exactly how to take care of these tasks in your Wasp app, and can take full control of implementation, or guide you through the process.&lt;/p&gt;

&lt;p&gt;We’ve also loaded the plugin with straight-forward slash commands, such as &lt;code&gt;/wasp:help&lt;/code&gt; so that you can always quickly reference what the plugin can do.&lt;/p&gt;

&lt;h2&gt;
  
  
  What’s Next
&lt;/h2&gt;

&lt;p&gt;The focus for the first iteration of the plugin was to give Claude good fundamentals Wasp knowledge.&lt;/p&gt;

&lt;p&gt;For the future, we’ll expand it with better guardrails and more skills and workflows to really speed up development. We’ll also be adding a separate plugin for &lt;a href="https://opensaas.sh" rel="noopener noreferrer"&gt;Open SaaS&lt;/a&gt;, our open-source SaaS starter built on Wasp, to get you shipping SaaS apps easier and quicker.&lt;/p&gt;

&lt;p&gt;And if you have any feedback or ideas on how to improve the plugin, &lt;a href="https://github.com/wasp-lang/claude-plugins/issues" rel="noopener noreferrer"&gt;let us know&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>tooling</category>
      <category>webdev</category>
      <category>javascript</category>
      <category>llm</category>
    </item>
    <item>
      <title>🎨 Join Wasp Design-AI-Thon - Pimp our website and win TRMNL, Playdate, and OB-4! 🤖</title>
      <dc:creator>Matija Sosic</dc:creator>
      <pubDate>Mon, 13 Oct 2025 13:39:38 +0000</pubDate>
      <link>https://dev.to/wasp/join-wasp-design-ai-thon-pimp-our-website-and-win-trmnl-playdate-and-ob-4-3gj8</link>
      <guid>https://dev.to/wasp/join-wasp-design-ai-thon-pimp-our-website-and-win-trmnl-playdate-and-ob-4-3gj8</guid>
      <description>&lt;p&gt;As promised at the start of this Launch Week, we're bringing our hackathon back! And this time, it's a bit special - &lt;strong&gt;we're asking you to give a revamp to Wasp's website!&lt;/strong&gt; Our design is kinda dated and looks like it was done by a backend engineer (looking at myself), and we think it's about time we did something about it!&lt;/p&gt;

&lt;p&gt;We want to come up with something fun and not what you see every day, which reflects our style and personality.&lt;/p&gt;

&lt;p&gt;The only rule is: there are no rules!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2n88aqz3qvlkyb78u66s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2n88aqz3qvlkyb78u66s.png" alt="cool prizes"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Key things to know
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;You have 10 days to create a redesigned mock-up of &lt;a href="https://wasp.sh/" rel="noopener noreferrer"&gt;Wasp's website&lt;/a&gt;

&lt;ul&gt;
&lt;li&gt;Starting 10:00 am PT Friday, Oct 10th, 2025&lt;/li&gt;
&lt;li&gt;The submission deadline is &lt;strong&gt;11:59 pm Sunday, midnight PT, Oct 19th, 2025&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;Use any tool or format - code, Figma design, drawing. Anything.&lt;/li&gt;

&lt;li&gt;You're welcome to adapt the copy on the website. If you have an idea for a tagline you think would work better (e.g., "Laravel for JS"), we'd love to see it!&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;You can find Wasp's existing website code and use it as a starting point &lt;a href="https://github.com/wasp-lang/wasp/blob/release/web/src/pages/index.jsx" rel="noopener noreferrer"&gt;here&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  FAQ
&lt;/h2&gt;

&lt;p&gt;Here are answers to some questions you might have. If there is something we haven't covered, ping us on &lt;a href="https://discord.com/invite/rzdnErX" rel="noopener noreferrer"&gt;Discord&lt;/a&gt;!&lt;/p&gt;

&lt;h3&gt;
  
  
  What should I create? What level of fidelity should it be?
&lt;/h3&gt;

&lt;p&gt;We leave this part up to you. Whatever you think might be a good way to represent your idea on how to upgrade Wasp's page design and/or branding. It could be a page you actually coded and deployed, a Figma/Illustrator design, a drawing or a video in which you present your vision.&lt;/p&gt;

&lt;p&gt;Maybe even a poem. Ok, probably not, but would be interesting to see someone give it a try.&lt;/p&gt;

&lt;p&gt;To get your juices flowing, here's an example we played around with internally :&lt;br&gt;


  &lt;iframe src="https://www.youtube.com/embed/5UWX6XkkbL4"&gt;
  &lt;/iframe&gt;


&lt;/p&gt;

&lt;h3&gt;
  
  
  How much of the website should I mock up?
&lt;/h3&gt;

&lt;p&gt;You can go as far as you want. As a minimum, we recommend focusing on the Above-The-Fold aka Hero section of the page. That is the portion of the page you see on your screen when it loads for the first time, before you scroll down.&lt;/p&gt;

&lt;h3&gt;
  
  
  Which tools should I use? Can I use AI?
&lt;/h3&gt;

&lt;p&gt;Of course! As the title says, it's a design-AI-thon. We believe that AI has made better design more accessible to anyone (even backend engineers, although that's a tough one) and would love to see it in action!&lt;/p&gt;

&lt;p&gt;You're of course also free to go old-school and do it Figma/Sketch/Photoshop/Illustrator or any other design tool out there.&lt;/p&gt;

&lt;h2&gt;
  
  
  Prizes
&lt;/h2&gt;

&lt;p&gt;There are 3 categories, and there will be prizes for:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Best overall project&lt;/li&gt;
&lt;li&gt;Most fun / innovative&lt;/li&gt;
&lt;li&gt;Most technically impressive&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;For the prizes themselves, we'll give away three beautifully designed pieces of hardware. We think that is just right for the theme of this competition, and will inspire you to channel your inner Jony Ive or Dieter Rams.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F7xbkr4wuvintrlql3v7f.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F7xbkr4wuvintrlql3v7f.png" alt="prizes"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Prize #1: &lt;a href="https://teenage.engineering/store/ob-4-ochre" rel="noopener noreferrer"&gt;OB-4 Bluetooth Loudspeaker by teenage engineering&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;Prize #2: &lt;a href="https://usetrmnl.com/" rel="noopener noreferrer"&gt;TRMNL - E-ink companion for your desk&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;Prize #3: &lt;a href="https://play.date/shop/playdate/" rel="noopener noreferrer"&gt;Playdate - A tiny handheld game system. With The Crank.&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Special thanks go to folks at TRMNL for offering to sponsor this event by gifting a device! Seems like me tweeting a lot of stuff eventually pays off!&lt;/p&gt;

&lt;p&gt;&lt;em&gt;&lt;strong&gt;A lil' disclaimer&lt;/strong&gt;: If for some reason we can't get our hands on one of the prizes, or can't ship it to your location, we'll swap it out for something just as cool (promise!).&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Submission
&lt;/h2&gt;

&lt;p&gt;You should submit your project using the &lt;a href="https://e44cy1h4s0q.typeform.com/to/ZjN0Dr0j" rel="noopener noreferrer"&gt;submission form&lt;/a&gt; before 11:59 pm PT, Sunday, October 19th, 2025.&lt;/p&gt;

&lt;h2&gt;
  
  
  Judging
&lt;/h2&gt;

&lt;p&gt;The Wasp team will judge the winners for each category. We will be looking for:&lt;/p&gt;

&lt;h2&gt;
  
  
  Creativity &amp;amp; thinking out of the box
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;How well it showcases Wasp’s playful personality&lt;/li&gt;
&lt;li&gt;Visually pleasing&lt;/li&gt;
&lt;li&gt;Attention to detail&lt;/li&gt;
&lt;li&gt;Fun!&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Rules
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Multiple submissions are allowed. You can do as many as you want.&lt;/li&gt;
&lt;li&gt;You must submit before the deadline (no late entries)&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Additional info
&lt;/h2&gt;

&lt;p&gt;By making a submission, you grant Wasp permission to use screenshots, code snippets, and/or links to your project on our Twitter, blog, website, email updated, and in the Wasp discord server.&lt;/p&gt;

&lt;p&gt;That's - it have fun. Find your inner artist, pair it with AI and let the sparks fly. We can't wait to see what you come up with!&lt;/p&gt;

</description>
      <category>vibecoding</category>
      <category>design</category>
      <category>webdev</category>
      <category>hackathon</category>
    </item>
    <item>
      <title>Open SaaS v2.0 -- ShadCN UI, LLM-friendly, MoRs, and more.</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Tue, 29 Jul 2025 10:23:42 +0000</pubDate>
      <link>https://dev.to/wasp/open-saas-v20-shadcn-ui-llm-friendly-mors-and-more-ga</link>
      <guid>https://dev.to/wasp/open-saas-v20-shadcn-ui-llm-friendly-mors-and-more-ga</guid>
      <description>&lt;p&gt;What could make a free, open-source, full-featured SaaS boilerplate even better? Probably a fresh new look on top the hottest UI library out there, plus a slew of new features.&lt;/p&gt;

&lt;p&gt;Well, that's exactly what we've done with Open SaaS v2.0.&lt;/p&gt;

&lt;p&gt;Oh, and we're launching it on &lt;a href="https://x.com/hot_town/status/1950117243246821770" rel="noopener noreferrer"&gt;Product Hunt&lt;/a&gt;, so go show your support for open-source SaaS dopeness! 🙏&lt;/p&gt;

&lt;p&gt;&lt;iframe class="tweet-embed" id="tweet-1950117243246821770-679" src="https://platform.twitter.com/embed/Tweet.html?id=1950117243246821770"&gt;
&lt;/iframe&gt;

  // Detect dark theme
  var iframe = document.getElementById('tweet-1950117243246821770-679');
  if (document.body.className.includes('dark-theme')) {
    iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1950117243246821770&amp;amp;theme=dark"
  }



&lt;/p&gt;

&lt;p&gt;The most significant change is a complete redesign using Shadcn UI, providing a more modern, consistent, and customizable experience out of the box. This update also includes key framework upgrades, new integrations, and significant codebase improvements to help you build your SaaS faster than ever.&lt;/p&gt;

&lt;p&gt;You're welcome.&lt;/p&gt;

&lt;h2&gt;
  
  
  New Look with Shadcn UI
&lt;/h2&gt;

&lt;p&gt;People &lt;a href="https://www.producthunt.com/products/open-saas/reviews" rel="noopener noreferrer"&gt;really love Open SaaS&lt;/a&gt;, but we knew from the start that if there were a way to improve it, than it would be to offer a better look and feel.&lt;/p&gt;

&lt;p&gt;So we've done just that.&lt;/p&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/ehbzm4HJlzM"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;You probably noticed that the design is cleaner, more consistent, and offers more interactive elements. But it's also completely redesigned on top of &lt;a href="https://ui.shadcn.com/" rel="noopener noreferrer"&gt;Shadcn UI&lt;/a&gt; (which is also open source!), so you get a modern, composable, and highly customizable experience out of the box.&lt;/p&gt;

&lt;p&gt;On top of that, we've also made the styles easily themable, and in the future we'll be offering a slick way to find and use a great looking theme, as well as a range of different Landing Page templates for you to choose from. So stay tuned for that!&lt;/p&gt;

&lt;p&gt;Now on to the new features!&lt;/p&gt;

&lt;h2&gt;
  
  
  New Features
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Lemon Squeezy, Polar, and Paddle Merchants of Record
&lt;/h3&gt;

&lt;p&gt;Merchants of Record (MoR) are great. They're a layer on top of payment processors like Stripe that take the pain out of the legalities and tax compliance of being a merchant.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ru113d22vrt207fr1bm.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ru113d22vrt207fr1bm.webp" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We've added support for &lt;a href="https://www.lemonsqueezy.com/" rel="noopener noreferrer"&gt;Lemon Squeezy&lt;/a&gt; with &lt;a href="https://www.polar.sh/" rel="noopener noreferrer"&gt;Polar&lt;/a&gt; integration &lt;a href="https://github.com/wasp-lang/open-saas/issues/441#issuecomment-3057897604" rel="noopener noreferrer"&gt;in the works&lt;/a&gt; as we speak! Choose the payment processor that best fits your SaaS if Stripe is too granular for your needs.&lt;/p&gt;

&lt;p&gt;And while we're working on Polar right now, next up &lt;a href="https://github.com/wasp-lang/open-saas/issues/445" rel="noopener noreferrer"&gt;we'll be adding support for Paddle&lt;/a&gt; as a MoR to satisfy the needs of the broader international indiehacker community.&lt;/p&gt;

&lt;h3&gt;
  
  
  LLM-friendly Docs and Rules
&lt;/h3&gt;

&lt;p&gt;One of the best use cases for LLM-assisted coding is to get precise answers to your questions about a codebase or library. You can pass it the docs, ask your questions, and get context-aware answers.&lt;/p&gt;

&lt;p&gt;So we've added an LLM-friendly version of the Open SaaS docs, as well as the Wasp framework docs, to make it easier for you to use in your AI coding environments.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fww8a5ow86qlhdosb31vn.webp" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fww8a5ow86qlhdosb31vn.webp" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Just add the following urls to your AI coding environment such as Cursor, Copilot, etc, and mention it in your prompt to get precise answers to your Open SaaS and Wasp framework questions.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Open SaaS AI-friendly docs:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://docs.opensaas.sh/llms-full.txt
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Wasp framework AI-friendly docs:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;https://wasp.sh/llms-full.txt
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In addition, we've also got a full set of project-specific Cursor rules files that you can use to make sure your AI assistants stay on the right track. These can be adapted to use with Claude Code, Windsurf, and more.&lt;/p&gt;

&lt;h3&gt;
  
  
  End-to-End Testing with Playwright
&lt;/h3&gt;

&lt;p&gt;One thing I hate about building a SaaS is that I'm constantly worried it might break after adding a new feature. To give you peace of mind, we've integrated a full suite of end-to-end tests using &lt;a href="https://playwright.dev/" rel="noopener noreferrer"&gt;Playwright&lt;/a&gt;. These tests act like a robot user, clicking through your app to verify that everything from user sign-ups to critical payment flows is working exactly as it should.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzhrzoyfnh13qsf8zuzuh.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzhrzoyfnh13qsf8zuzuh.png" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;But we didn't just write tests for ourselves. We've provided the entire setup, &lt;a href="https://docs.opensaas.sh/guides/tests/" rel="noopener noreferrer"&gt;including a CI/CD workflow&lt;/a&gt; file for GitHub Actions. This means you can automatically run these checks on every code change, ensuring you never accidentally break your production app. Ship with confidence, knowing your core features are easily protected, and use our test suite as a foundation for your own custom test cases.&lt;/p&gt;

&lt;h3&gt;
  
  
  More Refactors &amp;amp; Improvements
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frgl371tqdsvfc3ldtb4m.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frgl371tqdsvfc3ldtb4m.jpg" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;On top of the headlining features, we've been busy shipping a ton of other improvements to make your life easier. We've squashed bugs, upgraded major dependencies like Node.js and the Wasp framework, and completely refactored the codebase for better organization. We also threw in some handy new integrations like enhanced file uploads with progress bars and a cookie consent banner. Here's a quick rundown of other key changes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;New Features &amp;amp; Integrations 🚀&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Enhanced File Uploads&lt;/strong&gt;: The file upload functionality has been improved with features like progress bars and validation. The S3 CORS configuration was tightened for improved security.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Cookie Consent&lt;/strong&gt;: A cookie consent banner has been implemented.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;&lt;strong&gt;Major Dependency and Framework Upgrades 🛠️&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Wasp Framework&lt;/strong&gt;: There have been multiple upgrades to the Wasp framework, moving from version 0.13.0 up to 0.16.0 and beyond. This indicates active maintenance and adoption of new Wasp features.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;SDKs&lt;/strong&gt;: The AWS and OpenAI SDKs have been updated to their latest versions.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Node.js&lt;/strong&gt;: The environment has been updated to Node.js version 20.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;&lt;strong&gt;Codebase Refactoring and Organization 🗂️&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Vertical Reorganization&lt;/strong&gt;: A major refactoring effort was undertaken to organize the codebase "vertically". Functionality for features like &lt;code&gt;auth&lt;/code&gt;, &lt;code&gt;payments&lt;/code&gt;, &lt;code&gt;users&lt;/code&gt;, and &lt;code&gt;file-upload&lt;/code&gt; are now grouped together, improving modularity.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;User Management&lt;/strong&gt;: Significant refactoring was done on the user management and administration pages.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;&lt;strong&gt;Documentation and Content 📚&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A substantial number of commits are related to adding new blog posts, updating documentation, and creating other content. This reflects a strong focus on community engagement and developer resources.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  Help Us, Help You!
&lt;/h2&gt;

&lt;p&gt;We're not done yet. We're going to keep listening to our commonunity and improving Open SaaS.&lt;/p&gt;

&lt;p&gt;So if you've got ideas on how to improve it, please create a &lt;a href="https://github.com/wasp-lang/open-saas/issues" rel="noopener noreferrer"&gt;GitHub issue&lt;/a&gt; or &lt;a href="https://github.com/wasp-lang/open-saas/pulls" rel="noopener noreferrer"&gt;submit a pull request&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Got a cool landing page variation? Submit a PR!&lt;br&gt;
Found a bug? Create an issue!&lt;/p&gt;

&lt;p&gt;Want to support us? Star the &lt;a href="https://github.com/wasp-lang/open-saas" rel="noopener noreferrer"&gt;repo on GitHub&lt;/a&gt;!&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>saas</category>
      <category>boilerplate</category>
      <category>react</category>
    </item>
    <item>
      <title>From 0 to 10K ⭐: How Open SaaS became the Free Boilerplate Devs Love</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Tue, 29 Apr 2025 11:51:32 +0000</pubDate>
      <link>https://dev.to/wasp/from-0-to-10k-how-open-saas-became-the-free-boilerplate-devs-love-45hb</link>
      <guid>https://dev.to/wasp/from-0-to-10k-how-open-saas-became-the-free-boilerplate-devs-love-45hb</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ft6ar3lb0rvpumm1icncs.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ft6ar3lb0rvpumm1icncs.png" alt="Open SaaS is just WOW! I love it. This is how saas boilerplate templates should be!"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Open SaaS Story
&lt;/h2&gt;

&lt;p&gt;When building an app, I want to start on the &lt;strong&gt;unique idea&lt;/strong&gt; that sparked the project in the first place, not spend weeks configuring auth, payments, and user management.&lt;/p&gt;

&lt;p&gt;Of course, there are paid 3rd-party solutions for integrating things like authentication, cron jobs, and email sending quickly. And paid SaaS boilerplates exist, too.&lt;/p&gt;

&lt;p&gt;But when I looked there was surprisingly no great full-featured, open-source solution for building a SaaS quickly.&lt;/p&gt;

&lt;p&gt;So I decided to build one.&lt;/p&gt;

&lt;p&gt;And I'm excited to announce that &lt;strong&gt;it now has over 10,000 stars on GitHub&lt;/strong&gt;!&lt;/p&gt;

&lt;h2&gt;
  
  
  What is Open SaaS?
&lt;/h2&gt;

&lt;p&gt;For those unfamiliar, &lt;a href="https://opensaas.sh/" rel="noopener noreferrer"&gt;Open SaaS&lt;/a&gt; is a &lt;strong&gt;100% free and open-source, batteries-included SaaS starter kit&lt;/strong&gt;, built on top of the &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; full-stack framework (using React, Node.js, and Prisma). &lt;/p&gt;

&lt;p&gt;Its mission is simple: &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Accelerate and focus your SaaS development&lt;/strong&gt; by providing an open-source, full-featured foundation with essential features, like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Authentication (email, google, github, etc.)&lt;/li&gt;
&lt;li&gt;Payments (Stripe or Lemon Squeezy integration)&lt;/li&gt;
&lt;li&gt;Example Apps w/ the OpenAI API&lt;/li&gt;
&lt;li&gt;AWS S3 File Upload&lt;/li&gt;
&lt;li&gt;Email sending&lt;/li&gt;
&lt;li&gt;Admin dashboard&lt;/li&gt;
&lt;li&gt;And more, right out of the box&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The best part is that it doesn't rely on a ton of paid 3rd-party services like other templates do, so you own more of your app (oh, and you can deploy it wherever you want, too).&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fem2jmugc5nplww5gk47t.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fem2jmugc5nplww5gk47t.png" alt="Open SaaS GitHub Star Chart"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Since its launch, Open SaaS hasn't just gathered stars; it has empowered developers to &lt;a href="https://docs.opensaas.sh/blog/2025-03-12-going-from-an-idea-to-mvp-in-weeks-promptpandas-launches/" rel="noopener noreferrer"&gt;launch countless projects faster&lt;/a&gt;, turning ideas into &lt;a href="https://wasp.sh/blog/2024/09/17/from-idea-to-20k-in-days-how-wasp-accelerated-nuloapps-launch" rel="noopener noreferrer"&gt;profitable businesses, sometimes in a matter of days&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://scribeist.com/" rel="noopener noreferrer"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkmgpbi021sqv7tvqiqeo.png" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It's been crazy to see the apps and businesses people are building with it, like some of these below (yes, all of them were built with Open SaaS 🤩):&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.searchcraft.io/" rel="noopener noreferrer"&gt;SearchCraft.io&lt;/a&gt; - powerful search SDK&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.promptpanda.io/" rel="noopener noreferrer"&gt;Prompt Panda&lt;/a&gt; - prompt library &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://scribeist.com/" rel="noopener noreferrer"&gt;Scribeist&lt;/a&gt; - SEO-optimized AI writing&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Besides all the cool stuff being built with it, an interesting side-effect of Open SaaS is that it has also become the cornerstone of the &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp ecosystem&lt;/a&gt;, demonstrating the framework's power and really delighting developers in the process.&lt;/p&gt;

&lt;h3&gt;
  
  
  Support us! 🙏⭐️
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fid9s6t8rcvfxty40bv2m.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fid9s6t8rcvfxty40bv2m.gif" alt="GH star click"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Everything we do at Wasp is open-source. You can show &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;your support by giving us a star on Github&lt;/a&gt;. It helps us make web development easier and motivates us to write more articles like this!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqgbmn45pia04bxt6zf83.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqgbmn45pia04bxt6zf83.gif" alt="support us"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/wasp-lang/wasp" class="crayons-btn crayons-btn--primary" rel="noopener noreferrer"&gt;⭐️ Thanks For Your Support 🙏&lt;/a&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Under the Hood: The Wasp Advantage
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://wasp.sh/blog/2024/01/30/open-saas-free-open-source-starter-react-nodejs" rel="noopener noreferrer"&gt;Launched in December 2023&lt;/a&gt;, Open SaaS adoption took off almost immediately. The positive reception was surprising, but it confirmed our belief that developers needed a high-quality, open-source SaaS boilerplate starter. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsza7orzu4bdnlfsnbxp3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsza7orzu4bdnlfsnbxp3.png" alt="The open-saas template is great starting point. I'm managing my db, back end functions, actions, queries, all with so much ease."&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;While Open SaaS leverages familiar tools like React, NodeJS, and Prisma, and comes with a bunch of built-in examples like an OpenAI example app, AWS S3 file storage, and more, its secret sauce lies in its core tool choice that glues them all together: the &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp framework&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;Wasp is special because it's the only full-stack framework that &lt;em&gt;actually manages&lt;/em&gt; the tedious boilerplate that plagues modern web development. &lt;/p&gt;

&lt;p&gt;It does this through its use of a central config file and its compiler, allowing developers (and AI) to define tons of full-stack features in just a few lines of code.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6w63w4bql0eh5fnw1etm.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6w63w4bql0eh5fnw1etm.png" alt="Say What!?"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  The Central Nervous System: &lt;code&gt;main.wasp&lt;/code&gt;
&lt;/h3&gt;

&lt;p&gt;Think of the &lt;code&gt;main.wasp&lt;/code&gt; config file as the &lt;strong&gt;central nervous system&lt;/strong&gt; of your application. Here, you declaratively define key aspects of your app:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Authentication methods&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Database models&lt;/strong&gt; (via Prisma integration)&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Routes and Pages&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;API endpoints&lt;/strong&gt; (Queries and Actions)&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Background jobs&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Email sending&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;  ...and more.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This configuration file acts as a single &lt;strong&gt;"source of truth"&lt;/strong&gt; for your app's architecture, a concept highlighted in our &lt;a href="https://dev.to/wasp/a-structured-workflow-for-vibe-coding-full-stack-apps-352l"&gt;post on AI-assisted workflows&lt;/a&gt;, and it's how you can get complex web app features really quickly and easily as a developer.&lt;/p&gt;

&lt;p&gt;Here's a quick code snippet of what a &lt;code&gt;main.wasp&lt;/code&gt; file looks like:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="nx"&gt;app&lt;/span&gt; &lt;span class="nx"&gt;exampleApp&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;wasp&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;version&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;^0.16.3&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="nx"&gt;title&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Example App&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;auth&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nl"&gt;userEntity&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;User&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="nx"&gt;methods&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nl"&gt;email&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{},&lt;/span&gt;
      &lt;span class="nx"&gt;github&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{},&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;route&lt;/span&gt; &lt;span class="nx"&gt;LoginRoute&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nl"&gt;path&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/login&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;page&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;component&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/auth/login&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;route&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesRoute&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nl"&gt;path&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/envelopes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;page&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;authRequired&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;component&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/EnvelopesPage.tsx&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;query&lt;/span&gt; &lt;span class="nx"&gt;getEnvelopes&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;fn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;getEnvelopes&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/operations.ts&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;entities&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;Envelope&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;UserBudgetProfile&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;action&lt;/span&gt; &lt;span class="nx"&gt;createEnvelope&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;fn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;createEnvelope&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/operations.ts&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;entities&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;Envelope&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;UserBudgetProfile&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; 
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="c1"&gt;//...&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  The Wasp Compiler: Where the Magic Happens
&lt;/h3&gt;

&lt;p&gt;Then, the &lt;strong&gt;Wasp compiler&lt;/strong&gt; takes over. It analyzes your &lt;code&gt;.wasp&lt;/code&gt; declarations alongside your custom React and Node.js code (where you write your specific business logic) and intelligently generates the complete underlying code. &lt;/p&gt;

&lt;p&gt;This includes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  Setting up the server and database connections.&lt;/li&gt;
&lt;li&gt;  Wiring up communication between client and server with full type-safety.&lt;/li&gt;
&lt;li&gt;  Handling complex authentication flows and session management.&lt;/li&gt;
&lt;li&gt;  Simplifying deployment with commands like &lt;code&gt;wasp deploy&lt;/code&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F42n18hzcd374nu3587zd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F42n18hzcd374nu3587zd.png" alt="Wasp Architecture Diagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Using this as the basis for Open SaaS, this translates directly into &lt;em&gt;less code and complexity&lt;/em&gt; for essential features. &lt;/p&gt;

&lt;p&gt;In other words, you get to &lt;strong&gt;focus solely on building your unique product&lt;/strong&gt;, rather than struggling with putting all the pieces together.&lt;/p&gt;

&lt;p&gt;Implementing a new authentication method, adding background jobs, or defining protected routes is as easy as a couple lines of code in the &lt;code&gt;main.wasp&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;This allows Open SaaS apps to be feature-rich yet maintainable and, crucially, easy to understand and extend.&lt;/p&gt;

&lt;h2&gt;
  
  
  Open SaaS + AI = Vibe Coding Superpowers
&lt;/h2&gt;

&lt;p&gt;This also means that Open SaaS is exceptionally well-suited for AI-assisted development. &lt;/p&gt;

&lt;p&gt;Why? &lt;/p&gt;

&lt;p&gt;Because the effectiveness of AI-assisted development (or "vibe coding" as some call it) &lt;em&gt;heavily depends&lt;/em&gt; on the underlying codebase structure and clarity.&lt;/p&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/WYzEROo7reY"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Open SaaS's foundation on Wasp makes it exceptionally well-suited for AI-assisted development for two key reasons:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Clear Architecture through Wasp's Config:&lt;/strong&gt; The &lt;code&gt;main.wasp&lt;/code&gt; file serves as a perfect "source of truth" for AI tools. &lt;/p&gt;

&lt;p&gt;When an AI assistant needs to understand your app's structure – its routes, models, operations, and features – everything is clearly laid out in one declarative file. &lt;/p&gt;

&lt;p&gt;This makes it &lt;em&gt;significantly easier&lt;/em&gt; for AI to comprehend the context and generate accurate, relevant code.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Focus on Business Logic:&lt;/strong&gt; Since Wasp's compiler handles the underlying infrastructure, both you and your AI assistant can focus purely on implementing your unique features. &lt;/p&gt;

&lt;p&gt;No time is wasted having the AI generate or explain boilerplate code for auth flows, API setup, or database connections – Wasp handles all of that.&lt;/p&gt;

&lt;p&gt;This means that LLMs have considerably less code to write, and can pass of the complexity of connecting the different parts of the stack to Wasp. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8y1v7ymxpkdkxx95odvd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8y1v7ymxpkdkxx95odvd.png" alt="Noice"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;(BTW, If you're curious to see how using Open SaaS with AI-assisted development tools like Cursor looks like, make sure to check out this &lt;a href="https://www.youtube.com/watch?v=WYzEROo7reY" rel="noopener noreferrer"&gt;3 hour walkthrough tutorial on YouTube&lt;/a&gt;)&lt;/p&gt;

&lt;p&gt;Using AI tools in a vibe coding workflow like this on top of Open SaaS's robust foundation creates a powerful development environment where you and your LLM buddy only have to focus on the fun stuff – &lt;strong&gt;the business logic of your SaaS app&lt;/strong&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Future of Open SaaS
&lt;/h2&gt;

&lt;p&gt;Hitting 10,000 GitHub stars is a milestone, but it's just the beginning. The community and I are actively working on making Open SaaS even more powerful and flexible.&lt;/p&gt;

&lt;p&gt;Here's some stuff we have in store for you:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Complete Redesign w/ Shadcn UI:&lt;/strong&gt; We're working on a complete redesign of the Open SaaS template to make it even more modern and user-friendly by leveraging the power of &lt;a href="https://ui.shadcn.com/" rel="noopener noreferrer"&gt;Shadcn UI&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;More Example Apps:&lt;/strong&gt; Ready-to-use app templates, like ones that leverage AI APIs (because GPT Wrappers are in!).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Enhanced Admin Features:&lt;/strong&gt; Expanding the admin dashboard with more analytics, role-based authentication, and customization options.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;BTW, if you have any feature requests, please let us know by creating an issue or a discussion on &lt;a href="https://github.com/wasp-lang/open-saas/issues" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Whether you're a React developer looking to contribute new features, a designer interested in improving the UI, or someone who just found a bug, don't be shy!&lt;/p&gt;

&lt;h2&gt;
  
  
  Ready to Build Your SaaS?
&lt;/h2&gt;

&lt;p&gt;In just a few months, Open SaaS has grown from an idea to &lt;a href="https://github.com/topics/saas" rel="noopener noreferrer"&gt;one of the most popular SaaS repos on GitHub&lt;/a&gt; that's helping developers launch SaaS applications by writing less boilerplate code.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/topics/saas" rel="noopener noreferrer"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqmqyj0dio07o2lbtqn6w.png" alt="Open SaaS -- GitHub Topics "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;By combining:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A robust, full-featured SaaS starter&lt;/li&gt;
&lt;li&gt;The power and simplicity of the Wasp framework&lt;/li&gt;
&lt;li&gt;An active, supportive community&lt;/li&gt;
&lt;li&gt;AI-friendly architecture for modern development workflows&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Open SaaS has become &lt;strong&gt;more than just a template&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;If you wanna start building your SaaS, all you need to get started is &lt;a href="https://wasp.sh/docs/quick-start" rel="noopener noreferrer"&gt;install Wasp&lt;/a&gt; and get the Open SaaS template by running:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;curl &lt;span class="nt"&gt;-sSL&lt;/span&gt; https://get.wasp.sh/installer.sh | sh
wasp new &lt;span class="nt"&gt;-t&lt;/span&gt; saas
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;After that, check out the &lt;a href="https://docs.opensaas.sh" rel="noopener noreferrer"&gt;Open SaaS documentation 📚 &lt;/a&gt; where everything you need to know is outlined for you, along with step-by-step setup guides!&lt;/p&gt;

&lt;p&gt;And don't forget to:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;⭐️ Star &lt;a href="https://github.com/wasp-lang/open-saas" rel="noopener noreferrer"&gt;Open SaaS on GitHub&lt;/a&gt; to support the project&lt;/li&gt;
&lt;li&gt;⭐️ Star &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;Wasp on GitHub&lt;/a&gt; to support the framework&lt;/li&gt;
&lt;li&gt;💬 Join the &lt;a href="https://discord.com/invite/rzdnErX" rel="noopener noreferrer"&gt;Wasp Discord community&lt;/a&gt; to connect with other builders&lt;/li&gt;
&lt;/ul&gt;

</description>
    </item>
    <item>
      <title>🐝 Wasp: a full-stack, "Laravel for JS" framework. Vibe-coding approved 🕹️</title>
      <dc:creator>Matija Sosic</dc:creator>
      <pubDate>Wed, 23 Apr 2025 12:57:21 +0000</pubDate>
      <link>https://dev.to/wasp/wasp-a-full-stack-laravel-for-js-framework-vibe-coding-approved-473g</link>
      <guid>https://dev.to/wasp/wasp-a-full-stack-laravel-for-js-framework-vibe-coding-approved-473g</guid>
      <description>&lt;h2&gt;
  
  
  What is Laravel, and why do I need it for JavaScript?
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwqcjhkscdkzc2wls54yp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwqcjhkscdkzc2wls54yp.png" alt="Laravel"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Laravel is one of the most popular web frameworks for PHP. It was released in 2011 and has since become a synonym for a well-designed, enjoyable developer experience. Its "superpower" is that it provides pretty much everything you need with the best practices out of the box. Authentication, ORM, emails, jobs, testing - there is a "Laravel" way to do it, and there's nothing for you to figure out - it all just works!&lt;/p&gt;

&lt;p&gt;On the other hand, the JavaScript ecosystem is on the drastically opposite spectrum. There is a standalone library/service for pretty much every web app feature, and it's up to you to figure out the best way to integrate it all together.&lt;/p&gt;

&lt;p&gt;It can be fun to hand-select every part of your stack, but it can also be quite frustrating when you have an idea and want to get it out to users as soon as possible.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fez58r15o360rr7e09t1k.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fez58r15o360rr7e09t1k.png" alt="give us Laravel for JS"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This is why developers who used all-in-one full-stack frameworks such as Laravel, Rails, and Django have been very strongly calling for the same experience in JavaScript.&lt;/p&gt;

&lt;p&gt;There are historical and maturity reasons &lt;a href="https://wasp.sh/blog/2024/05/29/why-we-dont-have-laravel-for-javascript-yet" rel="noopener noreferrer"&gt;why we didn't have that in JavaScript for so long&lt;/a&gt;, but finally, the times are changing.&lt;/p&gt;

&lt;p&gt;There are multiple solutions and frameworks that aim to solve this problem, and today we'll take a look at one of the fastest-growing among them: Wasp! 🐝&lt;/p&gt;

&lt;h2&gt;
  
  
  Wasp: A full-stack, “Laravel for JS” framework. Great for vibe-coders, too!
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fi35j142goaeg6msqpvtt.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fi35j142goaeg6msqpvtt.png" alt="Wasp diagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; is one of the fastest-growing next-gen full-stack web frameworks and is leading the pack when it comes to pushing for a Laravel-like experience in JavaScript. It appeared at about the same time as Redwood and was motivated by the same pain (too fragmented and modular JS ecosystem). Wasp is currently in Beta (recently went through its &lt;a href="https://wasp.sh/blog/2025/04/09/wasp-launch-week-9" rel="noopener noreferrer"&gt;Launch Week #9&lt;/a&gt;) but is already being used by solopreneurs, startups, and Fortune 500 companies.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxi18pr3a4yj2i0o4ga27.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxi18pr3a4yj2i0o4ga27.png" alt="testimonial"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The main “secret sauce” is a declarative specification file where a developer describes their app at a high level - pages and routes, async jobs, database operations, and more. It helps cut down a lot of boilerplate and lets a developer focus on their unique logic in React, Node.js, and Prisma.&lt;/p&gt;

&lt;h2&gt;
  
  
  Support us! 🙏⭐️
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fid9s6t8rcvfxty40bv2m.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fid9s6t8rcvfxty40bv2m.gif" alt="GH star click"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you find this post helpful,&lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;consider giving us a star on Github&lt;/a&gt;! Everything we do at Wasp is open source, and your support helps us make web development easier and motivates us to write more articles like this one.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqgbmn45pia04bxt6zf83.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqgbmn45pia04bxt6zf83.gif" alt="support us"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/wasp-lang/wasp" class="crayons-btn crayons-btn--primary" rel="noopener noreferrer"&gt;⭐️ Thanks For Your Support 🙏&lt;/a&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  OpenSaaS - a free, open-source boilerplate starter for React &amp;amp; Node.js
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1kq23qt6cbxcg6imenk5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1kq23qt6cbxcg6imenk5.png" alt="OS banner"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Finally, one of the big drivers for developers choosing Wasp for their projects is &lt;a href="https://github.com/wasp-lang/open-saas" rel="noopener noreferrer"&gt;OpenSaaS - a 100% free and open-source SaaS boilerplate starter&lt;/a&gt; on top of Wasp. It comes with a lot of common features out-of-the-box (Stripe &amp;amp; OpenAI integration, blog via Astro, admin dashboard, file uploads, …) and will save you hundreds of development hours. Since its release about a year ago, it has skyrocketed to&lt;a href="https://github.com/wasp-lang/open-saas" rel="noopener noreferrer"&gt;over 10,000 stars on GitHub&lt;/a&gt;, and has been used to bring hundreds of SaaSes to life.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2m2gz1av98ajotjnsm3j.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2m2gz1av98ajotjnsm3j.png" alt="app gallery"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Wasp helps vibe coders build their apps further and safer 🕹️
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxjgk55aux80z0jshmq4u.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxjgk55aux80z0jshmq4u.png" alt="vibe coding workflow"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Recently, Wasp has been gaining a lot of popularity among so-called “vibe coders”, which is just a trendy term for people who want to build their app as fast as possible using AI. It turns out that a Wasp app’s robust structure that spans the whole stack of your app (client, server, database, and deployment) and less boilerplate code helps AI develop more features and make fewer mistakes along the way.&lt;/p&gt;

&lt;p&gt;Here you can find &lt;a href="https://www.youtube.com/watch?v=WYzEROo7reY" rel="noopener noreferrer"&gt;a detailed video guide&lt;/a&gt; that explains the whole process, step-by-step, on how to build your next app with Wasp and Cursor, and then also deploy it to production.&lt;/p&gt;

&lt;h2&gt;
  
  
  Happy building and stay safe!
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F90gdqxpfz7s5utq1gnuo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F90gdqxpfz7s5utq1gnuo.png" alt="wasp bye"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Hopefully, this post gave you an insight into the latest developments of the JavaScript ecosystem and prompted (pun intended) you to start working on your next idea, be it with Wasp or another framework that fits your needs the best.&lt;/p&gt;

&lt;p&gt;Also, whether you adopt less or more AI in your development workflow, make sure to check and understand your app’s code before putting it into production. Although full-stack frameworks such as Wasp can help with ensuring best practices out of the box, &lt;strong&gt;it’s still your responsibility as a developer to make sure that the code that goes out meets all the security standards&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;With that said, happy coding! If you want to support our mission with Wasp, we’d appreciate it if you &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;starred it on GitHub&lt;/a&gt;. We’d also love to hear from you, and we’re here if you have any questions about Wasp or web dev in general - you can always find us in &lt;a href="https://discord.gg/rzdnErX" rel="noopener noreferrer"&gt;our Discord&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>react</category>
      <category>vibecoding</category>
      <category>ai</category>
    </item>
    <item>
      <title>A Structured Workflow for "Vibe Coding" Full-Stack Apps</title>
      <dc:creator>vincanger</dc:creator>
      <pubDate>Wed, 16 Apr 2025 08:46:36 +0000</pubDate>
      <link>https://dev.to/wasp/a-structured-workflow-for-vibe-coding-full-stack-apps-352l</link>
      <guid>https://dev.to/wasp/a-structured-workflow-for-vibe-coding-full-stack-apps-352l</guid>
      <description>&lt;p&gt;There's a lot of hype surrounding "vibe coding". You've probably seen the AI influencers making claims like how you can build SaaS apps in 15 minutes with just a few tools and prompts.&lt;/p&gt;

&lt;p&gt;But, as you might have guessed, these example workflows are pretty flimsy.&lt;/p&gt;

&lt;p&gt;Yes, you can copy a landing page, or build a decent CRUD app, but you're not gonna be able to build a complex SaaS or internal tool with them.&lt;/p&gt;

&lt;p&gt;But that doesn't mean there aren't workflows out there that can positively augment your development workflow. Anyone who's tinkered around with different AI-assisted techniques can tell you that there is some real magic in these tools.&lt;/p&gt;

&lt;p&gt;That's why I spent a couple weeks researching the best techniques and workflow tips and put them to the test by building a full-featured, full-stack app with them.&lt;/p&gt;

&lt;p&gt;Below, you'll find my honest review and the workflow that I found that really worked while using Cursor with Google's Gemini 2.5 Pro, and a solid UI template.&lt;/p&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/WYzEROo7reY"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;By the way, I came up with this workflow by testing and building a full-stack personal finance app in my spare time, tweaking and improving the process the entire time. Then, after landing on a good template and workflow, I rebuilt the app again and recorded it entirely, from start to deployments, in a ~3 hour long youtube video (above).&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiqdjccdyp0uiia3l3zvf.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiqdjccdyp0uiia3l3zvf.png" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This article is a summary of the key approaches to implementing this workflow.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Laying the Foundation
&lt;/h2&gt;

&lt;p&gt;There are a lot of moving parts in modern full-stack web apps. Trying to get your LLM to glue it all together for you cohesively just doesn't work.&lt;/p&gt;

&lt;p&gt;That's why you should give your AI helper a helping hand by starting with a solid foundation and leveraging the tools we have at our disposal. &lt;/p&gt;

&lt;p&gt;In practical terms this means using stuff like:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;UI Component Libraries&lt;/li&gt;
&lt;li&gt;Boilerplate templates&lt;/li&gt;
&lt;li&gt;Full-stack frameworks with batteries-included&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Component libraries and templates are great ways to give the LLM a known foundation to build upon. It also takes the guess work out of styling and helps those styles be consistent as the app grows.&lt;/p&gt;

&lt;p&gt;Using a full-stack framework with batteries-included, such as &lt;a href="https://wasp.sh" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; for JavaScript (React, Node.js, Prisma) or &lt;a href="https://laravel.com/" rel="noopener noreferrer"&gt;Laravel&lt;/a&gt; for PHP, takes the complexity out of piecing the different parts of the stack together. Since these frameworks are opinionated, they've chosen a set of tools that work well together, and the have the added benefit of doing a lot of work under-the-hood. In the end, the AI can focus on just the business logic of the app. &lt;/p&gt;

&lt;p&gt;Take Wasp's main config file, for example (see below). All you or the LLM has to do is define your backend operations, and the framework takes care of managing the server setup and configuration for you. On top of that, this config file acts as a central "source of truth" the LLM can always reference to see how the app is defined as it builds new features.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="nx"&gt;app&lt;/span&gt; &lt;span class="nx"&gt;vibeCodeWasp&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;wasp&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;version&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;^0.16.3&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="nx"&gt;title&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Vibe Code Workflow&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;auth&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nl"&gt;userEntity&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;User&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="nx"&gt;methods&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nl"&gt;email&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{},&lt;/span&gt;
      &lt;span class="nx"&gt;google&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{},&lt;/span&gt;
      &lt;span class="nx"&gt;github&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{},&lt;/span&gt;
    &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="p"&gt;},&lt;/span&gt;
  &lt;span class="nx"&gt;client&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nl"&gt;rootComponent&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;Main&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/main&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="nx"&gt;setupFn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;QuerySetup&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/config/querySetup&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="p"&gt;},&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;route&lt;/span&gt; &lt;span class="nx"&gt;LoginRoute&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nl"&gt;path&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/login&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;page&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;component&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;Login&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/auth/login&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;route&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesRoute&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nl"&gt;path&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;/envelopes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;page&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;authRequired&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;component&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;EnvelopesPage&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/EnvelopesPage.tsx&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;query&lt;/span&gt; &lt;span class="nx"&gt;getEnvelopes&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;fn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;getEnvelopes&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/operations.ts&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;entities&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;Envelope&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;BudgetProfile&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;UserBudgetProfile&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="c1"&gt;// Need BudgetProfile to check ownership&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="nx"&gt;action&lt;/span&gt; &lt;span class="nx"&gt;createEnvelope&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;fn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;createEnvelope&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@src/features/envelopes/operations.ts&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;entities&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;Envelope&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;BudgetProfile&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;UserBudgetProfile&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="c1"&gt;// Need BudgetProfile to link&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="c1"&gt;//...&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Step 2: Getting the Most Out of Your AI Assistant
&lt;/h2&gt;

&lt;p&gt;Once you've got a solid foundation to work with, you need create a comprehensive set of rules for your editor and LLM to follow.&lt;/p&gt;

&lt;p&gt;To arrive at a solid set of rules you need to:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Start building something&lt;/li&gt;
&lt;li&gt;Look out for times when the LLM (repeatedly) &lt;em&gt;doesn't meet your expectations&lt;/em&gt; and define rules for them&lt;/li&gt;
&lt;li&gt;Constantly ask the LLM to help you improve your workflow&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Defining Rules
&lt;/h2&gt;

&lt;p&gt;Different IDE's and coding tools have different naming conventions for the rules you define, but they all function more or less the same way (I used Cursor for this project so I'll be referring to Cursor's conventions here).&lt;/p&gt;

&lt;p&gt;Cursor deprecated their &lt;code&gt;.cursorrules&lt;/code&gt; config file in favor of a  &lt;code&gt;.cursor/rules/&lt;/code&gt; directory with multiple files. In this set of rules, you can pack in general rules that align with your coding style, and project-specific rules (e.g. conventions, operations, auth).&lt;/p&gt;

&lt;p&gt;The key here is to provide structured context for the LLM so that it doesn't have to rely on broader knowledge.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjn48e8pwe1cgrf52hbic.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjn48e8pwe1cgrf52hbic.png" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;What does that mean exactly? It means telling the LLM about the current project and template you'll be building on, what conventions it should use, and how it should deal with common issues (e.g. the examples picture above, which are taken from the &lt;a href="https://github.com/wasp-lang/vibe-coding-video" rel="noopener noreferrer"&gt;tutorial video's accompanying repo&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;You can also add general strategies to rules files that you can manually reference in chat windows. For example, I often like telling the LLM to "think about 3 different strategies/approaches, pick the best one, and give your rationale for why you chose it." So I created a rule for it, &lt;code&gt;7-possible-solutions-thinking.mdc&lt;/code&gt;, and I pass it in whenever I want to use it, saving myself from typing the same thing over and over. &lt;/p&gt;

&lt;h2&gt;
  
  
  Using AI to Critique and Improve Your Workflow
&lt;/h2&gt;

&lt;p&gt;Aside from this, I view the set of rules as a fluid object. As I worked on my apps, I started with a set of rules and iterated on them to get the kind of output I was looking for. This meant adding new rules to deal with common errors the LLM would introduce, or to overcome project-specific issues that didn't meet the general expectations of the LLM. &lt;/p&gt;

&lt;p&gt;As I amended these rules, I would also take time to use the LLM as a source of feedback, asking it to critique my current workflow and find ways I could improve it. &lt;/p&gt;

&lt;p&gt;This meant passing in my rules files into context, along with other documents like Plans and READMEs, and ask it to look for areas where we could improve them, using the past chat sessions as context as well.&lt;/p&gt;

&lt;p&gt;A lot of time this just means asking the LLM something like: &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Can you review  for breadth and clarity and think of a few ways it could be improved, if necessary. Remember, these documents are to be used as context for AI-assisted coding workflows.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Step 3: Defining the "What" and the "How" (PRD &amp;amp; Plan)
&lt;/h2&gt;

&lt;p&gt;An extremely important step in all this is the initial prompts you use to guide the generation of the Product Requirement Doc (PRD) and the step-by-step actionable plan you create from it.&lt;/p&gt;

&lt;p&gt;The PRD is basically just a detailed guideline for how the app should look and behave, and some guidelines for how it should be implemented.&lt;/p&gt;

&lt;p&gt;After generating the PRD, we ask the LLM to generate a step-by-step actionable plan that will implement the app in phases using a modified &lt;strong&gt;vertical slice method&lt;/strong&gt; suitable for LLM-assisted development.&lt;/p&gt;

&lt;p&gt;The vertical slice implementation is important because it instructs the LLM to develop the app in full-stack "slices" -- from DB to UI -- in increasingly complexity. That might look like developing a super simple version of a full-stack feature in an early phase, and then adding more complexity to that feature in the later phases.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;This approach highlights a common recurring theme in this workflow: build a simple, solid foundation and increasing add on complexity in focused chunks&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;After the initial generation of each of these docs, I will often ask the LLM to review it's own work and look for possible ways to improve the documents based on the project structure and the fact that it will be used for assisted coding. Sometimes it finds seem interesting improvements, or at the very least it finds redundant information it can remove.&lt;/p&gt;

&lt;p&gt;Here is an example prompt for generating the step-by-step plan (all example prompts used in the walkthrough video can be found in the &lt;a href="https://github.com/wasp-lang/vibe-coding-video/" rel="noopener noreferrer"&gt;accompanying repo&lt;/a&gt;):&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;From this PRD, create an actionable, step-by-step plan using a modified vertical slice implmentation approach that's suitable for LLM-assisted coding. Before you create the plan, think about a few different plan styles that would be suitable for this project and the implmentation style before selecting the best one. Give your reasoning for why you think we should use this plan style. Remember that we will constantly refer to this plan to guide our coding implementation so it should be well structured, concise, and actionable, while still providing enough information to guide the LLM.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Finding this tutorial interesting?
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://wasp.sh/" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; team is working hard to create content like this, not to mention building a modern, open-source React/NodeJS framework.&lt;/p&gt;

&lt;p&gt;The easiest way to show your support is just to star Wasp repo! 🐝 But it would be greatly appreciated if you could take a look at the &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;repository&lt;/a&gt; (for contributions, or to simply test the product). Click on the button below to give Wasp a star and show your support!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faxqiv01tl1pha9ougp21.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faxqiv01tl1pha9ougp21.gif" alt="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/axqiv01tl1pha9ougp21.gif"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/wasp-lang/wasp" class="crayons-btn crayons-btn--primary" rel="noopener noreferrer"&gt;⭐️ Thank You For Your Support 💪&lt;/a&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 4: Building End-to-End - Vertical Slices in Action
&lt;/h2&gt;

&lt;p&gt;As mentioned above, the vertical slice approach lends itself well to building with full-stack frameworks because of the heavy-lifting they can do for you and the LLM.&lt;/p&gt;

&lt;p&gt;Rather than trying to define all your database models from the start, for example, this approach tackles the simplest form of a full-stack feature individually, and then builds upon them in later phases. This means, in an early phase, we might only define the database models needed for Authentication, then its related server-side functions, and the UI for it like Login forms and pages. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcyvbcp8xrihvz71pg6kb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcyvbcp8xrihvz71pg6kb.png" alt=" "&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In my Wasp project, that flow for implementing a phase/feature looked a lot like: &lt;br&gt;
-&amp;gt; Define necessary DB entities in &lt;code&gt;schema.prisma&lt;/code&gt; for that feature only&lt;br&gt;
-&amp;gt; Define operations in the &lt;code&gt;main.wasp&lt;/code&gt; file&lt;br&gt;
-&amp;gt; Write the server operations logic &lt;br&gt;
-&amp;gt; Define pages/routes in the &lt;code&gt;main.wasp&lt;/code&gt; file&lt;br&gt;
-&amp;gt; src/features or src/components UI &lt;br&gt;
-&amp;gt; Connect things via Wasp hooks and other library hooks and modules (react-router-dom, recharts, tanstack-table).&lt;/p&gt;

&lt;p&gt;This gave me and the LLM a huge advantage in being able to build the app incrementally without getting too bogged down by the amount of complexity.&lt;/p&gt;

&lt;p&gt;Once the basis for these features was working smoothly, we could improve the complexity of them, and add on other sub-features, with little to no issues!&lt;/p&gt;

&lt;p&gt;The other advantage this had was that, if I realised there was a feature set I wanted to add on later that didn't already exist in the plan, I could ask the LLM to review the plan and find the best time/phase within it to implement it. Sometimes that time was then at the moment, and other times it gave great recommendations for deferring the new feature idea until later. If so, we'd update the plan accordingly.&lt;/p&gt;

&lt;h1&gt;
  
  
  Step 5: Closing the Loop - AI-Assisted Documentation
&lt;/h1&gt;

&lt;p&gt;Documentation often gets pushed to the back burner. But in an AI-assisted workflow, keeping track of why things were built a certain way and how the current implementation works becomes even more crucial. &lt;/p&gt;

&lt;p&gt;The AI doesn't inherently "remember" the context from three phases ago unless you provide it. So we get the LLM to provide it for itself :)&lt;/p&gt;

&lt;p&gt;After completing a significant phase or feature slice defined in our Plan, I made it a habit to task the AI with documenting what we just built. I even created a rule file for this task to make it easier.&lt;/p&gt;

&lt;p&gt;The process looked something like this:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Gather the key files related to the implemented feature (e.g., relevant sections of main.wasp, schema.prisma, the operations.ts file, UI component files).&lt;/li&gt;
&lt;li&gt;Provide the relevant sections of the PRD and the Plan that described the feature.&lt;/li&gt;
&lt;li&gt;Reference the rule file with the Doc creation task&lt;/li&gt;
&lt;li&gt;Have it review the Doc for breadth and clarity&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;What's important is to have it focus on the core logic, how the different parts connect (DB -&amp;gt; Server -&amp;gt; Client), and any key decisions made, referencing the specific files where the implementation details can be found.&lt;/p&gt;

&lt;p&gt;The AI would then generate a markdown file (or update an existing one) in the &lt;code&gt;ai/docs/&lt;/code&gt; directory, and this is nice for two reasons:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;For Humans: It created a clear, human-readable record of the feature for onboarding or future development.&lt;/li&gt;
&lt;li&gt;For the AI: It built up a knowledge base within the project that could be fed back into the AI's context in later stages. This helped maintain consistency and reduced the chances of the AI forgetting previous decisions or implementations.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;This "closing the loop" step turns documentation from a chore into a clean way of maintaining the workflow's effectiveness. &lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion: Believe the Hype... Just not All of It
&lt;/h2&gt;

&lt;p&gt;So, can you "vibe code" a complex SaaS app in just a few hours? Well, kinda, but it will probably be a boring one. &lt;/p&gt;

&lt;p&gt;But what you can do is leverage AI to significantly augment your development process, build faster, handle complexity more effectively, and maintain better structure in your full-stack projects.&lt;/p&gt;

&lt;p&gt;The "Vibe Coding" workflow I landed on after weeks of testing boils down to these core principles:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Start Strong&lt;/strong&gt;: Use solid foundations like full-stack frameworks (Wasp) and UI libraries (Shadcn-admin) to reduce boilerplate and constrain the problem space for the AI.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Teach Your AI&lt;/strong&gt;: Create explicit, detailed rules (.cursor/rules/) to guide the AI on project conventions, specific technologies, and common pitfalls. Don't rely on its general knowledge alone.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Structure the Dialogue&lt;/strong&gt;: Use shared artifacts like a PRD and a step-by-step Plan (developed collaboratively with the AI) to align intent and break down work.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Slice Vertically&lt;/strong&gt;: Implement features end-to-end in manageable, incremental slices, adding complexity gradually.
Document Continuously: Use the AI to help document features as you build them, maintaining project knowledge for both human and AI collaborators.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Iterate and Refine&lt;/strong&gt;: Treat the rules, plan, and workflow itself as living documents, using the AI to help critique and improve the process.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Following this structured approach delivered really good results and I was able to implement features in record time. With this workflow I could really build complex apps 20-50x faster than I could before. &lt;/p&gt;

&lt;p&gt;The fact that you also have a companion that has a huge knowledge set that helps you refine ideas and test assumptions is amazing as well&lt;/p&gt;

&lt;p&gt;Although you can do a lot without ever touching code yourself, it still requires you, the developer, to guide, review, and understand the code. But it is a realistic, effective way to collaborate with AI assistants like Gemini 2.5 Pro in Cursor, moving beyond simple prompts to build full-features apps efficiently.&lt;/p&gt;

&lt;p&gt;If you want to see this workflow in action from start to finish, check out the full &lt;a href="https://www.youtube.com/watch?v=WYzEROo7reY" rel="noopener noreferrer"&gt;~3 hour YouTube walkthrough and template repo&lt;/a&gt;. And if you have any other tips I missed, please let me know in the comments :)&lt;/p&gt;

</description>
      <category>vibecoding</category>
      <category>ai</category>
      <category>fullstack</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Going from an Idea to MVP in Weeks: PromptPanda's Launch(es)</title>
      <dc:creator>Milica Maksimovic</dc:creator>
      <pubDate>Tue, 18 Mar 2025 08:54:09 +0000</pubDate>
      <link>https://dev.to/wasp/going-from-an-idea-to-mvp-in-weeks-promptpandas-launches-287n</link>
      <guid>https://dev.to/wasp/going-from-an-idea-to-mvp-in-weeks-promptpandas-launches-287n</guid>
      <description>&lt;p&gt;Did you know that most co-founders meet each other through work? &lt;strong&gt;&lt;a href="https://x.com/WWWillems" rel="noopener noreferrer"&gt;Lander Willem&lt;/a&gt;&lt;/strong&gt; met his friend and co-founder &lt;strong&gt;&lt;a href="https://x.com/brambilicious" rel="noopener noreferrer"&gt;Bram Billiet&lt;/a&gt;&lt;/strong&gt; while they were working at the local venture fund. They both shared the love towards LLMs and got the idea to kickstart their SaaS after experiencing the same pain points with managing and versioning prompts.&lt;/p&gt;

&lt;p&gt;In this post, you'll learn how they:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Shipped their SaaS from idea to MVP in weeks, using modern AI stack&lt;/li&gt;
&lt;li&gt;Launched and got trending on Product Hunt with 100+ upvotes&lt;/li&gt;
&lt;li&gt;Successfully onboarded first users&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  The problem: Managing prompts is messy
&lt;/h2&gt;

&lt;p&gt;Right after OpenAI released their first LLM models, Lander and Bram started exchanging tips on how to get optimal results from prompts. Soon, they learned that managing AI prompts is often chaotic. &lt;/p&gt;

&lt;p&gt;People who share prompts usually do so through messaging apps such as Slack, Microsoft Teams or in better cases, shared Google Docs documents. Some of the people they talked to even confessed they were sharing their favorite prompts using screenshots 😅. Although a Google Doc might work initially, people quickly bump into issues regarding versioning and granular access management.&lt;/p&gt;

&lt;p&gt;This is how they got the idea to create &lt;a href="https://www.promptpanda.io/" rel="noopener noreferrer"&gt;PromptPanda&lt;/a&gt; - a SaaS that allows people to exchange prompts in an easy way. &lt;a href="https://demo.arcade.software/JiVvKE3oDWzbar0DKUDX" rel="noopener noreferrer"&gt;Here's an interactive demo&lt;/a&gt; you can click through to see what they've built.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fccy6m6wrl6r7yzh7phmv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fccy6m6wrl6r7yzh7phmv.png" alt="Image description" width="800" height="416"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The opportunity: Everyone uses prompts, not just devs
&lt;/h2&gt;

&lt;p&gt;Other AI prompt tools are primarily designed with developers in mind, which leaves out non-technical teams. Those less technical users depend heavily on collaboration, efficiency, and consistency to complete their tasks. This is the market PromptPanda decided to go after.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuaajkmb2q9nv8hcp82ai.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuaajkmb2q9nv8hcp82ai.jpg" alt="Image description" width="500" height="500"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The tool is designed specifically to help teams centralize their prompts and ensures consistent output quality. Collaboration is painless because of an intuitive web app that also has &lt;a href="https://chromewebstore.google.com/detail/promptpanda/hpgfoodclhmbloolkenjjofklhalfblc" rel="noopener noreferrer"&gt;a Chrome extension&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;PromptPanda integrates with major AI providers such as OpenAI, Anthropic, Google, Perplexity, and DeepSeek. Coupled with its built-in Prompt Improver, these integrations allow users to quickly test, iterate, and enhance their prompts, while not imposing any limitations for the end-users.&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fu7ej0763lvnsa7py92ix.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fu7ej0763lvnsa7py92ix.png" alt="Image description" width="800" height="365"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With this approach they covered a market that other companies overlooked, non-technical users who rely on the biggest LLM providers for their daily tasks.&lt;/p&gt;


&lt;h2&gt;
  
  
  Launching is unpredictable: Product Hunt hits and flops
&lt;/h2&gt;

&lt;p&gt;As soon as the app was somewhat stable and usable, Lander and Bram decided to launch on ProductHunt.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6mtvhgf4h9xvnbj536jq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6mtvhgf4h9xvnbj536jq.png" alt="Image description" width="800" height="495"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://www.producthunt.com/products/promptpanda#promptpanda" rel="noopener noreferrer"&gt;Their first ProductHunt launch&lt;/a&gt; was great in terms of visibility. They were featured by the ProductHunt team which got them a bunch of upvotes and comments. &lt;strong&gt;Although there was quite a lot of engagement with the launch, it didn't really end up in sticky, paying customers.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faz5fjxbn7fh1u9sqdia2.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faz5fjxbn7fh1u9sqdia2.png" alt="Image description" width="800" height="307"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A short while later they relaunched on ProductHunt after processing the feedback from their first launch. Both their product and launch campaign were much better prepared. Weirdly enough, the launch mostly failed as they got almost no upvotes or conversions.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fd6uobwv0nms909vspdyb.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fd6uobwv0nms909vspdyb.jpg" alt="Image description" width="500" height="500"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Although their second launch was mostly a flop, it did manage to get them mentioned in a Superhuman (the email app) newsletter. Their user base doubled overnight.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Ever since then they have an active stream of users and new signups coming in. &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;”My main takeaway is to never stop shipping, and always share your work!”&lt;/p&gt;

&lt;p&gt;Lander Willem&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Most of their users today have found PromptPanda through organic SEO. They started writing articles about &lt;a href="https://www.promptpanda.io/ai-prompt-management/" rel="noopener noreferrer"&gt;AI Prompt Management&lt;/a&gt; which have quickly found traction in search engine algorithms.&lt;/p&gt;
&lt;h3&gt;
  
  
  Finding this article interesting?
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://wasp.sh/" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; team is working hard to create content like this, not to mention building a modern, open-source React/NodeJS framework.&lt;/p&gt;

&lt;p&gt;The easiest way to show your support is just to star Wasp repo! 🐝 But it would be greatly appreciated if you could take a look at the &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;repository&lt;/a&gt; (for contributions, or to simply test the product). Click on the button below to give Wasp a star and show your support!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faxqiv01tl1pha9ougp21.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faxqiv01tl1pha9ougp21.gif" alt="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/axqiv01tl1pha9ougp21.gif" width="746" height="401"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/wasp-lang/wasp" class="ltag_cta ltag_cta--branded" rel="noopener noreferrer"&gt;⭐️ Thank You For Your Support 💪&lt;/a&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Choosing the right stack for developing your SaaS app
&lt;/h2&gt;

&lt;p&gt;PromptPanda's team chose &lt;a href="https://opensaas.sh/" rel="noopener noreferrer"&gt;Open SaaS&lt;/a&gt; because it significantly streamlined their product development by simplifying backend setup, database management, and built-in authentication. This was crucial as they needed an efficient solution that could save time due to their busy schedules. &lt;a href="https://wasp.sh/" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt;'s default integration with Fly also enabled rapid deployment, allowing them to quickly validate their product idea without getting bogged down in infrastructure complexities.&lt;/p&gt;

&lt;p&gt;Here's a full overview of their tech stack alongside all the tools they rely on to run their SaaS:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0r35f8sq8zmzqvl1gznf.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0r35f8sq8zmzqvl1gznf.png" alt="Image description" width="800" height="800"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Are you ready to ship your SaaS now?
&lt;/h2&gt;

&lt;p&gt;PromptPanda's story proves the best SaaS ideas come from solving your own pain points. Lander and Bram also learned launching isn't predictable—success can come from unexpected places, even failed launches. The takeaway? Keep building, keep shipping, and always share your progress openly.&lt;/p&gt;

&lt;p&gt;If you enjoyed this post please make sure to &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;give Wasp a star on GitHub&lt;/a&gt;, this keeps us going forward and supports our work!&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>saas</category>
      <category>javascript</category>
      <category>buildinpublic</category>
    </item>
    <item>
      <title>From “You will fail” to 15,000 GitHub stars: The story of Wasp, a "Laravel for JS" full-stack framework</title>
      <dc:creator>Matija Sosic</dc:creator>
      <pubDate>Wed, 05 Mar 2025 13:03:40 +0000</pubDate>
      <link>https://dev.to/wasp/from-you-will-fail-to-15000-github-stars-the-story-of-wasp-a-laravel-for-js-full-stack-1fil</link>
      <guid>https://dev.to/wasp/from-you-will-fail-to-15000-github-stars-the-story-of-wasp-a-laravel-for-js-full-stack-1fil</guid>
      <description>&lt;h2&gt;
  
  
  "What you're building is the holy grail for developers. No one has succeeded so far." 🏆 ☠️
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1bojq5h8joplg0f4dbf7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1bojq5h8joplg0f4dbf7.png" alt="YC holy grail" width="563" height="290"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This is the feedback from Y Combinator when Martin (my twin brother) and I applied with &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;Wasp&lt;/a&gt; for the second time in May 2020. At that point, we had worked on Wasp for 1.5 years, the last nine months full-time. We had quit our previous jobs and gone all in.&lt;/p&gt;

&lt;p&gt;Today, &lt;strong&gt;Wasp has over 15,000 stars on GitHub&lt;/strong&gt;. Even more importantly, developers of all backgrounds have used it to &lt;strong&gt;develop thousands of web apps&lt;/strong&gt;, from side projects that have grown into &lt;a href="https://wasp.sh/blog/2024/09/17/from-idea-to-20k-in-days-how-wasp-accelerated-nuloapps-launch" rel="noopener noreferrer"&gt;acquired&lt;/a&gt; or &lt;a href="https://docs.opensaas.sh/blog/2024-12-10-turboreel-os-ai-video-generator-built-with-open-saas/" rel="noopener noreferrer"&gt;revenue-generating businesses&lt;/a&gt; to venture-backed startups and internal tools deployed within Fortune 500 companies.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3dgexditl48vkrwnqks5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3dgexditl48vkrwnqks5.png" alt="Wasp app gallery" width="800" height="312"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Some people have grown to love Wasp and the vision it pursues. Thanks to them, we enjoy working on it. Without the community that gathered around Wasp (&amp;gt;4,000 devs in &lt;a href="https://discord.gg/rzdnErX" rel="noopener noreferrer"&gt;our Discord&lt;/a&gt;), we wouldn’t have been even close to where we are today. For them, we keep pushing towards the holy grail we promised.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F00chj0j1bn1h9va8pwbd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F00chj0j1bn1h9va8pwbd.png" alt="wasp love" width="800" height="188"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Our work has just begun - but we’re more excited about it than ever.&lt;/p&gt;

&lt;h2&gt;
  
  
  The journey - getting from 0 to 15,000 stars
&lt;/h2&gt;

&lt;p&gt;As with most success stories, the success rarely happens linearly. It usually starts with a long period of "drought" with occasional signs of life, and then there is a moment when things click together and start moving really fast. We experienced the same, and it looked something like this:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F73xh57mzhglctpsd2vxp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F73xh57mzhglctpsd2vxp.png" alt="Star journey" width="800" height="635"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  The inception - “Why not?”
&lt;/h3&gt;

&lt;p&gt;In the beginning, Wasp was just an idea—or rather, a question: "&lt;em&gt;Why hasn't anyone built this yet? What would we discover if we tried?&lt;/em&gt;" After spending a decade building web apps and using every major tech stack (from PHP to Java and Node.js on the server to Backbone, Angular, and React on the client), we were feeling the pain of "framework fatigue," aka reinventing the wheel with each new stack.&lt;/p&gt;

&lt;p&gt;So we set out to start thinking about it and put things on paper (ok, Google Slides). This is how the original idea for Wasp was born - &lt;strong&gt;&lt;em&gt;can we create a framework that removes a lot of boilerplate by offering higher-level abstractions, but is still flexible enough and is not strictly bound to the specific stack and architecture?&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Now looking that, it really does sound like a holy grail.&lt;/p&gt;

&lt;h3&gt;
  
  
  Getting in YC and things getting real
&lt;/h3&gt;

&lt;p&gt;We had already quit our jobs a year ago and were quite exhausted and doubtful of the whole concept. We were getting some early traction and received promising feedback from Reddit, Hacker News, and Product Hunt, but we also started realizing how much work is needed to bring a full-stack web framework to a state where it’s usable, especially with the ambitious requirements we set for ourselves.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzd9lpns27ih8pqbaw1c6.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzd9lpns27ih8pqbaw1c6.png" alt="reddit launch" width="800" height="319"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Finally, we got into YC the third time we applied for it. They were following our progress for the last year and, having seen the community excitement, decided to take a bet on our crazy idea.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6jkfjqeo4n2qo24u7q60.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6jkfjqeo4n2qo24u7q60.png" alt="hn launch" width="800" height="237"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Beta and beyond - MAGE and OpenSaaS
&lt;/h3&gt;

&lt;p&gt;Looking at the graph, you can spot two key inflection points. The first one happened in July 2023 when we launched &lt;a href="https://wasp.sh/blog/2023/07/10/gpt-web-app-generator" rel="noopener noreferrer"&gt;&lt;strong&gt;MAGE&lt;/strong&gt;&lt;/a&gt;, a GPT SaaS starter that uses Wasp under the hood (you can think of it as one-shot Loveable/Bolt). It was among the first LLM products that could generate a working full-stack web app, bringing many eyes to Wasp.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwj7j2aikuws0quxymuwg.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwj7j2aikuws0quxymuwg.png" alt="OpenSaaS banner" width="800" height="529"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The second major growth catalyzer came in December 2023 with the launch of &lt;a href="https://opensaas.sh/" rel="noopener noreferrer"&gt;&lt;strong&gt;OpenSaaS&lt;/strong&gt;&lt;/a&gt;, our open-source SaaS starter built on top of Wasp, which now has almost 10,000 stars on GitHub.&lt;/p&gt;

&lt;p&gt;We realized that most builders really want to start working on their idea as quickly as possible without picking out and patching together all the different features every SaaS needs - authentication, payments, admin dashboard, sending emails, blog, …&lt;/p&gt;

&lt;p&gt;And this is exactly what we provided - &lt;strong&gt;a 100% free &amp;amp; open-source, high-quality, SaaS starter based on React, Node.js, Prisma, and Wasp&lt;/strong&gt;. OpenSaaS basically became a “killer app” for Wasp as it attracts developers to try it and realize how helpful the framework is.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/wasp/using-cursor-claude-to-make-full-stack-saas-apps-2aj3"&gt;Open SaaS also pairs extremely well with Cursor&lt;/a&gt; - given Wasp’s robust structure and higher-level primitives, many developers have found it as an ideal combo for getting their SaaS-es from an idea to a production-ready app in a matter of days.&lt;/p&gt;

&lt;p&gt;&lt;iframe class="tweet-embed" id="tweet-1832194642596508076-687" src="https://platform.twitter.com/embed/Tweet.html?id=1832194642596508076"&gt;
&lt;/iframe&gt;

  // Detect dark theme
  var iframe = document.getElementById('tweet-1832194642596508076-687');
  if (document.body.className.includes('dark-theme')) {
    iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1832194642596508076&amp;amp;theme=dark"
  }



&lt;/p&gt;

&lt;h3&gt;
  
  
  Language/DSL vs framework - so which one is it?
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frergp8xvt5tcxu0yqn2d.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frergp8xvt5tcxu0yqn2d.gif" alt="maybe both" width="400" height="168"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;As you can see from the examples above, we used to refer to Wasp as a language, DSL - a Domain Specific Language. It was for these reasons that we originally set out to have an abstraction layer that can, in the future, work with any language, library, and architecture.&lt;/p&gt;

&lt;p&gt;For this, we needed to introduce our own compiler that would first analyze your app’s specification that you defined via Wasp (e.g., your routes, async jobs, db operations, …), combine it with the “native” code you wrote in React &amp;amp; Node.js, and finally generate a React/Node.js app. That effectively meant we’ve invented our own language, albeit very limited and simple.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;This is how we initially presented Wasp, but we learned that is the wrong way to think about it. Wasp is by its function a web framework, just like Laravel, Rails, or Next.js&lt;/strong&gt;. The fact that it uses a compiler under the hood is simply an implementation detail that gives it its superpowers. For example, thanks to this approach, &lt;strong&gt;&lt;a href="https://wasp.sh/blog/2024/04/25/first-framework-that-lets-you-visualize-react-node-app-code" rel="noopener noreferrer"&gt;we can easily visualize the topology of your whole app&lt;/a&gt;, from database to server and client components&lt;/strong&gt;:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvbktt1garp2xf91y6ubs.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvbktt1garp2xf91y6ubs.png" alt="wasp studio" width="800" height="476"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The road to 1.0 and building the next-gen framework
&lt;/h2&gt;

&lt;p&gt;This is the story of how Wasp came to be where it is today. For more details on the very early days (getting from an idea to the first 1,000 stars), you can check out &lt;a href="https://wasp.sh/blog/2022/09/29/journey-to-1000-gh-stars" rel="noopener noreferrer"&gt;this post&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;What’s next? After almost five years of building and getting feedback from you, we have a pretty clear picture of what Wasp 1.0 needs to look like. Simply put, we have set out to build a full-stack framework with the best possible developer experience. We want you to focus on building your product and spend as little time as possible fighting your stack.&lt;/p&gt;

&lt;p&gt;Think what Rails and Laravel did for Ruby and PHP - we’re doing the same for the modern, AI-powered, JS ecosystem.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;To follow our story and support us, &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;star Wasp on GitHub&lt;/a&gt; and &lt;a href="https://discord.gg/rzdnErX" rel="noopener noreferrer"&gt;join our Discord&lt;/a&gt; - we can’t wait to see you there!&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>ai</category>
      <category>react</category>
    </item>
    <item>
      <title>Meet Marko Saric, Co-founder of Privacy-friendly Plausible Analytics</title>
      <dc:creator>Milica Maksimovic</dc:creator>
      <pubDate>Tue, 04 Mar 2025 15:39:18 +0000</pubDate>
      <link>https://dev.to/wasp/meet-marko-saric-co-founder-of-privacy-friendly-plausible-analytics-3nm8</link>
      <guid>https://dev.to/wasp/meet-marko-saric-co-founder-of-privacy-friendly-plausible-analytics-3nm8</guid>
      <description>&lt;p&gt;In this interview, &lt;a href="https://x.com/markosaric" rel="noopener noreferrer"&gt;Marko Saric&lt;/a&gt; shared his thoughts on privacy and running a bootstrapped SaaS business. &lt;a href="https://plausible.io/" rel="noopener noreferrer"&gt;Plausible&lt;/a&gt; integration is already &lt;a href="https://docs.opensaas.sh/guides/analytics/#plausible" rel="noopener noreferrer"&gt;available in Open SaaS&lt;/a&gt; as a privacy-friendly alternative to Google Analytics. We hope this interview helps you understand the value of such a product, and the nature of running an open source business.&lt;/p&gt;

&lt;p&gt;Here's a few other things we've covered in this interview:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Tackling big tech privacy issues.&lt;/li&gt;
&lt;li&gt;How bootstrapping your business fuels independence and transparency.&lt;/li&gt;
&lt;li&gt;Real, practical advice for growing your SaaS the smart way.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let's dive in!&lt;/p&gt;

&lt;h2&gt;
  
  
  Can you share a bit about your background and what led you to start Plausible?
&lt;/h2&gt;

&lt;p&gt;I'm Marko Saric, co-founder of Plausible Analytics.&lt;/p&gt;

&lt;p&gt;My journey with Plausible began with a growing awareness of the privacy issues surrounding Google and its products. For many years, I was a user of Google's services but over time (and thanks to Snowden, Cambridge Analytica and other privacy scandals), I became more aware of the negative aspects of surveillance capitalism. This led me to explore better, more ethical alternatives to the big tech products.&lt;/p&gt;

&lt;p&gt;I started sharing these alternatives on my blog which is how I connected with my co-founder Uku. We both had experience in tech and a shared vision of working on a privacy-friendly analytics tool so we decided to work together on Plausible. I'm focused on marketing and communication side of things while Uku is focused on design and development.&lt;/p&gt;

&lt;h2&gt;
  
  
  For those unfamiliar with Plausible, how would you describe its core mission in just a few sentences?
&lt;/h2&gt;

&lt;p&gt;Plausible Analytics is an easy to use, lightweight, open source and privacy-friendly analytics tool. Our mission is to provide website owners with useful insights while respecting visitor privacy.&lt;/p&gt;

&lt;p&gt;We have been working on Plausible for more than 6 years now, have more than 14,000 active subscribers at this point and have counted more than 136 billion pageviews so far.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F99xv6dvlfvgqxkmszwly.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F99xv6dvlfvgqxkmszwly.png" alt="Image description" width="800" height="490"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Plausible is bootstrapped and open-source—what made you choose this path instead of taking the more common VC route?
&lt;/h2&gt;

&lt;p&gt;We chose to bootstrap and open source Plausible because we wanted to maintain control and independence while also being more privacy-friendly and transparent.&lt;/p&gt;

&lt;p&gt;Both of us have worked at venture funded startups in the past and neither of us had good experiences with investors so going bootstrapped was pretty much the way to do this if we wanted to do things our way.&lt;/p&gt;

&lt;p&gt;We're in the privacy niche so open sourcing our product allows us to build trust as people can inspect our code to verify that our actions match our words. People cannot do that with Google Analytics and other competing products.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Just like Plausible, Wasp is an open-source project too! We'd appreciate it if you could &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;star Wasp on GitHub as a sign of support&lt;/a&gt;! ⭐️&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Do you have any advice for people who are considering bootstrapping their company? Do you have any books or podcasts to recommend?
&lt;/h2&gt;

&lt;p&gt;I think it's a good idea to start bootstrapped even if you do wish to get funded. You should focus on creating a great product that solves a real problem and on spreading the word about it. If you do that well, you'll have investors reaching out to you even if you don't want or need them.&lt;/p&gt;

&lt;p&gt;I recommend reading &lt;strong&gt;"Rework" by Jason Fried and David Heinemeier Hansson&lt;/strong&gt;. It offers unconventional but valuable insights into running a startup.&lt;/p&gt;

&lt;p&gt;Another good book is &lt;strong&gt;"This Is Marketing" by Seth Godin&lt;/strong&gt;. It's about how many startups confuse marketing with spending money on advertising, spamming, interrupting, being annoying and other hacks and tricks. That's not marketing. Marketing is communication.&lt;/p&gt;

&lt;h2&gt;
  
  
  How did you get your first customers?
&lt;/h2&gt;

&lt;p&gt;Our first customers came through community engagement and the "build in public" movement. We shared our journey, steps taken and product development openly on our blog, social media and niche communities such as Indie Hackers. That's how we got the early beta users and some of those became our first subscribers too.&lt;/p&gt;

&lt;h2&gt;
  
  
  What were the biggest challenges you faced while building and growing Plausible?
&lt;/h2&gt;

&lt;p&gt;The first year was pretty challenging in terms of growth. Uku was working alone on Plausible trying to do both development and marketing. This is pretty much an impossible task. The growth was very slow and we made it to about 100 subscribers and $400 MRR some 14 months into the existence of Plausible. &lt;/p&gt;

&lt;p&gt;That's when Uku decided to look for a marketing co-founder and that's how we found me. Being two co-founders helped us put more time and effort into marketing and communication. One of the first things we did when I joined was to change our positioning to make it crystal clear and easy to understand what we do, what we stand for and how we compare to Google Analytics (the biggest name in our market). And then we started publishing educational and informative content covering topics such as privacy, open source, bootstrapping and startup marketing . &lt;/p&gt;

&lt;p&gt;I have written more about the changes we made in these early days &lt;a href="https://plausible.io/blog/blog-post-changed-my-startup" rel="noopener noreferrer"&gt;in this post&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Which growth strategies have been the most effective?
&lt;/h2&gt;

&lt;p&gt;We have a boring marketing strategy and we say no to all the growth hacks and other best marketing practices. Content marketing has been our most effective growth strategy. As an example, the first blog post that I published (Why You Should Remove Google Analytics from Your Site) went viral on Hacker News. It drove some good traffic to our site leading to an increase in brand awareness. &lt;/p&gt;

&lt;p&gt;What matters is doing quality work and staying consistent with it over a longer period of time so we continued to publish multiple blog posts per week for over a year. Thanks to that work, we've been fortunate enough to achieve the viral moments on Hacker News multiple times over those first 2-3 years.&lt;/p&gt;

&lt;p&gt;I have shared more about our early years, marketing steps we've taken, lessons we've learned and things we have achieved &lt;a href="https://plausible.io/blog/open-source-saas" rel="noopener noreferrer"&gt;in blog posts such as this one&lt;/a&gt;. Our analytics dashboard is open to the public so it's possible to see the progress we've made since day one &lt;a href="https://plausible.io/plausible.io?period=all&amp;amp;keybindHint=A" rel="noopener noreferrer"&gt;in our stats&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  What role has the community played in Plausible's growth? Have there been any surprising or particularly impactful contributions from the community?
&lt;/h2&gt;

&lt;p&gt;The community has helped shape our product and spread the word about our mission.&lt;/p&gt;

&lt;p&gt;We have an open roadmap and listen to the product feedback which determines our development prioritization. This is where feature requests and other feedback is very valuable to us. We pretty much pick the most upvoted feature and work on that. &lt;/p&gt;

&lt;p&gt;As mentioned earlier, we don't do any traditional marketing as in we don't do any paid advertising nor pay anyone to recommend Plausible. This means that most of our growth comes from people who love using Plausible and who share their experiences with the world. Without people spreading the word about Plausible it would be difficult for us to do what we do. So that's why community contributions is vital for us. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fml2qx6t65gdbru24ze7j.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fml2qx6t65gdbru24ze7j.png" alt="Image description" width="800" height="377"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What's next for Plausible? Are there any upcoming features or improvements you're particularly excited about?
&lt;/h2&gt;

&lt;p&gt;We're focused on continuing to improve Plausible and making it even more useful and competitive while staying true to our mission and meeting rigorous standards for stability, security and privacy.&lt;/p&gt;

&lt;p&gt;Our developers are currently working on the top two most upvoted feature requests from our public feedback board (scroll depth and saved segments) so that's very exciting. It would be great to release these two big features soon!&lt;/p&gt;




&lt;p&gt;Just like Plausible, Wasp is an open-source project too! We'd appreciate it if you could &lt;a href="https://github.com/wasp-lang/wasp" rel="noopener noreferrer"&gt;star Wasp on GitHub as a sign of support&lt;/a&gt;! ⭐️&lt;/p&gt;

</description>
      <category>opensource</category>
      <category>buildinpublic</category>
      <category>privacy</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
