Visualize — watch it run

Reading about a sliding window teaches you the words. Watching one move teaches you the idea. Every visualization here steps through real execution — you control the pace.

299 visualizations5 familiesVerified against real execution

Start here

Interactive labYOU CAN PLAY WITH THIS

Binary Search Lab — hunt for YOUR number

Type six numbers and a target — then watch half the possibilities die with every single comparison.

Interactive labYOU CAN PLAY WITH THIS

Coin Change Lab — race the table against greedy

Pick your own coins and amount, watch the DP ladder fill — and catch grab-the-biggest paying more than it had to.

Interactive labYOU CAN PLAY WITH THIS

Sliding Window Lab — run it on YOUR numbers

Type any four numbers and a target, then watch the real algorithm hunt for the shortest window through them.

Sliding Window — longest stretch with no repeats

Watch the window stretch to the right, hit a repeat, shrink from the left, and carry on.

Pattern Cinema

Sliding Window (variable size)

Two markers that only ever move forward.

Longest stretch with no repeats Smallest run reaching a target 🧪 Run it on YOUR numbers

Browse all

The Memory Machine Takes a Quiz

Seven flats studied, three hidden — watch a memorizer ace train and fail test.

Eight Dots Vote on r

Watch covariance votes pile up and become Pearson's r = 0.996.

The Ball That Rolls Downhill

Watch a ball hop down f(x) = (x-3)² + 2, steered only by the slope under it.

The Line That Learns

Eight dots tug on a line — watch gradient descent tilt it, then lift it.

The Next-Token Loop

A tiny word-counting model writes a sentence one guessed word at a time — exactly how big chat AIs write, just smaller.

The Rule That Finds Itself

Nine candidate cut-offs audition on eight students — the least-wrong one becomes the model.

Asymptotic Analysis — Comparing Growth

Big-O is the worst case; here is the family of curves it talks about.

Backtracking — Watch the Tree Get Pruned

Pick weights from {5, 4, 3} that total exactly 7 kg — and watch over-heavy branches die before they grow.

Divide and Conquer — Levels of Work

Merge sort with a level counter: every level of the tree touches every box once.

Greedy — Book the Event That Ends First

One rule, one pass: take it if it fits, never look back.

Recurrences — Where Each One Lands

Same template T(n) = aT(n/b) + f(n); wildly different curves depending on a vs b^d.

1D Arrays — A Row of Boxes

A pointer i walks the boxes left to right while sum collects every value.

2D Arrays — A Table of Numbers

Watch a nested loop visit every cell, row by row.

Binary Tree — Build It, Then Walk It Inorder

malloc five nodes, wire them with pointers, and visit them left, me, right.

Bitwise Operations in C

Peek inside 12 (1100) and 10 (1010) as &, |, ^, << and >> work on their bits.

argc & argv — Words After the Name

Run with no extra words: argc is still 1, because the program's own name counts.

Dynamic Memory — malloc & free

Borrow 3 boxes from the heap at run time, fill them, and give them back.

File Handling — Open, Use, Close

Write a line into notes.txt, close it, open it again, and read the line back.

A Pointer That Points at a Function

op aims at add, calls it, then re-aims at mul — and the same op(3, 4) gives a different answer.

Defining & Calling a Function

Watch control jump from main into add(), copy 3 and 4 into a and b, and come back carrying 7.

Making Decisions with if-else & switch

Watch the false checks get skipped, the true branch win, and break stop the switch fall-through.

Your First C Program

Watch C start at main, say hello, and add a few fruits together, one line at a time.

Linked List — Build the Chain Yourself

malloc each node, wire the next pointers by hand, then walk 10 → 20 → 30.

Adding Numbers with a for Loop

Watch i climb from 1 to 5 and the total box grow as we add each number.

Memory Management — Stack vs Heap

The stack cleans itself; the heap is on you — free it, then NULL the pointer.

Star Patterns — Drawing with Loops

Watch a nested loop light up the board, one star at a time.

Watch +, -, *, /, % and > work on 10 and 3 — and see why 10 / 3 is just 3.

Pointer Arithmetic — Hopping Box by Box

p++ slides the pointer one whole box forward; *(p+2) peeks two boxes ahead.

arr[i] Is *(arr + i) in Disguise

Watch both spellings open the same boxes of [3, 7, 9] and print identical values.

Pointers — Address & Dereference

