CODESEEDSign in
Explore projects
JavaScriptadvancedweb

Browser-based SQL Playground

SQL editor in browser with SQLite via WASM, syntax highlighting, schema autocomplete, query execution, and tabular results display.

5 steps
Sign in to claim this project

Project steps

  1. 01

    SQLite WASM

    sql.js: loads SQLite compiled as WebAssembly in the browser.

  2. 02

    Schema explorer

    Sidebar with tables, columns, and types from the current database.

  3. 03

    SQL editor CodeMirror

    CodeMirror 6 with SQL language support, syntax highlighting, and basic autocomplete.

  4. 04

    Query execution

    Executes query and displays results in a virtual table (virtual scroll for many rows).

  5. 05

    Import/export

    Import CSV into a new table; export query results as CSV or JSON.

Recommended resources

Ready to build this?

Fork the repo on GitHub and start building. A mentor will review your code when you open a PR.

5 steps

Tech stack

JavaScriptsql.js (SQLite WASM)CodeMirror 6ReactTailwind