On the internet, someone is constantly making tools to make web development easier. Let’s leave the discussion about the initially low complexity and IT specialists, simplification of any workflow is, in principle, rather good than bad. Here are just young developers and startups mainly in batches produce all sorts of boilerplate generators and low-code tools that pull an extra layer of abstraction and a potential source of a breaking build. Due to the wide variety, they usually do not offer unique features and are left unattended, after which would-be startups abandon development and support to switch to another source of hype. In general, for those wishing to enter this niche, the situation is deplorable, but not hopeless – for example Wasp, a young DSL language that tries to simplify development at all stages up to deployment.

Model

The idea is to put the description of key constructs like pages, routes, database model, etc. into a separate syntax, then compile it all into regular js / jsx / configs / etc files, raise the backend and, if necessary, deploy to AWS. This approach allows you to gain time in training: instead of memorizing pitfalls in certain implementations of specific technologies (knowledge that needs updating with each major or broken release of each product), you can learn one language that will take care of everything at once. On the one hand, this again erodes the requirements for the developer, adds a layer of abstraction and suggests, instead of manual management, trust someone else’s code, but on the other hand, it makes it faster and easier to launch full-stack applications and reduces the likelihood of producing bugs or even leaving a time bomb where knowledge is. “Float”. As in any framework, everything rests on the trust in the competencies of the developers and the support of the community, and here Wasp looks confident enough. During the year of development, the project went through several releases, gathered a fairly large community and came out on top in ProductHunt in December, and the density of commits has only been growing since the summer.

Wasp uses the popular React + NodeJS / ExpressJS + Prisma stack, it is planned to adjust the choice of technologies for yourself, but the timing is not yet known – obviously, adding even a couple of web frameworks (Vue / Angular) and databases (Mongo / Sqlite) will require a huge amount of work code. The scheme of use looks like this:

And here another bold plus of Wasp is revealed: this is not a conditional Webpack with unreadable output, after compilation we get the usual readable sources, as if all the code was written by an ordinary developer. At any time, you can tweak something manually in React or add specific settings for Express where Wasp cannot cope with this. Thus, we get not a silver bullet that solves all our problems, but will add minor functionality for years, but a common tool in the development arsenal that does its job and, if necessary, passes the code further along the chain. It’s cool, it looks like a real niche, not just another copy-paste framework.

Tongue

Wasp tries to stick to an intuitive syntax similar to a JS add-on. The keywords in the language are terms related to the architecture of the application (page, route). The language does not try to crush the entire development for itself: in the .wasp files only the application schema is described, which allows it to be changed and refined centrally. Tasks like describing components or requests to the backend, which are more convenient for everyone to deal with in js / jsx, are described in regular files.

This is how the basic structure of a Wasp project looks like (monolithic .wasp is used only for simplicity, nothing prevents us from dividing it by functionality into several files in the future):

  TodoApp/
  - main.wasp
  - ext/
    - operations.js
    - pages/
      - Main.js

  // main.wasp

  // регистрация приложения todo
  app todoApp {
    title: "ToDo App"
  }
  
  // описание маршрутов
  route "/" -> page Main
  page Main {
    component: import Main from "@ext/pages/Main"
  }
  
  // описание запроса для получения задач из базы
  query getTasks {
    fn: import { getTasks } from "@ext/operations.js",
    entities: [Task]
  }
  
  // описание функции добавления задачи
  action createTask {
    fn: import { createTask } from "@ext/operations.js",
    entities: [Task]
  }
  
  // описание модели задачи в Prism
  // (в скобках {=psl psl=} используется синтаксис Prisma Schema Language)
  entity Task {=psl
    id          Int     @id @default(autoincrement())
    description String
    isDone      Boolean @default(false)
  psl=}

A detailed acquaintance with Wasp should start with the TodoApp tutorial, from which the example described above is taken. It can be read here, everything is laid out on the shelves.

The language currently describes the following elements:

• app – defines the application and its global properties.
• page – describes the pages in the application, the components used and properties like authRequired.
• route – describes routes for React Router. Supports redirects, parameters, etc.
• entity – describes the Prisma model in Prisma Schema Language (PSL) syntax.
• query – describes requests that do not change state (GET).
• action – describes requests that affect the state.
• dependencies – Allows you to add NPM dependencies directly to your code.
• auth – describes the authorization model specifying userEntity, authorization methods and other parameters.

Most of the elements are quite trivial, but it is better to familiarize yourself with the implementation details of query / action and auth in the documentation (one, 2)

It turns out that you need to remember quite a bit to describe the scheme of your first Wasp application. The syntax tries to inherit expressions from JS as much as possible, import JSON and PSL. It seems to me that at the alpha stage, ease of learning is one of the most important things for a language, along with reliability and convenience.

Conclusion

It is certainly good when projects that affect web development standards do not arise due to the support and injections of technical giants, but grow out of the minds of ordinary developers. It will be great if Wasp can grow into a serious production-ready product without losing its simplicity and flexibility along the way. Maybe even someday it will become the next mandatory tool for the front’s transition to full stack, who knows. If you like it too, read (medium-sized, but detailed) documentation, try building your own demo, and if you know Haskell, you can even participate in the compiler refinement.

---

Servers for rent at a discount! Order a VDS of any configuration and get a 10% discount for the first month of server rent. Choosing our services, you only win: reliable and modern hardware, a reliable data center of TIER IV level in Moscow, Internet at a speed of 500 Mbps, free protection against attacks, the ability to install any operating system on your server!