p remembers WHERE x lives — watch *p = 99 change x without touching its name.

swap() That Actually Works — Call by Reference

main hands swap the addresses &x and &y, so swap reaches back and really trades 3 and 8.

#define: Find and Replace Before Compiling

Watch PI and SQUARE(x) get swapped for real text before the program ever runs.

printf & scanf — Talking with the User

Watch scanf pick up each line we type and printf show it back on screen.

Queue in C — An Array + Front & Rear

Enqueue 5, 8, 9 at the rear, then dequeue twice from the front.

Recursion — The Call Stack

Watch factorial(4) pile up stack frames, then unwind them into 24.

A Struct That Points at Its Own Kind

Hook node a to node b with a.next = &b, then walk the chain with a pointer — the seed of every linked list.

Bubble Sort — The Three-Line C Swap

Neighbours get compared; the bigger one bubbles right via temp.

Stack in C — An Array + a Top Counter

Push 10, 20, 30 onto the pile, peek at the top, then pop twice.

static vs Normal: The Box That Remembers

Call the same function 3 times — the static box counts 1, 2, 3 while the normal box resets every time.

The <string.h> Toolbox

Copy "sun", glue on "shine", measure it, then compare cat vs dog.

C Strings — Letters in Boxes (plus a Secret One)

A string is a char array with a hidden \0 marking the end.

A Struct: One Box with Compartments

Build a Student box, fill s.name and s.marks with the dot operator, then change just the marks.

Type Casting: Saving the Lost Fraction

See 7/2 lose its .5, a (float) cast rescue it, and (int)9.8 get chopped to 9.

Give a long type a short nickname, then use it like a real word.

Unions & Enums in C

Names for numbers, and one memory box wearing two labels.

C Variables & Data Types

Watch three typed boxes get filled, then printed with %d, %.1f and %c.

2-SAT — Satisfiability with SCCs

Turn each "A or B" rule into if-then arrows and check for contradictions.

Selection Sort — Pick the Smallest

Each pass finds the smallest leftover number and swaps it into place.

Two Sum — The #1 Array Interview Question

One pass, a hash map remembers each number so its partner finds it instantly.

Arrays — Boxes in a Row

See how an array stores values and how we pick one out by its index.

Kadane's Algorithm — Biggest Block Sum

Slide along once, keeping a running sum and the best sum seen so far.

Prefix Sums — Running Totals

Replace each value with the total of everything up to it.

Linear Search — Checking Each Box

Watch the pointer scan the array until it finds the number we want.

Sliding Window — A Moving Frame

A window of 3 boxes slides across, keeping its sum without re-adding.

Bubble Sort — Swapping Neighbours

Compare two boxes at a time; the biggest numbers bubble to the end.

Array Traversal — Visiting Every Box

A pointer walks left to right, adding each value to a running total.

Two Pointers — Reversing an Array

Two pointers start at the ends and swap their way to the middle.

Articulation Points & Bridges

One DFS finds every single point of failure — using each node's disc and low.

Backtracking — Choose, Explore, Un-choose

Watch the choice path grow and shrink as we find every subset of [1, 2].

Bellman-Ford — Cheapest Routes with Negative Roads

Re-check every road V-1 times; even a -1 road gets counted right.

Breadth-First Search (BFS)

Explore a graph level by level — nearest nodes first — using a queue.

Maximum Bipartite Matching (Kuhn’s)

Pair workers with jobs so nobody shares — re-routing to fit in one more pair.

Binary Search Tree — Finding a Number

Walk down the tree, going left for smaller and right for bigger, until you find 6.

Counting Connected Components

A graph can be in separate pieces — walk from each unseen node and count the islands.

Depth-First Search (DFS)

Dive deep down one path, then backtrack — using recursion and a visited set.

Doubly & Circular Linked Lists

Walk the chain forward with next, backward with prev — then bend it into a ring.

1-D DP — Tabulation

Climbing stairs: the dp row fills left to right, each cell from the two before it

Grid DP — 2-D Tables

Unique paths on a 3×4 grid: the table fills row by row, each cell = top + left

DP — Memoization

fib(6) with an answer notebook: every subproblem solved exactly once

0/1 Knapsack — Take or Skip

Items (2,3)(3,4)(4,5), capacity 5: each cell picks the better of skip vs take

Longest Increasing Subsequence

