/* recap.jsx — "The Shelf": post-Chapter-10 recap of every component. What each part is, why it exists, where you've seen it in real life, and simple ways they team up. Adult/Kids branching throughout. rc* prefixes. */ const { useEffect: rcUseEffect } = React; /* tiny schematic glyphs, drawn in a 64×40 box, stroke = currentColor */ function RcGlyph({ kind }) { const s = { fill: "none", stroke: "currentColor", strokeWidth: 2.4, strokeLinecap: "round", strokeLinejoin: "round" }; const inner = { battery: , switch: , resistor: , led: , diode: , capacitor: , transistor: , inductor: , timer: 555, }[kind]; return {inner}; } function RcApp() { const [t, setTweak] = useTweaks({ theme: "paper", audience: "adult" }); useCrossChapterPersistence(t, setTweak); rcUseEffect(() => { document.body.setAttribute("data-theme", t.theme); }, [t.theme]); const kids = t.audience === "kids"; const rcEndRef = useInViewCallback(() => hteMarkDone("recap")); const parts = [ { g: "battery", name: "Battery", ch: "Ch 1", water: kids ? "the pump" : "the pump / pressure source", does: kids ? "Pushes the charges around the loop." : "Provides the voltage — the push that drives current around the loop.", why: kids ? "Nothing moves without a push!" : "Every circuit needs an energy source; everything else just shapes what that energy does.", real: kids ? "Remote controls, toys, your tablet." : "AA cells, phone Li-ion packs, the 12 V block in a car." }, { g: "switch", name: "Switch", ch: "Ch 5", water: kids ? "the gate" : "the gate valve", does: kids ? "Breaks the loop or joins it. On, off." : "Opens or closes the path — the only part whose whole job is yes/no.", why: kids ? "So YOU decide when things run." : "Control. It's also the seed of logic: every computer is switches deciding for other switches.", real: kids ? "Light switches, game controller buttons." : "Wall switches, keyboard keys, and (as transistors) every logic gate." }, { g: "resistor", name: "Resistor", ch: "Ch 1–3", water: kids ? "the pinch" : "the pinch in the pipe", does: kids ? "Slows the flow down to a safe amount." : "Limits current: V = I·R decides exactly how much flows.", why: kids ? "Too much flow breaks things — the pinch protects them." : "Without it, parts see unlimited current and burn. It also splits voltages (dividers) and sets timing with C.", real: kids ? "Inside almost everything electronic." : "Current-limiting on every LED, volume knobs (potentiometers), pull-ups on every button." }, { g: "led", name: "LED", ch: "Ch 2, 7", water: kids ? "the waterwheel that glows" : "the glowing one-way wheel", does: kids ? "Turns flowing charge into light." : "Emits light when current flows forward through it; blocks reverse.", why: kids ? "It's how circuits talk to your eyes!" : "Cheap, cool-running light and the universal 'is it working?' indicator.", real: kids ? "Screens, traffic lights, blinky shoes." : "Displays, indicator lights, bulbs — nearly all new lighting is LEDs." }, { g: "diode", name: "Diode", ch: "Ch 7", water: kids ? "the one-way valve" : "the one-way valve", does: kids ? "Lets flow go one way only." : "Conducts one direction, blocks the other (~0.7 V toll).", why: kids ? "Some machines need flow to never go backwards." : "Turns AC into DC (rectifiers), protects against reversed batteries, and tames inductor spikes (flyback).", real: kids ? "Phone chargers, solar panels." : "Every wall charger's rectifier, reverse-polarity protection, flyback diodes on relays." }, { g: "capacitor", name: "Capacitor", ch: "Ch 4", water: kids ? "the bucket" : "the bucket on a spigot", does: kids ? "Stores charge, then gives it back. Hates sudden level changes." : "Stores charge; resists changes in voltage. Fills and drains on an RC curve.", why: kids ? "Keeps things steady, and makes timers tick." : "Smooths bumpy supplies, holds parts steady through dips, and — with R — keeps time.", real: kids ? "Camera flashes, things that fade slowly off." : "Camera flashes, supply smoothing after every rectifier, RC timing everywhere." }, { g: "transistor", name: "Transistor", ch: "Ch 6", water: kids ? "the helper valve" : "the pressure-operated valve", does: kids ? "A tiny push controls a BIG flow." : "A small base current gates a large collector current — a switch driven by electricity itself.", why: kids ? "It lets circuits control themselves — that's how computers think!" : "Amplification and self-control. Chain them and you get logic, memory, computers — it's the century's most important invention.", real: kids ? "Billions inside every phone." : "~10¹⁰ per phone SoC; also every amplifier and motor driver." }, { g: "inductor", name: "Inductor", ch: "Ch 9", water: kids ? "the heavy wheel" : "the heavy flywheel", does: kids ? "Hates the flow changing. Slow to start, refuses to stop." : "Resists changes in current; stores energy in a magnetic field.", why: kids ? "Its stubbornness makes sparks — and keeps flow smooth." : "Smooths current (chokes), makes sparks on purpose (ignition), and steps voltages up/down (converters). The capacitor's dual.", real: kids ? "Car engines, chargers, radios." : "Ignition coils, every switching power supply, radio tuning circuits." }, { g: "timer", name: "555 timer", ch: "Ch 10", water: kids ? "the tipping bucket" : "the see-saw bucket-watcher", does: kids ? "Watches a bucket fill and empty — tick, tock, blink." : "Watches an RC node between two thresholds and flips an output: an oscillator.", why: kids ? "It's all the parts working as a team — a heartbeat for machines." : "The first 'component made of components' you met: R, C, switches and thresholds composed into a rhythm.", real: kids ? "Blinking lights, beeping toys." : "Blinkers, tone generators, PWM dimmers — billions shipped since 1972." }, ]; const teams = [ { tag: kids ? "the bodyguard" : "R + LED", title: kids ? "Pinch + glow" : "Resistor + LED", body: kids ? "Every glowing wheel needs a pinch in front of it, or too much flow burns it out. Simplest team there is — you built it in Level 2!" : "The first circuit you ever built: the resistor sets a safe current (V=I·R), the LED spends it as light. Neither is useful here without the other." }, { tag: kids ? "the timer" : "R + C", title: kids ? "Pinch + bucket = a clock" : "Resistor + capacitor", body: kids ? "A pinch decides how fast the bucket fills. Slow pinch, slow fill — and that's a timer! It's why lights can fade out slowly." : "The RC time constant τ = R·C. Debounced buttons, fading lights, intermittent wipers, and the tick inside the 555 — all just a pinch deciding how fast a bucket fills." }, { tag: kids ? "spark & tamer" : "L + diode", title: kids ? "Heavy wheel + one-way valve" : "Inductor + diode", body: kids ? "The stubborn wheel makes a huge push when you stop it fast. In a car, that push IS the spark. Everywhere else, the one-way valve gives it a safe little loop to calm down in." : "Cut current to a coil and it spikes — harnessed, that's ignition; unwanted, it kills transistors. The flyback diode gives the collapse a safe path. Chapter 7 protecting chapter 9." }, { tag: kids ? "the night-light" : "divider + transistor", title: kids ? "Sensor + helper valve" : "Divider + transistor", body: kids ? "A light-sensing pinch changes a small push, and the helper valve turns that into a big flow. Dark outside → light turns on. No person needed!" : "A photoresistor in a divider makes a voltage that follows the light; the transistor amplifies that whisper into enough current to drive an LED. Sense → decide → act." }, { tag: kids ? "the heartbeat" : "R + C + 555", title: kids ? "Everything, blinking" : "The whole shelf, oscillating", body: kids ? "Pinch fills bucket, chip watches bucket, chip flips a switch, bucket empties, repeat forever. Blink. Blink. Blink. Every part you know, taking turns." : "The 555 astable: R charges C, thresholds flip the output, C discharges, repeat. Resistors, a capacitor, transistors, and thresholds — every chapter, one rhythm." }, ]; return ( <> setTweak("audience", v)} />
← Ch 10 ·Level 1 recap

The shelf.
Every part, and why.

{kids ? <>You've met the whole family now! Here they all are on one shelf — what each one does, why it exists, and how they team up to make real things work. : <>Ten chapters, nine parts. Before the exam, one pass across the whole shelf: what each component is for, and the simple ways they combine into everything electronic.}

{kids ? "the whole family" : "the components"}
{parts.map((c) => (
{c.ch}

{c.name}

= {c.water}

{c.does}

{kids ? "Why it exists: " : "Why it exists: "}{c.why}

{kids ? "Spot it: " : "In the wild: "}{c.real}

))}
{kids ? "better together" : "they never work alone"}

{kids ? <>The parts are a team. : <>Components are letters.
Circuits are words.}

{kids ? <>One part alone can't do much. Two or three together — that's where the magic starts. Here are the classic teams you already know: : <>Every gadget reduces to a handful of two- and three-part idioms, repeated. You've built all five of these:}

{teams.map((tm) => (
{tm.tag}

{tm.title}

{tm.body}

))}

{kids ? <>Shelf memorized? Show what you know — or go build something real. : <>That's the whole vocabulary. Prove it on the exam, or put it to work on the breadboard.}

{kids ? "Take the big quiz →" : "Capstone exam →"} What now? →
); } ReactDOM.createRoot(document.getElementById("root")).render();