Prisma Playground: An Interactive Learning Experience for Prisma

A better way to onboard new developers

Creating a dev environment can cause friction

Like many developer tools, Prisma requires its users to set up a dedicated environment when they want to start exploring its workflows. To use Prisma, you need to have Node.js installed and some kind of database available that you can connect to.

However, sometimes when new developers want to get sense for what it's like using Prisma, they might not want to set up a local Node.js project or spin up an entire database just to know what it feels like to send a database query with Prisma Client.

Prisma Playground lets you try Prisma instantly

That's why we decided to partner up with the folks from Devbook to make the onboarding experience for future Prisma users even easier. Today, we are excited to launch the first version of the Prisma Playground 🎉

With the Playground, you can try out Prisma instantly inside of your browser.

If you're not yet using Prisma, be sure to visit the Playground to explore the Prisma Client API which lets you send database queries and learn how Prisma Migrate can help to evolve your database schema.

Prisma Playground: An interactive and isolated sandbox environment

When getting started with the Prisma Playgroud, you can choose whether you want to learn about Prisma Client or Prisma Migrate.

Depending on what you choose, you'll end up in the interactive editor to send queries with Prisma Client or follow interactive guides that teach you Prisma Migrate workflows.

Send database queries with Prisma Client

The Prisma Client API explorer lets you explore how to send database queries with Prisma Client. You can choose from a variety of preconfigured queries to read and write data in the database or learn more advanced query patterns like transactions or raw SQL queries.

While the explorer has a bunch of preconfigured queries, you're totally free to adjust the queries in any way you like and observe the changes in the results.

Tip: Use the auto-completion feature in the editor by hitting CTRL+SPACE if you don't know what to type next.

For convenience, the Prisma Client API explorer comes with initial sample data and a fixed schema that you can view by hitting the prisma/schema.prisma tab next to the Run button.

Learn Prisma Migrate workflows

For Prisma Migrate, the Playground offers interactive guides that give instructions for you to learn about the various migration workflows Prisma Migrate supports, such as creating a table, renaming a column or defining a many-to-many relationship.

Let us know what you think

We encourage you to try out the Playground and let us know what you think! While we have many ideas for future applications and other areas where the Playground can be useful, we're very much interested in hearing from you what you like to see!

Share your feedback with us in the feedback box at the end of each guide or reach out directly in the #product-wishlist channel of the Prisma Slack.