Each dp cell looks back at smaller earlier values and extends the best run

String DP — LCS

LCS of "ACE" and "ABCDE": match extends the diagonal, mismatch takes the best neighbour

Eulerian Path & Circuit

Walk every edge exactly once — draw the whole shape without lifting your pen.

Fenwick Tree (BIT) — Fast Prefix Sums

Each slot covers a power-of-two block; the i & -i trick jumps to just the slots you need.

Graphs — Nodes & Edges

A web of nodes joined by edges; each node has a list of neighbours.

Graph Representations — List vs Matrix

Store one graph two ways: neighbour lists and a grid of 0/1 — and watch them agree.

Hamiltonian Path (Backtracking)

Visit every node exactly once — try a path, and back up when you get stuck.

What is DSA? — Finding the Biggest Number

A row of boxes (data structure) plus a step-by-step scan (algorithm) finds the max.

Reversing a Linked List — The Three-Pointer Walk

Walk once, flipping each next arrow to point backward with prev / curr / nxt.

Cycle Detection — Floyd's Tortoise & Hare

A slow and a fast pointer race around the list — if they meet, there is a loop.

Sorting a Linked List — Bubble Sort

Compare neighbour nodes and swap the out-of-order ones until the chain is sorted.

Linked Lists — A Chain of Nodes

Each node points to the next; a pointer walks from head to null.

Kruskal's Algorithm — Cheapest Network

Sort roads by cost; take one only if it joins two different groups.

Max Flow — Filling the Pipes (Edmonds-Karp)

Find a path with spare room, push water through it, repeat until none is left.

Min-Heap with heapq — Smallest on Top

Push numbers in any order; the heap always keeps the smallest at the top.

Deque — Add and Remove at Both Ends

append/pop at the rear, appendleft/popleft at the front.

Queues — First In, First Out

Join at the rear, leave from the front — like a line at a shop.

Recursion — The Call Stack

Watch factorial(4) pile up calls, then unwind them into 24.

Red-Black Tree — Balancing with Colours

Insert 10, 20, 30 — two reds collide, then a rotation and recolor set it right.

Segment Tree — Range Sums in a Few Steps

Each node remembers the sum of a range, so a big query is just a few precomputed pieces.

Dijkstra's Algorithm — Cheapest Routes

Always settle the nearest unsettled node; update prices through it.

Singly Linked Lists — Adding a Node

Walk a pointer to the last node, then attach a new one.

Space Complexity — How Much Memory?

The same Big-O idea, but for extra memory instead of time.

Balanced Brackets with a Stack

Push every "(" on the pile and pop one off for each ")".

Stacks — Last In, First Out

Push items onto the top, then pop them off the top.

Next Greater Element with a Monotonic Stack

Numbers wait on a pile until a bigger one arrives — then they pop with their answer.

Reverse a String In Place

Two markers swap letters from both ends until they meet in the middle.

Naive String Matching — Sliding the Pattern

Slide a little pattern across the text and compare letters until it fits.

Palindromes — Two-Pointer Check

One marker at each end walks inward, comparing letters as it goes.

KMP Search — Jump, Never Backtrack

Watch KMP find "ABA" inside "ABABABA" without ever re-checking a letter.

Rabin-Karp — Slide a Hash, Then Verify

Watch each window of "ABAB" become a number we compare before checking letters.

Reading Regex Patterns

Learn what \d+ and [a-z]+ really say — pull numbers from a log line, then shape-check a word.

Strings — A Row of Letters

See how a string lines up its characters and how we pick or loop over them.

Kosaraju's Algorithm — Strongly Connected Components

Two deep walks and a flip of every arrow reveal the knots in a directed graph.

Big-O — How Fast Does Work Grow?

Step through the 7 must-know growth curves, from flat to explosive.

Topological Sort — Kahn's Algorithm

Line up tasks so every "must come before" arrow is respected.

Travelling Salesman — Try Every Route

With few cities, brute force every tour and keep the cheapest.

AVL Tree — Rebalancing with a Rotation

Insert 10, 20, 30 — the tree tips over, then one left rotation stands it back up.

Inorder Tree Traversal — Left, Node, Right

Walk a binary tree in the order: left side, the node, then right side.

Trees — Roots, Children & Leaves

Meet the parts of a binary tree, from the root down to the leaves.

Trie — A Tree of Letters

