Practice typing real code — JavaScript, Python, HTML, CSS, TypeScript, and SQL. Supports multi-indentation, brackets, and special characters.
Variable Declaration
let name = "BoomType";...
Constant Variable
const speed = 75;...
Boolean Variable
let isActive = true;...
Console Log
console.log("Hello, World!");...
Array Literal
let arr = [1, 2, 3, 4, 5];...
Math Constant
const PI = 3.14159;...
String Variable
let message = "Keep typing!";...
String Concatenation
console.log(name + " rocks!");...
Multiple Variables
let x = 10; let y = 20;...
Array of Strings
const colors = ["red", "green", "blue"];...
Increment Operator
let score = 0; score++;...
Array Length
console.log(arr.length);...
Boolean False
let isLogged = false;...
Math Max
const max = Math.max(10, 20, 30);...
Template Literal
let greeting = `Hello, ${name}!`;...
Function Declaration
function greet(name) { return `Hello, ${name}!`; }...
Arrow Function
const double = (n) => n * 2;...
For Loop
for (let i = 0; i < 5; i++) { console.log(i); }...
Array Map
const nums = [1,2,3].map(n => n * n);...
If Else
if (score > 60) { console.log("Pass"); } else { console.log("Fail"); }...
Array Reduce
const sum = arr.reduce((a, b) => a + b, 0);...
While Loop
while (x > 0) { x--; console.log(x); }...
Array Filter
const evens = arr.filter(n => n % 2 === 0);...
Recursive Factorial
function factorial(n) { return n <= 1 ? 1 : n * factorial(n - 1); }...
Object Literal
const obj = { name: "Ali", age: 25, city: "Lahore" };...
Array Destructuring
const [first, ...rest] = [1, 2, 3, 4, 5];...
Object Keys
const keys = Object.keys(obj);...
ForEach Loop
arr.forEach((item, index) => console.log(index, item));...
Array Sort
const sorted = [...arr].sort((a, b) => a - b);...
Array Find
const found = arr.find(n => n > 3);...
Async Fetch
async function fetchData(url) { const res = await fetch(url); return res.json(); }...
Memoize Function
const memoize = (fn) => { const cache = {};...
ES6 Class
class Animal { constructor(name) { this.name = name; } speak() { return `${this.name} makes a sound.`; } }...
Debounce Function
const debounce = (fn, ms) => { let timer;...
Promise All
Promise.all([fetch("/api/users"), fetch("/api/posts")]).then(([users, posts]) => console.log(users, posts));...
Generator Function
function* generator() { yield 1; yield 2; yield 3; }...
Proxy Object
const proxy = new Proxy(obj, { get: (t, k) => k in t ? t[k] : "Not found" });...
Array Flatten
const flatten = (arr) => arr.reduce((flat, item) =>...
Event Emitter
class EventEmitter { constructor() { this.events = {}; }...
Curry Function
const curry = (fn) => { const arity = fn.length;...
Async Generator
async function* asyncGenerator() { for (let i = 0; i < 3; i++) { await new Promise(r => setTimeout(r, 100)); yield i; } }...
Deep Clone
const deepClone = (obj) => JSON.parse(JSON.stringify(obj));...
Function Pipe
const pipe = (...fns) => (x) => fns.reduce((v, f) => f(v), x);...
Object Freeze
Object.freeze({ API_URL: "https://api.boomtype.org", VERSION: "2.0" });...
Group By
const groupBy = (arr, key) => arr.reduce((acc, item) => ({...
Variable Assignment
name = "BoomType"...
Integer Variable
speed = 75...
Print Statement
print("Hello, World!")...
is_active = True...
List Literal
numbers = [1, 2, 3, 4, 5]...
F-String
print(f"Hello, {name}!")...
Multiple Statements
x = 10; y = 20; print(x + y)...
List of Strings
colors = ["red", "green", "blue"]...
List Length
print(len(numbers))...
Increment
score = 0; score += 1...
Float Variable
pi = 3.14159...
Index Access
print(numbers[0])...
is_logged = False...
Max Function
max_val = max(10, 20, 30)...
F-String Variable
greeting = f"Speed: {speed} WPM"...
Function Definition
def greet(name): return f"Hello, {name}!"...
List Comprehension
squares = [x**2 for x in range(10)]...
for i in range(5): print(i)...
Filter Lambda
even = list(filter(lambda x: x % 2 == 0, numbers))...
Conditional
if score > 60: print("Pass") else: print("Fail")...
Sum Function
total = sum(numbers)...
while x > 0: x -= 1; print(x)...
Map Lambda
doubled = list(map(lambda x: x * 2, numbers))...
def factorial(n): return 1 if n <= 1 else n * factorial(n-1)...
Dictionary
person = {"name": "Ali", "age": 25, "city": "Lahore"}...
Tuple Unpacking
first, *rest = [1, 2, 3, 4, 5]...
Dictionary Keys
keys = list(person.keys())...
Sort Reversed
sorted_nums = sorted(numbers, reverse=True)...
Next with Generator
found = next((n for n in numbers if n > 3), None)...
Zip Lists
pairs = list(zip(colors, numbers))...
Async Function
import asyncio; async def fetch(): await asyncio.sleep(1); return "data"...
Memoized Fibonacci
from functools import lru_cache ...
Class Definition
class Animal: def __init__(self, name):...
Decorator Lambda
decorator = lambda fn: lambda *a, **kw: (print("Before"), fn(*a, **kw), print("After"))[1]...
Context Manager
from contextlib import contextmanager ...
def generator(): for i in range(3):...
Dataclass
from dataclasses import dataclass ...
JSON Parsing
import json; data = json.loads('{"name": "BoomType", "wpm": 100}')...
Flatten List
flatten = lambda lst: [x for sub in lst for x in sub]...
Type Hints
from typing import List, Optional; def find(arr: List[int], val: int) -> Optional[int]: return next((x for x in arr if x == val), None)...
Curry Lambda
curry = lambda f: lambda x: lambda y: f(x, y)...
Collections Counter
from collections import Counter; freq = Counter("hello world")...
pipe = lambda *fns: lambda x: __import__("functools").reduce(lambda v, f: f(v), fns, x)...
File Read
with open("data.txt", "r") as f: content = f.read()...
Regex Findall
import re; emails = re.findall(r"[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}", text)...
Heading
<h1>Welcome to BoomType</h1>...
Paragraph
<p>Practice typing every day.</p>...
Anchor Link
<a href="https://boomtype.org">Visit BoomType</a>...
Image Tag
<img src="logo.png" alt="BoomType Logo">...
Button
<button>Start Typing Test</button>...
Div with Class
<div class="container">Content here</div>...
Span
<span class="highlight">Fast typist</span>...
Unordered List
<ul><li>Speed</li><li>Accuracy</li><li>Consistency</li></ul>...
Input Field
<input type="text" placeholder="Start typing...">...
Text Formatting
<strong>WPM:</strong> <em>142</em>...
Horizontal Rule
<br><hr><p>Separator above</p>...
Subheading
<h2>Top Typists</h2>...
Label
<label for="name">Full Name:</label>...
Small Text
<small>Free forever · No credit card</small>...
Page Title
<title>BoomType — Master Touch Typing</title>...
Form with Inputs
<form action="/submit" method="POST"><input type="email" name="email" required><button type="submit">Subscribe</button></form>...
Nav Bar
<nav><a href="/">Home</a><a href="/test">Test</a><a href="/lessons">Lessons</a></nav>...
Table Header
<table><thead><tr><th>Rank</th><th>Name</th><th>WPM</th></tr></thead></table>...
Card Component
<div class="card"><h3>Speed Test</h3><p>Test your WPM in 30 seconds.</p><a href="/test">Try it →</a></div>...
Header Section
<header><div class="logo">⚡ BoomType</div><nav>...</nav></header>...
Section with Grid
<section id="features"><h2>Features</h2><div class="grid">...</div></section>...
Range Input
<input type="range" min="0" max="100" value="75" id="volume">...
Select Dropdown
<select name="duration"><option value="30">30 seconds</option><option value="60">60 seconds</option></select>...
Figure with Caption
<figure><img src="chart.png" alt="Progress Chart"><figcaption>Your WPM over 30 days</figcaption></figure>...
Details Summary
<details><summary>What is WPM?</summary><p>Words Per Minute measures typing speed.</p></details>...
Dialog Modal
<dialog id="modal"><h2>Upgrade to Pro</h2><button>Close</button></dialog>...
Progress Bar
<progress value="75" max="100">75%</progress>...
Sidebar
<aside class="sidebar"><h3>Quick Stats</h3></aside>...
Article
<article><header><h2>How to Type Faster</h2></header><p>Practice daily...</p></article>...
Meta Tags
<meta name="description" content="Free typing tutor — improve your WPM"><meta property="og:title" content="BoomType">...
HTML Boilerplate
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>BoomType</title></head><body></body></html>...
Template Slot
<template id="card-template"><div class="card"><slot name="title"></slot><slot name="content"></slot></div></template>...
Accessible Canvas
<canvas id="wpmChart" width="800" height="400" aria-label="WPM Progress Chart" role="img"></canvas>...
Inline SVG
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="40" fill="#7C6FF7"/><text x="50" y="55" text-anchor="middle" fill="white">⚡</text></svg>...
Preload Font
<link rel="preload" href="/fonts/JetBrainsMono.woff2" as="font" type="font/woff2" crossorigin>...
Structured Data
<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebApplication","name":"BoomType","applicationCategory":"EducationalApplication"}</script>...
Picture Element
<picture><source srcset="hero.webp" type="image/webp"><source srcset="hero.jpg" type="image/jpeg"><img src="hero.jpg" alt="Hero"></picture>...
ARIA Progressbar
<div role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width:75%"></div>...
YouTube Embed
<iframe src="https://www.youtube.com/embed/xyz" title="Typing Tutorial" allow="accelerometer; autoplay" allowfullscreen></iframe>...
PWA Manifest
<link rel="manifest" href="/manifest.json"><meta name="theme-color" content="#7C6FF7">...
Search Input
<input type="search" name="q" autocomplete="off" spellcheck="false" autocorrect="off" autocapitalize="none">...
Video Element
<video autoplay muted loop playsinline><source src="demo.webm" type="video/webm"><source src="demo.mp4" type="video/mp4"></video>...
Content Editable
<div contenteditable="true" role="textbox" aria-multiline="true" aria-label="Typing area"></div>...
Favicon Icons
<link rel="icon" href="/favicon.svg" type="image/svg+xml"><link rel="apple-touch-icon" href="/apple-touch-icon.png">...
CSP Meta
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'">...
Body Reset
body { margin: 0; padding: 0; font-family: sans-serif; }...
Heading Style
h1 { color: #7C6FF7; font-size: 2rem; }...
Container Width
.container { max-width: 1200px; margin: 0 auto; }...
Button Style
button { background: #7C6FF7; color: white; border: none; padding: 8px 16px; }...
Link Style
a { color: #4FACFE; text-decoration: none; }...
Card Border
.card { border: 1px solid #1E2A3A; border-radius: 12px; padding: 16px; }...
Responsive Image
img { max-width: 100%; height: auto; }...
Flex Layout
.flex { display: flex; align-items: center; gap: 8px; }...
Text Center
.text-center { text-align: center; }...
Hidden Class
.hidden { display: none; }...
Paragraph Style
p { line-height: 1.6; color: #8892A4; }...
Bold Class
.bold { font-weight: 700; }...
Margin Top
.mt-4 { margin-top: 16px; }...
Input Style
input { border: 1px solid #ccc; padding: 8px; border-radius: 4px; }...
Dark Background
.bg-dark { background-color: #0A0E1A; color: white; }...
CSS Grid
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }...
Gradient Button
.btn { background: linear-gradient(135deg, #4FACFE, #7C6FF7); border-radius: 9999px; transition: transform 0.2s; }...
Button Hover
.btn:hover { transform: scale(1.05); box-shadow: 0 4px 20px rgba(124, 111, 247, 0.4); }...
Media Query
@media (max-width: 768px) { .grid { grid-template-columns: 1fr; } }...
Dark Card
.card { background: #141927; border: 1px solid #1E2A3A; border-radius: 16px; padding: 20px; transition: border-color 0.2s; }...
Card Hover
.card:hover { border-color: rgba(124, 111, 247, 0.4); }...
Sticky Sidebar
.sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; width: 256px; }...
Badge Pill
.badge { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 9999px; font-size: 0.75rem; }...
CSS Variables
:root { --primary: #7C6FF7; --accent: #4FACFE; --bg: #0A0E1A; --border: #1E2A3A; }...
Truncate Text
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }...
Overlay Modal
.overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); backdrop-filter: blur(4px); }...
Progress Track
.progress { height: 6px; background: #1E2A3A; border-radius: 9999px; overflow: hidden; }...
Progress Fill
.progress-bar { height: 100%; background: linear-gradient(90deg, #4FACFE, #7C6FF7); transition: width 0.3s; }...
Avatar
.avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }...
Box Sizing
* { box-sizing: border-box; } html { scroll-behavior: smooth; }...
Fade Up Keyframe
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); }...
Animation Class
.animate { animation: fadeUp 0.4s ease forwards; }...
Ping Keyframe
@keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; }...
Glassmorphism
.glass { background: rgba(255,255,255,0.05); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.1); }...
Gradient Text
.gradient-text { background: linear-gradient(135deg, #4FACFE, #7C6FF7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }...
Grid Layout Support
@supports (display: grid) { .layout { display: grid; grid-template-areas: "sidebar main"; grid-template-columns: 256px 1fr; }...
Custom Scrollbar
.custom-scroll::-webkit-scrollbar { width: 6px; } .custom-scroll::-webkit-scrollbar-thumb { background: #1E2A3A; border-radius: 3px; }...
Container Queries
.container { container-type: inline-size; } @container (min-width: 700px) { .card { grid-column: span 2; } }...
SR Only Utility
@layer utilities { .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }...
Pulse Animation
.pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }...
Theme Variables
[data-theme="dark"] { --bg: #0A0E1A; --text: #fff; } [data-theme="light"] { --bg: #fff; --text: #0A0E1A; }...
View Transition
.card { view-transition-name: card; } ::view-transition-old(card) { animation: fadeOut 0.3s; }...
CSS Masonry
.masonry { columns: 3; column-gap: 16px; } .masonry > * { break-inside: avoid; margin-bottom: 16px; }...
Property Animation
@property --angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; } .rotating { background: conic-gradient(from var(--angle), #4FACFE, #7C6FF7); }...
Typing Cursor
.typing-cursor { display: inline-block; width: 2px; height: 1.2em; background: white; animation: blink 1s step-end infinite; } @keyframes blink { 50% { opacity: 0; } }...
Typed String
const name: string = "BoomType";...
Typed Number
const speed: number = 75;...
Typed Boolean
const isActive: boolean = true;...
Number Array
const scores: number[] = [85, 92, 78, 95];...
Type Alias
type User = { name: string; email: string; };...
Typed Function
const greet = (name: string): string => `Hello, ${name}!`;...
Interface
interface Config { apiUrl: string; timeout: number; }...
Generic Array
const arr: Array<string> = ["a", "b", "c"];...
Spread Max
const max: number = Math.max(...scores);...
Union Type
type Status = "active" | "inactive" | "pending";...
Union Variable
const id: string | number = "usr_123";...
Readonly
const PI: Readonly<number> = 3.14159;...
Function with Types
function add(a: number, b: number): number { return a + b; }...
Record Type
const obj: Record<string, number> = { wpm: 100, accuracy: 98 };...
Readonly Array
const names: readonly string[] = ["Ali", "Sara", "Ahmed"];...
Full Interface
interface User { id: string; name: string; email: string; isPremium: boolean; createdAt: Date; }...
Generic Response
type ApiResponse<T> = { data: T; error: string | null; status: number; };...
Generic Identity
function identity<T>(arg: T): T { return arg; }...
const users: User[] = []; const admins = users.filter(u => u.isPremium);...
Enum
enum Level { Beginner = "beginner", Intermediate = "intermediate", Advanced = "advanced" }...
Partial Type
type Partial<T> = { [P in keyof T]?: T[P]; };...
const fetchUser = async (id: string): Promise<User> => { const res = await fetch(`/api/users/${id}`); return res.json(); };...
Event Handler
type EventHandler<T = Event> = (event: T) => void;...
Repository Interface
interface Repository<T> { findById(id: string): Promise<T>; save(entity: T): Promise<T>; }...
Tuple Type
const tuple: [string, number, boolean] = ["BoomType", 100, true];...
NonNullable
type NonNullable<T> = T extends null | undefined ? never : T;...
Type Assertion
function assertDefined<T>(val: T | undefined): asserts val is T { if (!val) throw new Error("Value is undefined"); }...
Map Collection
const map = new Map<string, number>(); map.set("wpm", 100);...
Deep Readonly
type DeepReadonly<T> = { readonly [K in keyof T]: T[K] extends object ? DeepReadonly<T[K]> : T[K]; };...
Plugin Interface
interface Plugin { name: string; version: string; init(): void; destroy(): void; }...
Unwrap Promise
type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;...
Builder Pattern
type Builder<T> = { [K in keyof T]-?: (val: T[K]) => Builder<T>; } & { build(): T; };...
Create Store
function createStore<S, A>(reducer: (state: S, action: A) => S, initial: S) { let state = initial;...
Middleware Type
type Middleware<S> = (store: S) => (next: Function) => (action: unknown) => unknown;...
IsNever Type
type IsNever<T> = [T] extends [never] ? true : false;...
Event Emitter Factory
const EventEmitter = <T extends Record<string, unknown>>() => { const listeners = {} as { [K in keyof T]?: Array<(data: T[K]) => void> };...
Flatten Type
type Flatten<T> = T extends Array<infer U> ? Flatten<U> : T;...
Memoized Function
function memoize<Args extends unknown[], R>(fn: (...args: Args) => R): (...args: Args) => R { const cache = new Map<string, R>();...
Router Return Type
type Router<T extends Record<string, () => unknown>> = { [K in keyof T]: ReturnType<T[K]> };...
Create Slice
const createSlice = <S, R extends Record<string, (state: S, payload: unknown) => S>>( name: string, initial: S, reducers: R...
Satisfies Type
type Satisfies<T, U extends T> = U;...
Split Type
type Split<S extends string, D extends string> = S extends `${infer Head}${D}${infer Tail}` ? [Head, ...Split<Tail, D>] : [S];...
Typed Pipe
const pipe = <T>(...fns: Array<(arg: T) => T>) => (initial: T): T => fns.reduce((acc, fn) => fn(acc), initial);...
Awaited Type
type Awaited<T> = T extends PromiseLike<infer U> ? Awaited<U> : T;...
Brand Type
type Brand<T, B extends string> = T & { readonly _brand: B };...
Select All
SELECT * FROM users;...
Select Columns
SELECT name, email FROM users WHERE is_premium = true;...
Insert Row
INSERT INTO users (name, email) VALUES ('Ali', 'ali@example.com');...
Update Row
UPDATE users SET wpm = 100 WHERE id = 1;...
Delete Row
DELETE FROM users WHERE is_guest = 1;...
Count Rows
SELECT COUNT(*) FROM users;...
Order By
SELECT * FROM users ORDER BY wpm DESC;...
Limit Results
SELECT * FROM test_results LIMIT 10;...
Max Value
SELECT MAX(wpm) FROM test_results;...
Min Value
SELECT MIN(accuracy) FROM test_results WHERE user_id = 1;...
Average Value
SELECT AVG(wpm) FROM test_results;...
Like Pattern
SELECT * FROM users WHERE name LIKE '%Ali%';...
Distinct Values
SELECT DISTINCT level FROM lessons;...
Date Filter
SELECT * FROM users WHERE created_at > '2024-01-01';...
Combined Filter
SELECT name, wpm FROM users WHERE wpm > 80 ORDER BY wpm DESC;...
Left Join
SELECT u.name, COUNT(t.id) AS total_tests FROM users u LEFT JOIN test_results t ON u.id = t.user_id GROUP BY u.id;...
Window Rank
SELECT name, wpm, RANK() OVER (ORDER BY wpm DESC) AS rank FROM users;...
CTE Query
WITH top_users AS (SELECT * FROM users WHERE wpm > 100) SELECT * FROM top_users ORDER BY wpm DESC;...
Group By Having
SELECT user_id, AVG(wpm) AS avg_wpm, MAX(wpm) AS best_wpm FROM test_results GROUP BY user_id HAVING AVG(wpm) > 60;...
Case Update
UPDATE users SET level = CASE WHEN wpm < 40 THEN 'beginner' WHEN wpm < 80 THEN 'intermediate' ELSE 'advanced' END;...
Subquery Filter
SELECT * FROM users WHERE id IN (SELECT user_id FROM test_results WHERE wpm > 100);...
Create Index
CREATE INDEX idx_users_wpm ON users(wpm DESC);...
Date Truncate
SELECT DATE_TRUNC('day', created_at) AS day, COUNT(*) FROM test_results GROUP BY day ORDER BY day;...
Inner Join
SELECT u.name, t.wpm, t.accuracy FROM users u INNER JOIN test_results t ON u.id = t.user_id WHERE t.created_at > NOW() - INTERVAL '7 days';...
Insert Returning
INSERT INTO test_results (user_id, wpm, accuracy, duration) VALUES ($1, $2, $3, $4) RETURNING *;...
Case Insensitive
SELECT * FROM users WHERE LOWER(email) = LOWER($1);...
Streak Update
UPDATE users SET current_streak = current_streak + 1, last_test_date = NOW() WHERE id = $1;...
Group Stats
SELECT level, COUNT(*) AS count, AVG(wpm) AS avg_wpm FROM users GROUP BY level ORDER BY avg_wpm DESC;...
Cleanup Old
DELETE FROM webhook_events WHERE processed = true AND created_at < NOW() - INTERVAL '30 days';...
NTILE Quartile
SELECT id, name, wpm, NTILE(4) OVER (ORDER BY wpm) AS quartile FROM users;...
Create Table
CREATE TABLE users (id UUID PRIMARY KEY DEFAULT gen_random_uuid(), email TEXT UNIQUE NOT NULL, created_at TIMESTAMPTZ DEFAULT NOW());...
Trigger Function
CREATE OR REPLACE FUNCTION update_streak() RETURNS TRIGGER AS $$ BEGIN...
Lag Window
SELECT user_id, wpm, LAG(wpm) OVER (PARTITION BY user_id ORDER BY created_at) AS prev_wpm, wpm - LAG(wpm) OVER (PARTITION BY user_id ORDER BY created_at) AS improvement FROM test_results;...
Materialized View
CREATE MATERIALIZED VIEW leaderboard AS SELECT u.id, u.name, MAX(t.wpm) AS best_wpm, COUNT(t.id) AS total_tests...
Recursive CTE
WITH RECURSIVE lesson_tree AS ( SELECT id, title, parent_id, 1 AS depth FROM lessons WHERE parent_id IS NULL...
Percent Rank
SELECT user_id, wpm, PERCENT_RANK() OVER (ORDER BY wpm) * 100 AS percentile FROM test_results;...
Concurrent Index
CREATE INDEX CONCURRENTLY idx_test_results_user_created ON test_results(user_id, created_at DESC) WHERE wpm > 0;...
Query Stats
SELECT pg_stat_statements.query, calls, mean_exec_time FROM pg_stat_statements ORDER BY mean_exec_time DESC LIMIT 10;...
JSONB Column
ALTER TABLE users ADD COLUMN IF NOT EXISTS metadata JSONB DEFAULT '{}'; UPDATE users SET metadata = metadata || '{"source":"web"}';...
Rolling Average
SELECT id, name, wpm, SUM(wpm) OVER (ORDER BY created_at ROWS BETWEEN 6 PRECEDING AND CURRENT ROW) / 7 AS rolling_avg FROM test_results;...
Create View
CREATE OR REPLACE VIEW user_stats AS SELECT u.id, u.name, u.is_premium, COUNT(t.*) AS tests, AVG(t.wpm)::int AS avg_wpm, MAX(t.wpm) AS best_wpm, u.current_streak...
Explain Analyze
EXPLAIN ANALYZE SELECT * FROM test_results WHERE user_id = $1 AND created_at > NOW() - INTERVAL '30 days' ORDER BY wpm DESC;...
Generate Series
SELECT generate_series(NOW() - INTERVAL '30 days', NOW(), INTERVAL '1 day')::date AS day LEFT JOIN (SELECT created_at::date, COUNT(*) FROM test_results GROUP BY 1) t ON t.date = day;...
Row Level Security
CREATE POLICY user_isolation ON test_results FOR ALL USING (user_id = current_setting('app.user_id')::uuid);...
JSON Aggregation
SELECT jsonb_agg(jsonb_build_object('date', created_at::date, 'wpm', avg(wpm))) FROM test_results WHERE user_id = $1 GROUP BY created_at::date ORDER BY created_at::date;...