Introduction

Supaplay is a playground to effortlessly test and refine your supabase-js JavaScript functions against your PostgreSQL thanks to the power of WebContainer API.

Video demo

Watch video

Features

Zero Setup

Supaplay Playground is all set up for you. No need to configure IDEs or dependencies. Just provide your Supabase keys and start testing your queries instantly.

Interactive Query Testing

Write and execute queries using Monaco editor and get JSON-formatted results. This makes it easy to integrate the results of your queries into your own applications.

WebContainer API Magic

Experience the power of WebContainerAPI, running Node.js in your browser. Effortlessly harness its capabilities to create, edit, and run code seamlessly.

Stack

• Vite + React + TypeScript
• TailwindCSS
• Radix UI
• WebContainer API
• Monaco Editor for React
• Routing - wouter
• Deployment - Vercel

Development

1.Clone the repo:

git clone https://github.com/xavimondev/supaplay.git

2.Install dependencies:

# pnpm:
pnpm install
# npm:
npm install
# yarn:
yarn install

2.Start the development mode:

# pnpm:
pnpm dev
# npm:
npm run dev
# yarn:
yarn dev

3.Finally open http://localhost:5173

Contributing

You can contribute by adding new features, fixing bugs, improving logic code, etc. All the contributions you make are really appreciated.

1.Fork the repo.

2.Create a branch:

git switch -c newfeature

3.Commit and push your changes:

git commit -am 'Add a new feature'
git push origin newfeature

4.Open a Pull Request