Insert cat, car and dog into a prefix tree, then search for car (found) and cow (not found).

Trie Autocomplete — Words That Share a Start

Insert cat, car, cart and dog, then list every word beginning with 'ca'.

Branches are movable pointers

Watch how creating, switching, and committing move the branch and HEAD labels.

Ignoring files with .gitignore

Ignored files vanish from status — but only if they were never tracked.

init → add → commit

Follow a file from your folder, through staging, into Git history.

Installing & Setting Up Git

Install Git once, then tell it your name and email so every commit is signed by you.

What Is Version Control?

A save-game system for your code — every commit is a snapshot you can return to.

Merging branches and resolving conflicts

Fast-forward when history is a straight line, a three-way merge commit when it has diverged.

Rebase replays commits onto a new base

Watch feature's commits get recreated on top of main for a clean, linear history.

Remotes: clone, fetch, pull, push

Watch your local main and origin/main drift ahead / behind, then re-sync.

git bisect — finding the commit that broke it, by halving

Watch HEAD jump to the middle of history, then to the middle of what is left, until one commit is left standing.

Detached HEAD — how work gets stranded, and how to save it

Watch a commit land on no branch at all, then get rescued with a branch name.

--force vs --force-with-lease — the flag that saves a teammate's work

Watch a teammate's commit arrive, then watch --force-with-lease refuse to destroy it.

"I deleted the branch with my work on it"

Watch a branch disappear, its commit go unreachable, and both come back with one command.

"I lost my work with reset --hard" — getting it back

Watch a commit fall off the branch, sit there unreachable, and get rescued by reflog.

reset vs revert — the same undo, two very different histories

Watch reset erase a commit from one branch while revert cancels it out on another.

Squashing messy commits into one clean commit

Watch three "wip" commits collapse into a single commit worth reviewing.

git worktree — two folders, one repository

Watch a second working directory appear so an urgent fix can happen without stashing anything.

"I committed to main by mistake" — moving it to a branch

Watch a branch pointer be planted on the commit before main is rolled back off it.

Stashing: shelve work, switch freely

Watch the stash stack grow then shrink as you park uncommitted work and move between branches.

status → diff → log: staying oriented

See how the three read-only commands map onto working / staging / repository.

Undoing changes safely

restore discards a change; revert adds a commit that reverses another.

The Pull-Request workflow

The full professional loop: branch, commit, push, open a PR, review, squash-merge, clean up.

Java 8 Features Working Together

A lambda prints each number, a stream sums the odds, and an Optional finds the biggest.

Abstraction — a Promise Filled In Later

Watch an abstract Shape promise an area, and a real Circle keep that promise.

Java Arrays — Adding Up the Boxes

A pointer walks across an int array, adding each value to a running total.

Growing & Shrinking an ArrayList

Watch the row of boxes change after each add, get, size, and remove.

Storing Things by Name with a HashMap

Watch the name-to-age lockers fill up, get updated, and then be looked up.

Stack vs Queue — LIFO vs FIFO

Push the same three words into a stack and a queue, then watch them come out in opposite orders.

Sorting With a Comparator

Watch a comparator rule put a list of scores in order from highest to lowest.

Constructors — Building a Student

Watch the constructor run when new Student(...) is called, filling the name and marks fields.

Choosing a Grade with if-else

Watch the if-else ladder test the score from the top and pick the grade.

The Singleton Pattern

Watch two requests for the printer hand back the exact same object — one shared instance.

Encapsulation: Protecting Private Data

Watch a private balance change only through deposit, withdraw, and getBalance.

Catching Errors with try / catch / finally

Watch control jump from the failing line to catch, while finally runs no matter what.

Writing a File, Then Reading It Back

Watch notes.txt get created and filled, then flow back into a list when Java reads it.

Generics — One Box, Any Type

Watch one Box<T> hold a number, then the SAME code hold a word.

Inheritance, @Override & super

Watch which speak() runs — the parent for Animal, the override for Dog reaching up with super.

Your First Java Program

Watch Java start up, say hello, and add a few fruits together, one line at a time.

Java Lambda Expressions

Watch two tiny arrow-functions get built once and then called to add numbers and test for even.

Adding Numbers with a for Loop

Watch i climb from 1 to 5 and the total box grow as we add each number.

Use Java's built-in Math helpers and roll a dice with a fixed seed so the answer is the same every time.

