Matija Sosic for Wasp

Posted on Apr 23

🐝 Wasp: a full-stack, "Laravel for JS" framework. Vibe-coding approved 🕹️

#webdev #react #vibecoding #ai

What is Laravel, and why do I need it for JavaScript?

Laravel is one of the most popular web frameworks for PHP. It was released in 2011 and has since become a synonym for a well-designed, enjoyable developer experience. Its "superpower" is that it provides pretty much everything you need with the best practices out of the box. Authentication, ORM, emails, jobs, testing - there is a "Laravel" way to do it, and there's nothing for you to figure out - it all just works!

On the other hand, the JavaScript ecosystem is on the drastically opposite spectrum. There is a standalone library/service for pretty much every web app feature, and it's up to you to figure out the best way to integrate it all together.

It can be fun to hand-select every part of your stack, but it can also be quite frustrating when you have an idea and want to get it out to users as soon as possible.

This is why developers who used all-in-one full-stack frameworks such as Laravel, Rails, and Django have been very strongly calling for the same experience in JavaScript.

There are historical and maturity reasons why we didn't have that in JavaScript for so long, but finally, the times are changing.

There are multiple solutions and frameworks that aim to solve this problem, and today we'll take a look at one of the fastest-growing among them: Wasp! 🐝

Wasp: A full-stack, “Laravel for JS” framework. Great for vibe-coders, too!

Wasp is one of the fastest-growing next-gen full-stack web frameworks and is leading the pack when it comes to pushing for a Laravel-like experience in JavaScript. It appeared at about the same time as Redwood and was motivated by the same pain (too fragmented and modular JS ecosystem). Wasp is currently in Beta (recently went through its Launch Week #9) but is already being used by solopreneurs, startups, and Fortune 500 companies.

The main “secret sauce” is a declarative specification file where a developer describes their app at a high level - pages and routes, async jobs, database operations, and more. It helps cut down a lot of boilerplate and lets a developer focus on their unique logic in React, Node.js, and Prisma.

Support us! 🙏⭐️

If you find this post helpful,consider giving us a star on Github! Everything we do at Wasp is open source, and your support helps us make web development easier and motivates us to write more articles like this one.

⭐️ Thanks For Your Support 🙏

OpenSaaS - a free, open-source boilerplate starter for React & Node.js

Finally, one of the big drivers for developers choosing Wasp for their projects is OpenSaaS - a 100% free and open-source SaaS boilerplate starter on top of Wasp. It comes with a lot of common features out-of-the-box (Stripe & OpenAI integration, blog via Astro, admin dashboard, file uploads, …) and will save you hundreds of development hours. Since its release about a year ago, it has skyrocketed toover 10,000 stars on GitHub, and has been used to bring hundreds of SaaSes to life.

Wasp helps vibe coders build their apps further and safer 🕹️

Recently, Wasp has been gaining a lot of popularity among so-called “vibe coders”, which is just a trendy term for people who want to build their app as fast as possible using AI. It turns out that a Wasp app’s robust structure that spans the whole stack of your app (client, server, database, and deployment) and less boilerplate code helps AI develop more features and make fewer mistakes along the way.

Here you can find a detailed video guide that explains the whole process, step-by-step, on how to build your next app with Wasp and Cursor, and then also deploy it to production.

Happy building and stay safe!

Hopefully, this post gave you an insight into the latest developments of the JavaScript ecosystem and prompted (pun intended) you to start working on your next idea, be it with Wasp or another framework that fits your needs the best.

Also, whether you adopt less or more AI in your development workflow, make sure to check and understand your app’s code before putting it into production. Although full-stack frameworks such as Wasp can help with ensuring best practices out of the box, it’s still your responsibility as a developer to make sure that the code that goes out meets all the security standards.

With that said, happy coding! If you want to support our mission with Wasp, we’d appreciate it if you starred it on GitHub. We’d also love to hear from you, and we’re here if you have any questions about Wasp or web dev in general - you can always find us in our Discord.

Top comments (20)

Zizaco • Apr 25

1) AdonisJS is a better Laravel-for-JS
2) Vibe coding is not a good thing

Matija Sosic • Apr 25

When referring to Wasp as "Laravel for JS", it was more in the sense of providing an integrated, opinionated DX rather than being a carbon copy of how exactly Laravel works, which Adonis is definitely closer to, being a backend-first framework, while is covering the full-stack of your app.

But I understand the confusion - developers today use the term "Laravel/Rails for JS" in both ways, so it's not always clear what they want to say by it.

phpArtisanMakeWeeb • Apr 25 • Edited

Maybe you should have explained yourself better. It's not about having an opinionated DX. It's about being pleasant to use and having a really GOOD DX

I would never want to use something like this over Laravel, it's not good enough.

app todoApp {
  title: "ToDo App",  // visible in the browser tab
  auth: { // full-stack auth out-of-the-box
    userEntity: User, 
    methods: { google: {}, gitHub: {}, email: {...} }
  }
}

route RootRoute { path: "/", to: MainPage }
page MainPage {
  authRequired: true, // Limit access to logged in users.
  component: import Main from "@client/Main.tsx" // Your React code.
}

query getTasks {
  fn: import { getTasks } from "@server/tasks.js", // Your Node.js code.
  entities: [Task] // Automatic cache invalidation.
}

Matija Sosic • Apr 25

Thanks for checking it out! Yes, Wasp is currently in Beta. We'll soon announce a full roadmap for reaching 1.0.

Vibe coding is great, if you do it responsibly :)

Isaiah • Apr 23

I'm not a fan of vibe coding but I can vibe with Wasp. 🐝

Carlos Precioso • Apr 23

I am a Wasp maximalist 🐝🐝🐝

Nevo David • Apr 23

nice seeing stuff like this get more attention - you think having all-in-one tools makes it easier to actually finish projects or just makes things more crowded?

cameronapak • Apr 23

Built cultivatepkm.com with Wasp 🐝

Matija Sosic • Apr 23

I love what you shared about it in our Discord! Can't seem to see anything when I visit the link though?, just a blank screen?

Cameron Pak • May 5

Try cultivate.so/signup and use code c0f821ce59c9142a

jihad khorfan • Apr 24

Do you recommend it , what's the good and the bad?

Milica Maksimovic • Apr 23

Cursor + Wasp = 😎

Ngam Vitalis Yuh • May 1

Great insights but before vibe coding, I believe we need to understand the concepts thoroughly do we don't jump into issues that can not be resolved by ourselves.

Louis Liu • Apr 24

This really interests me, I'm definitely going to try it.

Franjo Mindek • Apr 23

I vibe with this

Oluwatobi O • Apr 23

Checked the docs and it looks good.... I'll definitely try it out

View full discussion (20 comments)

Some comments may only be visible to logged-in visitors. Sign in to view all comments. Some comments have been hidden by the post's author - find out more