Wasp Has a Free API: The Full-Stack Framework That Generates React + Node.js Apps From a Simple DSL

#wasp #api #react #fullstack

Building a full-stack app means wiring together React, Express, Prisma, auth, email, cron jobs, and deployment. Wasp generates all of that from a simple configuration language — you describe WHAT you want, Wasp builds HOW.

What Is Wasp?

Wasp is an open-source full-stack web framework. It uses a simple DSL (Domain Specific Language) to describe your app's structure — routes, pages, queries, actions, auth, jobs — and generates a complete React + Node.js application with all the wiring done.

The Free Framework

Wasp is completely free and open source:

DSL: Declare routes, auth, entities in simple syntax
Full-stack generation: React frontend + Node.js backend
Built-in auth: Email, Google, GitHub, username/password
Prisma ORM: Database schema and migrations included
Background jobs: Cron and async jobs built in
Email sending: Configured out of the box
One-command deploy: Deploy to Fly.io or Railway
TypeScript: Full TypeScript support

Quick Start

Create a new app:

curl -sSL https://get.wasp-lang.dev/installer.sh | sh
wasp new my-app
cd my-app
wasp start

The Wasp DSL (main.wasp):

app MyApp {
  wasp: { version: "^0.14.0" },
  title: "My SaaS",
  auth: {
    userEntity: User,
    methods: {
      email: {},
      google: {},
      gitHub: {}
    },
    onAuthFailedRedirectTo: "/login"
  }
}

entity User {=psl
  id    Int    @id @default(autoincrement())
  email String @unique
  tasks Task[]
psl=}

entity Task {=psl
  id          Int     @id @default(autoincrement())
  description String
  isDone      Boolean @default(false)
  userId      Int
  user        User    @relation(fields: [userId], references: [id])
psl=}

route DashboardRoute { path: "/dashboard", to: DashboardPage }
page DashboardPage {
  authRequired: true,
  component: import { Dashboard } from "@src/pages/Dashboard"
}

query getTasks {
  fn: import { getTasks } from "@src/queries",
  entities: [Task]
}

action createTask {
  fn: import { createTask } from "@src/actions",
  entities: [Task]
}

job dailyReport {
  executor: PgBoss,
  schedule: { cron: "0 9 * * *" },
  fn: import { sendDailyReport } from "@src/jobs/report"
}

Your React component:

import { useQuery } from 'wasp/client/operations';
import { getTasks, createTask } from 'wasp/client/operations';

export function Dashboard() {
  const { data: tasks, isLoading } = useQuery(getTasks);

  const handleAdd = async () => {
    await createTask({ description: 'New task' });
  };

  if (isLoading) return <div>Loading...</div>;
  return (
    <div>
      <button onClick={handleAdd}>Add Task</button>
      {tasks.map(t => <div key={t.id}>{t.description}</div>)}
    </div>
  );
}

Deploy:

wasp deploy fly launch my-app mia

Why Developers Choose Wasp

A solo founder wanted to build a SaaS MVP. Setting up React + Express + Prisma + auth + email took a week. With Wasp, the same setup took 20 minutes. The DSL generated all the boilerplate, and the founder focused entirely on business logic. They launched on Product Hunt 2 weeks earlier than planned.

Who Is This For?

Solo founders building SaaS MVPs fast
Full-stack developers tired of boilerplate setup
Teams wanting convention over configuration
Anyone building CRUD apps with auth who wants to skip the wiring

Start Building

Wasp lets you describe your app and generates the full stack. Less boilerplate, more product.

Need help building full-stack applications? I build custom web solutions — reach out to discuss your project.

Found this useful? I publish daily deep-dives into developer tools and APIs. Follow for more.

DEV Community