Picking the Right add() — Method Overloading

Two methods named add. Watch Java choose add(int, int) for whole numbers and add(double, double, double) for decimals.

Defining & Calling a Method

Watch control jump into square(), copy the value into n, return an answer, and come back.

Multithreading: Many Helpers at Once

Build 4 threads, start() them together, then join() to wait — 4000 adds, every time.

Classes & Objects — Building a Dog

Watch a Dog object get born from the class, fill its boxes, then bark.

Java Operators & Expressions

Watch +, /, %, > and && turn two numbers into maths and yes/no answers.

Public vs Private: Who Can Touch What

A public name anyone can read, and a private marks you can only reach through a public helper.

Polymorphism: One Call, Many Forms

Watch one line — a.sound() — run the Dog's code, then the Cat's code.

Recursion: A Method That Calls Itself

Watch factorial(4) dive down to 0, then climb back up multiplying the answer together.

Reading Input with Scanner

See how a Java program reads the number and word we type in, one at a time, and prints them back.

Streams: Filter, Map, Collect

Watch numbers ride a conveyor belt that keeps the evens, squares them, and adds them up.

Handy Tools for Text

Watch six String methods work on one fixed line of text, each making a new answer.

Working With Strings

Watch a word get measured, snipped, and joined to make new text.

Synchronization: Take Turns, Lose Nothing

Four threads add to one box. "synchronized" makes them take turns — the total is always 4000.

Java Variables & Data Types

Watch five boxes get filled with different kinds of values, then printed one by one.

Wrapper Classes: Boxing & Unboxing

Watch plain numbers hop into object boxes and back, and see text turn into numbers.

Behavioral Patterns — Observer

A Channel notifies a list of Subscribers on upload — add a fan type without touching it

Creational Patterns — Factory Method

A checkout welded to `new UpiPayment()` becomes a factory that returns a Payment abstraction

Structural Patterns — Decorator

Coffee add-ons: wrap a Beverage in decorators instead of subclassing every combination

Design Library Management — LLD Walkthrough

Grow the design from Account/Member out to the Book-vs-BookItem split and the BookLending record

Design a Parking Lot — LLD Walkthrough

Grow the class design from Vehicle & ParkingSpot out to the Lot hierarchy and the Ticket

SOLID — Dependency Inversion

OrderService stops depending on a concrete EmailSender and depends on an abstraction instead

Interactive labYOU CAN PLAY WITH THIS

Binary Search Lab — hunt for YOUR number

Type six numbers and a target — then watch half the possibilities die with every single comparison.

Interactive labYOU CAN PLAY WITH THIS

Coin Change Lab — race the table against greedy

Pick your own coins and amount, watch the DP ladder fill — and catch grab-the-biggest paying more than it had to.

Interactive labYOU CAN PLAY WITH THIS

Sliding Window Lab — run it on YOUR numbers

Type any four numbers and a target, then watch the real algorithm hunt for the shortest window through them.

Sliding Window — longest stretch with no repeats

Watch the window stretch to the right, hit a repeat, shrink from the left, and carry on.

Sliding Window — smallest run that reaches the target

Watch the window grow until the total is big enough, then squeeze from the left to make it smaller.

Counting evens and odds — two tally boxes, one walk

Watch each number send its vote to one of two counters.

Highest mark in the class — one pass, one champion

Watch the pointer walk the list once while the best-so-far only ever climbs.

Linear search — checking every seat until you find the roll number

Watch the pointer stop dead the moment it finds a match.

Reverse a list in place — two pointers walking towards each other

Watch the ends swap and the pointers close in until they meet.

Second largest — the branch everyone forgets

Watch a number that is not the biggest still change the answer.

Total and average marks — the running total

Watch one box collect every mark before the division happens once at the end.

Electricity Bill — charging in slabs

Watch 240 units fall past two slabs and get billed at three different rates.

Even or Odd — checking every number in a list

Watch the program pick up one number at a time and decide which pile it belongs in.

Marks to Grade — why the order of checks matters

Watch three different marks each take a different path through the same ladder of conditions.

Largest of Three — keeping the best so far

Watch one box hold the winner and get replaced only when something bigger shows up.

Leap Year — the rule with a trap in it

Watch 2024 pass the test and 1900 fail it, one condition at a time.

Sum of Digits — peeling a number one digit at a time

