Wasp is a full-stack framework that uses a declarative DSL to generate React + Node.js + Prisma apps. Define your app in a .wasp file, get authentication, CRUD, and deployment for free.
Define Your App
// main.wasp
app TodoApp {
wasp: { version: "^0.14.0" },
title: "Todo App",
auth: {
userEntity: User,
methods: { usernameAndPassword: {} }
}
}
entity User {=psl
id Int @id @default(autoincrement())
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=}
query getTasks {
fn: import { getTasks } from "@src/queries",
entities: [Task]
}
action createTask {
fn: import { createTask } from "@src/actions",
entities: [Task]
}
route MainRoute { path: "/", to: MainPage }
page MainPage { component: import { MainPage } from "@src/pages/Main" }
Server Logic
// src/queries.ts
export const getTasks = async (args, context) => {
return context.entities.Task.findMany({
where: { userId: context.user.id },
orderBy: { id: 'desc' }
});
};
// src/actions.ts
export const createTask = async ({ description }, context) => {
return context.entities.Task.create({
data: { description, userId: context.user.id }
});
};
React Components
// src/pages/Main.tsx
import { useQuery } from 'wasp/client/operations';
import { getTasks, createTask } from 'wasp/client/operations';
export function MainPage() {
const { data: tasks } = useQuery(getTasks);
const [desc, setDesc] = useState('');
const handleSubmit = async () => {
await createTask({ description: desc });
setDesc('');
};
return (
<div>
<input value={desc} onChange={e => setDesc(e.target.value)} />
<button onClick={handleSubmit}>Add Task</button>
{tasks?.map(t => <div key={t.id}>{t.description}</div>)}
</div>
);
}
What You Get for Free
- Auth (username/password, Google, GitHub OAuth)
- Type-safe client-server communication
- Prisma ORM integration
- One-command deployment to Fly.io
- Email sending, cron jobs, WebSocket support
Why This Matters
- 10x less boilerplate: DSL generates the boring parts
- Full-stack type safety: Server types flow to client
- Built-in auth: No more rolling your own
-
Deploy in minutes:
wasp deploy fly
Need custom full-stack tools or rapid prototyping? I build developer tools. Check out my web scraping actors on Apify or reach out at spinov001@gmail.com for custom solutions.
Top comments (0)