wasp README

The project's README from github.com/wasp-lang/wasp. As one markdown file: README.md.

The fastest way to develop full-stack web apps with React & Node.js.


license latest release discord

Website | Docs
Discord | Twitter | Youtube
Deployed? Get swag! 👕

What is Wasp?

Wasp (Web Application Specification) is a Rails-like framework for React, Node.js, and Prisma. Build your app in a day and deploy it with a single CLI command!

Why is Wasp awesome

Features

Code example

Simple Wasp spec file in which you describe the high-level details of your web app:

// file: main.wasp.ts

import { app, page, query, route } from "@wasp.sh/spec";

import { MainPage } from "./src/MainPage" with { type: "ref" }; // Your React code.
import { DashboardPage } from "./src/dashboard/DashboardPage" with { type: "ref" };
import { getTasks } from "./src/queries" with { type: "ref" }; // Your Node.js code.

export default app({
  name: "todoApp",
  wasp: { version: "^0.24.0" },
  title: "ToDo App",
  head: ["<link rel='icon' href='/favicon.ico' />"],
  auth: {
    // Full-stack auth out-of-the-box.
    userEntity: "User",
    methods: {
      email: {
        // ...
      },
      google: {
        // ...
      },
    },
    onAuthFailedRedirectTo: "/login",
  },
  spec: [
    route("RootRoute", "/", page(MainPage)),
    route(
      "DashboardRoute",
      "/dashboard",
      page(DashboardPage, {
        authRequired: true, // Limit access to logged-in users.
      }),
    ),
    query(getTasks, {
      entities: ["Task"], // Automatic cache invalidation.
    }),
  ],
});

And a Prisma schema for the database:

// file: schema.prisma

model Task { // Your Prisma data model.
  id          Int     @id @default(autoincrement())
  description String
  isDone      Boolean @default(false)
}

The rest of the code you write in React / Node.js and reference it from the *.wasp.ts files.

👉 Check out TodoApp example for a complete code example. 👈

How it works

Given a simple main.wasp.ts specification file that describes the high-level details of your web app, and .ts(x)/.css/..., source files with your unique logic, Wasp compiler generates the whole source of your web app in the target stack: front-end, back-end and deployment.

This unique approach is what makes Wasp "smart" and gives it its superpowers!

For more information about Wasp, check docs.

Get started

Run to install Wasp on OSX/Linux/WSL(Win):

npm i -g @wasp.sh/wasp-cli@latest

From there, follow the instructions to run your first app in less than a minute!

For a quick start, check out this docs page.

Have a Wasp app deployed? - we will send you swag!

If you have a Wasp application running in production, we'd love to send some swag your way! Fill out this form, and we'll make it happen.

AI Agent Plugins

Wasp has official AI agent plugins to help you kickstart your next Wasp project. You can use them with your favorite AI-assisted coding tool (Cursor, Claude Code, etc.) to get a better result and development experience. Check out the Wasp Agent Plugins page for more details.

Project status

Currently, Wasp is in beta, with most features fully developed and functioning well. However, we still have many improvements and additions in mind for the future, and we are continually working on them. As a result, you can expect numerous changes and improvements in the future.

Keep up with Wasp by following our development roadmap.

While the idea is to support multiple web tech stacks in the future, we are currently focusing on a specific stack: React + TanStack Query, Node.js + Express.js, and Prisma.

Contributing

We welcome contributions! Small, obvious fixes (typos, broken links, docs corrections, small bugs where the fix is clear and comes with a test) are welcome directly as PRs.

For anything bigger (new features, refactors, changes in behavior), please talk to us first, in a GitHub issue or on Discord, so we can agree on the approach before you write code.

Check out CONTRIBUTING for more details.

Even if you don't plan to submit any code, just joining the discussion on Discord and giving your feedback is already great and helps a lot (motivates us and helps us figure out how to shape Wasp)!

You can also:

Careers

Check our careers page for a list of currently opened positions!

Sponsors

michelwaechter - Our first sponsor ever! Thanks so much, Michel ❤️ , from the whole Wasp Team, for bravely going where nobody has been before :)!

shayneczyzewski - Thanks Shayne, for all the contributions you did so far and for your continuous support!

VelocityOne - Thanks VelocityOne for the generous donation!

ricdex - We are thankful for your support Ricardo in this early stage of Wasp :)!

ThomasJonesUK - Thanks Thomas for supporting Wasp :)!

Arukaito - Our awesome sponsor again and again!

Case-E - Big thanks for supporting us both via sponsorship and great suggestions!

Past sponsors

MarianoMiguel Tech4Money haseeb-heaven

wasp (wasp-lang/wasp)

Searching Database…

18.8K ·GitHub
这是什么东西?Wasp(Web Application Specification)是一个类似 Rails 的全栈框架,面向 React、Node.js 和 Prisma——你只需在一个声明式的 spec 文件里描述 Web 应用的高层细节。
它是框架还是库?和我自己把 React 和 Node.js 拼起来有什么区别?它是一个框架,不是库:它把登录认证、RPC、后台任务、邮件发送、端到端类型安全这些全栈功能都封装好了,你要写和维护的样板代码会少很多。
我怎么从零开始跑起一个应用?先写一段简短的声明式 spec,再加上描述数据库的 Prisma schema,填入你的 React 和 Node.js 代码,然后用一条 CLI 命令就能部署——README 说一天就能做到可以上线的程度。
我会不会被绑死在某个托管服务商上?不会。Wasp 应用可以部署到任何地方,不依赖特定的服务商,而且你完全掌控代码,甚至可以在生成的 .wasp/ 目录里查看这些代码。
它开箱即用都提供哪些功能?全栈登录认证、客户端与服务器之间的 RPC、后台任务、邮件发送、全栈类型安全,以及简单的单命令部署——另外由于需要维护的生成代码更少,升级也更省心。
整个应用都写在 spec 文件里吗?不是——spec 只描述应用的高层细节。其余部分就是普通的 React 和 Node.js 代码,通过 .wasp.ts 文件引用,数据库则由 Prisma schema 来描述。
Wasp 为什么说它特别适合 AI?它对整个应用的高层 spec、有主见的固定结构和紧密集成的技术栈,能让 AI 编程助手有清晰的边界、更少的样板代码要处理,上下文管理也更好。
有没有完整的示例应用可以学习?有——README 推荐了 Wasp TodoApp 这个完整的代码示例,展示了 spec、Prisma schema 和 React/Node.js 代码如何协同工作。
What are similar projects?blitz, open-saas, reflex, graphql, gin-vue-admin, next.js, mean, datapages
Creator
wasp-lang
Size
1 GB
Stars
18.8K
Age
6y
Commits · 90 Days