Watch 472 shrink to 47, then 4, then nothing — while the total grows.

Factorial — multiplying up to 120

Watch one box collect 1 × 2 × 3 × 4 × 5 as the counter climbs.

Fibonacci — every number is the two before it

Watch the list grow, each new number made from the two already sitting behind it.

FizzBuzz — why the order of the checks decides the answer

Watch 15 fall through to the right branch only because it is tested first.

HCF by Euclid's method — the remainder trick

Watch 48 and 18 shrink to 6 and 0 in three quick rounds.

Multiplication Table — the same two lines, four times

Watch i climb from 1 to 4 and the answer change with it.

Is it prime? — and why break saves the rest of the work

Watch 21 get caught by its very first real divisor and the loop stop instantly.

Reverse a Number — building it backwards

Watch 351 come apart from the right while 153 is built up from the left.

Star triangle — the inner loop decides the shape

Watch the outer loop pick a row and the inner loop fill exactly as many stars as that row needs.

Countdown — recursion that returns nothing at all

Watch the pile build, print Liftoff, then unwind with nothing to hand back.

Recursion — a function that calls itself, and the pile it leaves behind

Watch three copies of the same function wait in a pile, each holding its own n.

Recursive Fibonacci — watch it compute the same thing twice

Two calls per frame instead of one, and fib(1) gets worked out from scratch on two separate occasions.

Power by recursion — and the base case that returns 1, not 0

Watch four frames stack up to compute 2³, and see why anything to the power 0 must be 1.

Palindrome check — comparing from both ends inward

Watch two pointers close in on the middle, comparing as they go.

Counting vowels — checking membership letter by letter

Watch each letter get held up against the list of vowels.

Idiomatic Python in Action

Watch a list comprehension, enumerate(), and f-strings turn raw scores into a clean ranking — idiomatic Python in action.

Counter & defaultdict in Action

Watch a Counter tally colours and a defaultdict group their positions as the loop runs.

Talking to a Database

Connect, create, insert, commit, then fetch rows back — shown with stdlib sqlite3, the same pattern used for MySQL and PostgreSQL.

Wrapping a Function with a Decorator

Watch how calling add actually runs the @log wrapper, which then calls the original.

Building & Updating a Dictionary

Watch d change as keys are added, a value is updated, and pairs are iterated.

Catching Errors with try / except / finally

Watch control jump from the failing line to except, while finally runs no matter what.

Writing a File, Then Reading It Back

Watch notes.txt fill up as it is written, then flow back into a string when read.

Adding Numbers with a Loop

Watch the total box grow as we add 1, 2, 3, 4, 5 one by one.

Positional, Default, *args & Keyword Arguments

Watch one greet() handle three call styles as name, greeting and titles bind.

Defining & Calling a Function

Watch control jump into square(), bind the parameter n, return a value, and come back.

Choosing a Branch with if / elif / else

Watch the conditions get tested top-down until one wins — the rest are skipped.

Reading Input & Showing Output

See how the program reads the lines we type in, one at a time, and prints answers back.

Your First Python Program

Watch print() run line-by-line as output grows and a variable fills.

Generators: Pause & Resume at yield

Watch the generator freeze at yield, hand back one value, then resume with n intact.

Round-Tripping a Dict Through JSON

Watch a Python dict become a JSON string and turn back into a dict.

Lambda with map() & filter()

Watch one lambda double every number while another keeps just the evens.

List Comprehension with a Filter

Watch the comprehension unroll into a loop: each x is tested, and only odd ones get squared.

Mutating a List In Place

Watch nums change after every append, insert, sort, and pop.

break & continue in a Loop

Watch continue skip evens and break exit the loop once n passes 7.

Importing Standard-Library Modules

Watch math, collections, and random each contribute to one deterministic run.

Threads Sharing a Counter — Safely

Four workers add to one shared box; a lock makes them take turns and join() waits for all, so the total is always 4000.

Star Patterns — Drawing with Loops

Watch a nested loop light up the board, one star at a time.

Classes & Objects — Building a Dog

Watch __init__ bind self.name when the object is born, then call its method.

Encapsulation: Protecting Private Data

Watch a private __balance change only through deposit, withdraw, and get_balance.

Inheritance, Overriding & super()

Watch which speak() runs — the inherited base for Animal, the override for Dog reaching up via super().

Operators on Two Numbers

