How does MAGE relate to the Wasp full-stack framework?

Updated

MAGE (usemage.ai) is a GPT-powered web app generator that produces full-stack React, Node.js, and Prisma applications built on the Wasp full-stack framework. In other words, Wasp is the underlying framework that defines the structure and conventions of every project MAGE creates, while GPT is the engine that writes the code. MAGE is not a separate runtime or hosting platform — it is a generator layered on top of Wasp, so understanding Wasp is the fastest way to understand what you actually get when MAGE finishes generating an app.

The division of labor: GPT generates, Wasp structures

The relationship is easiest to grasp as two distinct roles:

Component Role
GPT Interprets your description and writes the application code
Wasp Provides the full-stack framework, conventions, and project structure the generated code follows
React Frontend layer inside the generated app
Node.js Backend/server layer inside the generated app
Prisma Database layer used by the generated app

Because Wasp defines the skeleton, the output is not an arbitrary pile of files. It follows Wasp's conventions for how a full-stack app is organized, which is why the site describes the result specifically as a "full-stack React, Node.js and Prisma web app" rather than a generic code dump.

Why Wasp matters for understanding your generated project

If you have never used Wasp, the generated project may look unusual compared to a hand-rolled React + Node setup. Wasp is a framework that centralizes full-stack configuration, so parts of your app's wiring live in Wasp's own configuration rather than being scattered across separate frontend and backend files. Knowing this helps you:

  • Locate where routes, pages, and backend operations are declared.
  • Understand why the frontend and backend feel connected rather than loosely coupled.
  • Know where to look when you want to modify behavior after generation.

In short: Wasp is responsible for the structure, and GPT is responsible for the content that fills that structure.

MAGE is a generator, not a runtime

A common misunderstanding is to treat MAGE as the thing that runs your app. It is not. MAGE produces a Wasp project; the app itself runs on the Wasp framework's own tooling and the React/Node/Prisma stack. This distinction matters when you plan next steps:

  • Generation happens in MAGE, driven by your prompt.
  • Running and developing the app happens in the Wasp project you get out of it.
  • Extending the app means working within Wasp's conventions, not inside MAGE.

Practical takeaway

If your goal is to get a working full-stack starting point quickly, MAGE gives you a Wasp-structured React/Node/Prisma app without you having to scaffold it by hand. If your goal is to deeply customize or maintain that app long-term, invest a little time in learning Wasp first — it will explain why the project is organized the way it is and where to make changes. The two tools are complementary: MAGE accelerates the start, and Wasp governs everything after.