Bac à sable SQL

Exécutez du vrai SQL sur des jeux de données d’exemple — ou votre propre schéma — directement dans le navigateur. Écrivez des requêtes, voyez les résultats formatés instantanément, et exportez-les ou partagez-les. Propulsé par sql.js (SQLite WASM) ; 100 % côté client.

Data & DevOps

cosmodev ~/tools/sql-playground

Exemples

Le moteur SQLite se charge dans votre navigateur. Rien n’est envoyé nulle part.

Schéma

CREATE TABLE users (
  id INTEGER PRIMARY KEY,
  name TEXT NOT NULL,
  email TEXT NOT NULL,
  role TEXT DEFAULT 'member',
  created_at TEXT
);

INSERT INTO users (id, name, email, role, created_at) VALUES
  (1, 'Alice Chen', 'alice@example.com', 'admin', '2024-01-10'),
  (2, 'Bob Smith', 'bob@example.com', 'member', '2024-02-14'),
  (3, 'Carol Díaz', 'carol@example.com', 'editor', '2024-03-05'),
  (4, 'Dan Kim', 'dan@example.com', 'member', '2024-04-20'),
  (5, 'Eve Johnson', 'eve@example.com', 'admin', '2024-05-01');

CREATE TABLE orders (
  id INTEGER PRIMARY KEY,
  user_id INTEGER REFERENCES users(id),
  product TEXT NOT NULL,
  amount REAL NOT NULL,
  status TEXT DEFAULT 'pending',
  ordered_at TEXT
);

INSERT INTO orders (id, user_id, product, amount, status, ordered_at) VALUES
  (1, 1, 'Pro Plan', 29.99, 'completed', '2024-03-01'),
  (2, 1, 'Add-on Pack', 9.99, 'completed', '2024-03-15'),
  (3, 2, 'Basic Plan', 14.99, 'completed', '2024-04-01'),
  (4, 3, 'Pro Plan', 29.99, 'pending', '2024-04-10'),
  (5, 4, 'Basic Plan', 14.99, 'refunded', '2024-05-01'),
  (6, 1, 'Enterprise', 99.99, 'completed', '2024-06-01'),
  (7, 5, 'Pro Plan', 29.99, 'completed', '2024-06-15');

CREATE TABLE users (
  id INTEGER PRIMARY KEY,
  name TEXT NOT NULL,
  email TEXT NOT NULL,
  role TEXT DEFAULT 'member',
  created_at TEXT
);

INSERT INTO users (id, name, email, role, created_at) VALUES
  (1, 'Alice Chen', 'alice@example.com', 'admin', '2024-01-10'),
  (2, 'Bob Smith', 'bob@example.com', 'member', '2024-02-14'),
  (3, 'Carol Díaz', 'carol@example.com', 'editor', '2024-03-05'),
  (4, 'Dan Kim', 'dan@example.com', 'member', '2024-04-20'),
  (5, 'Eve Johnson', 'eve@example.com', 'admin', '2024-05-01');

CREATE TABLE orders (
  id INTEGER PRIMARY KEY,
  user_id INTEGER REFERENCES users(id),
  product TEXT NOT NULL,
  amount REAL NOT NULL,
  status TEXT DEFAULT 'pending',
  ordered_at TEXT
);

INSERT INTO orders (id, user_id, product, amount, status, ordered_at) VALUES
  (1, 1, 'Pro Plan', 29.99, 'completed', '2024-03-01'),
  (2, 1, 'Add-on Pack', 9.99, 'completed', '2024-03-15'),
  (3, 2, 'Basic Plan', 14.99, 'completed', '2024-04-01'),
  (4, 3, 'Pro Plan', 29.99, 'pending', '2024-04-10'),
  (5, 4, 'Basic Plan', 14.99, 'refunded', '2024-05-01'),
  (6, 1, 'Enterprise', 99.99, 'completed', '2024-06-01'),
  (7, 5, 'Pro Plan', 29.99, 'completed', '2024-06-15');

Requête

⌘/Ctrl + ↵