Watch arithmetic, comparison, and logical operators each fire on a = 17 and b = 5.

Searching & Replacing with Regex

Watch re.search, re.findall and re.sub hunt down phone numbers in one sentence.

Common String Methods

Watch strip, lower, replace, split and find each return a fresh value.

String Indexing, Slicing & Length

Watch one string answer many questions while it never changes itself.

A tuple stays fixed while a set drops duplicates and combines with union and intersection.

Casting Between Types

Watch one value change type as int(), float(), and str() reshape it.

Variables & Data Types

Watch Python infer a different type for each value you assign.

Halving with a while Loop

Watch n shrink toward 1 and the loop exit the moment the condition fails.

Composition — boxes with holes, not family trees

One Card, three wildly different fillings, zero inheritance: children is a hole, and UIs are holes filled with holes.

Prop drilling vs Context — couriers vs the broadcast tower

Feel the user prop march through components that never use it, then watch one Provider make the chain disappear.

Controlled inputs — one memory, or a form that lies

Run the drift: the box says "hi", your state says "" — then wire the keystrokes through state and watch them agree forever.

Custom hooks — a recipe, never a shared pot

Build useToggle on the mini-useState shelf, call it twice, flip one — and prove the other never moves.

The fetch race — when the wrong results win

Two requests, one screen: watch the stale response overwrite the fresh one, then fix it with a one-integer ticket check.

The fetching state machine — and the fifth state everyone forgets

loading, error with a retry loop, success with data — and success with NOTHING, which deserves its own screen.

JSX under the hood — HTML’s clothes, JavaScript’s body

Watch one JSX tag get compiled, become a plain object, and only then touch the real screen.

key={index} — the bug that puts Ravi’s number under Priya’s name

Build React’s row-matching rule, run the famous list corruption for real, then fix it with one change.

React.lazy & Suspense — the 80kb nobody asked for

A download ledger proves it: 20kb first paint, and the chart chunk ships only when someone actually opens Reports.

React.memo vs === — equal content, different identity

Implement memo’s real comparison, then watch an inline object defeat it every single render.

useState, built from scratch — where state REALLY lives

Your component is a function that forgets everything. Build React’s memory shelf in 15 runnable lines and watch a click survive a re-render.

Props down, events up — the one-way street (and the 12-lesson recap)

The Button displays what it’s given and rings the bell it was handed — ownership never moves. Then the whole vertical, in one breath.

useRef — the box that changes without redrawing

Mutate it twice, re-render zero times, and prove with === that every render gets the very same box.

React Router — navigation without the white flash

Act 1: the old web tears the page down. Act 2: pushState, a path matcher, and a component swap — the server never hears about it.

One click, one re-render — how React changes the screen

Follow a single click from setState to the one DOM node that actually changes.

useEffect timing — built from scratch, painted first

Queue the effect, paint the screen, clean up the old world, then connect the new one — in 18 runnable lines.

useMemo — the answer shelf (a work counter proves it)

Three renders: the plain filter pays 3 times, the memoized one pays once — and honestly re-pays when a dependency truly changes.

Windowing — 10,000 rows, 12 DOM nodes

A node counter proves the whole technique: render only what the eye can see, and slide the window as the user scrolls.

API Design — REST vs GraphQL

One profile screen: three REST round trips vs one GraphQL query

Caching — the IPL Score Page

Cache-aside pattern: miss → fill → hit, TTL, and what breaks when the cache dies

CDN — Content Close to the User

Why a Chennai student should never fetch an image from Mumbai twice

CI/CD — the journey of one commit

Push → fresh build → the test wall → one sealed image → staging → a canary into production. Including the commit that never made it.

Consistency & Quorums — One Balance, Three Copies

W+R > N overlap, read repair, and the CAP choice when the cable is cut

Consistent hashing — the ring that barely moves

Add a server: 2 of 8 keys re-home. Kill one: 1 moves. The naive modulo would have reshuffled nearly everything.

The Consistent-Hashing Ring

Keys walk clockwise · a server joins (one arc moves) · a server dies (one arc slides) · vnodes + replication

Blue-Green vs Canary — two ways to ship without burning users

One flips ALL traffic and can flip it back in seconds; the other lets 5% of users breathe the new version first.

Design WhatsApp (Chat at Scale)

Persistent connections, a presence router, and durable offline delivery

Design Video Streaming (Netflix / Hotstar)

Offline encoding, edge caching, adaptive bitrate, and the IPL concurrency spike

Design a Payment Gateway (UPI / Razorpay)

Idempotency for retry-safety, record-before-act, async confirmation, and a reconciled ledger

Design Ride-Sharing (Uber / Ola)

A hexagon geo-index over a GPS firehose, and ETA-based dispatch

Design the Twitter Timeline

Fan-out-on-write for the many, fan-out-on-read for the celebrity few

Design a URL Shortener (bit.ly)

Collision-free short codes, and a cache-first redirect path built for 100:1 reads

DNS resolution — how a name finds a machine

Browser cache → resolver → root → TLD → authoritative — and on the second visit, silence: a cache hit.

Docker vs Virtual Machines — who shares the kernel?

Two towers on one machine: every VM drags a full guest OS; every container packs only its libraries. Watch both get built.

Instagram’s feed — the list that is built before you ask for it

Watch one post reach 300 followers, then watch the same design break on a film star and get fixed.

What Is System Design?

The journey of one food-app order — and the HLD vs LLD zoom

Interactive simYOU CAN PLAY WITH THIS

Railway Seat Allocation — a berth is an interval, not a seat

Watch one berth get sold to two passengers at once, then watch a cancellation ripple down the waiting list.

Kubernetes — the thermostat for containers

Declare "3 replicas". Watch a pod die at 2am and get replaced by arithmetic — then scale by editing a number.

Serving an LLM — one request that is really five hundred

Watch a prompt get processed once in parallel, then produce answers one token at a time until the GPU runs out of memory.

Load Balancing — The Traffic Police of the Internet

Round robin, least connections, health checks, failover — one afternoon in the life of three servers

Message Queues — Do It Later, Reliably

One Zomato order: instant confirmation, async workers, and a queue that survives a crash

Rate Limiting — The Token Bucket

Bursts allowed, floods rejected: watch tokens drain, hit 429, and refill

Scalability — One Server to One Crore Users

Vertical vs horizontal, the stateless lesson, and read replicas — evolved live

SQL vs NoSQL — One Read, Two Worlds

Normalized JOIN vs pre-stitched document: where the stitch lives, and what each world pays

The TLS handshake — the secret behind the padlock

Prove who you’re talking to, agree on a secret in public, then switch to fast ciphers — all before one byte of your data moves.

Inside the UPI rail — what happens in the two seconds after you scan

Follow ₹499 across four parties, then watch it get debited, fail to arrive, and come back by law.

Aggregates — COUNT, MAX, AVG

Watch a whole column get squeezed into one answer row.

INSERT, UPDATE, DELETE — Changing the Data

Watch three DML commands add, edit and remove rows, then read the finished table.

IN — Is This Value One of These?

Watch IN check each city against the list — and meet its cousins EXISTS, ANY and ALL.

GROUP BY & HAVING — Counting in Buckets

Watch rows fall into city buckets, get counted, and small buckets get filtered out.

Interview Classic — Second Highest Salary

The most-asked SQL interview query: the biggest salary below the biggest salary.

Your First SQL Query

A table is rows + columns — SELECT picks the columns, and every row comes back.

JOIN — Gluing Two Tables Together

Match rows across tables on a shared key; unmatched rows drop out (INNER).

Normalization — Store Each Fact Once

Split repeated course names into their own table, then JOIN to rebuild the full picture.

ORDER BY & LIMIT — Top-N Queries

Sort the rows highest-first, then keep just the top 2. (DISTINCT gets a cameo.)

SELECT & WHERE — Filtering Rows

Watch the query run clause-by-clause: filter rows, then pick columns, then sort.

Self-Join — A Table Meets Itself

Two nicknames (e and m) for ONE employees table pair each person with their manager.

UNION — Stacking Two Lists Into One

Two SELECT results piled top to bottom; duplicates kept only once.

Subqueries — A Query Inside a Query

The inner query runs first and becomes one number; the outer query uses it to filter rows.

Transactions — All or Nothing

Watch a money transfer inside BEGIN...COMMIT: debit one account, credit another, commit both together.

Views — A Saved Query That Acts Like a Table

Define a view of the high scorers, then look through it like a window onto the real table.

Window Functions — RANK() OVER

Rank every row without squashing any — and watch what a tie does to the numbers.

Browse the full coding syllabus