SELECT u.name, u.role, COUNT(o.id) AS orders, SUM(o.amount) AS total
FROM users u
LEFT JOIN orders o ON o.user_id = u.id
GROUP BY u.id
ORDER BY total DESC;

Exécutez une requête pour voir les résultats.

cosmodev ~/docs/sql-playground.md

Ce que ça fait

Le SQL Playground vous permet d’écrire et d’exécuter de vraies requêtes SQL directement dans votre navigateur — pas d’installation, pas d’inscription, aucune donnée ne quitte votre machine. Il embarque une base de données d’exemple prête à interroger (users + orders) pour explorer jointures, agrégats et filtres dès le chargement de la page. Remplacez-la par votre propre schéma à tout moment et la base se reconstruit en direct.

Il repose sur sql.js, un moteur SQLite complet compilé en WebAssembly. Vous bénéficiez donc d’un vrai comportement SQL — transactions, contraintes, agrégats, sous-requêtes — s’exécutant à 100 % côté client. Les résultats s’affichent dans un tableau propre avec compte de lignes et minutage, et vous pouvez les exporter en CSV, JSON ou Markdown en un clic.

Comment l’utiliser

Le panneau Schema à gauche est pré-rempli avec une base d’exemple users + orders. Modifiez-le librement — la base se reconstruit automatiquement quand vous arrêtez de taper, et un badge vert « applied » confirme que ça a fonctionné.
Écrivez votre SQL dans le panneau Query à droite — les deux éditeurs surlignent la syntaxe SQL à mesure que vous tapez — ou cliquez l’une des puces de requêtes d’exemple (Select all, Filter, Aggregate, Join, Sort + limit, CTE, Subquery, Having, Like + order, Union) pour charger une requête prête à l’emploi.
Cliquez Run (ou pressez ⌘/Ctrl + Entrée) pour exécuter.
Lisez le tableau Results en dessous — il montre les en-têtes de colonnes, des valeurs typées (les NULL ont un style distinct), un compte de lignes, un badge lecture seule pour les requêtes SELECT, et le temps écoulé en millisecondes.
Utilisez la bascule CSV / JSON / Markdown + Copy results pour exporter la sortie dans votre format préféré.
Cliquez Copy share link pour encoder votre schéma et votre requête courants dans l’URL — quiconque ouvre le lien voit votre configuration exacte.

Exemples

Joindre deux tables et agréger

SELECT u.name, u.role, COUNT(o.id) AS orders, SUM(o.amount) AS total
FROM users u
LEFT JOIN orders o ON o.user_id = u.id
GROUP BY u.id
ORDER BY total DESC;

Retourne chaque utilisateur avec son compte de commandes et son total de dépenses, trié du plus élevé au plus faible. Les utilisateurs sans commande apparaissent avec 0 / NULL.

Filtrer avec une sous-requête

SELECT name, email FROM users
WHERE id IN (SELECT user_id FROM orders WHERE amount > 20);

Ne retourne que les utilisateurs ayant passé une commande supérieure à 20 $.

Inspecter la structure d’une table

PRAGMA table_info(users);

Retourne l’index de colonne, le nom, le type, la nullabilité et la valeur par défaut de chaque colonne de la table users — utile pour explorer des schémas inconnus.

Bon à savoir

100 % côté client. Votre SQL et vos données ne quittent jamais le navigateur — tout s’exécute localement via sql.js (SQLite compilé en WebAssembly). Sûr pour des schémas sensibles.
Édition de schéma en direct. Modifiez le panneau Schema et la base se reconstruit automatiquement (avec anti-rebond). Les erreurs sont affichées en ligne — les requêtes restent désactivées jusqu’à ce que le schéma redevienne valide.
Dialecte SQLite. C’est du vrai SQLite — vous avez les fonctions de fenêtrage, les CTE, les fonctions JSON et la plupart des capacités de SQLite. Quelques choses (procédures stockées, syntaxe spécifique MySQL/Postgres) ne sont pas prises en charge.
Partageable. Votre schéma et votre requête sont encodés dans l’URL, donc un lien partagé reproduit l’état exact de votre terrain de jeu.
Outils liés : Regex Tester, JSON Formatter.