Exercise 1: What Changed and What Stayed the Same — Possible Solution
====================================================================

WHAT STAYED IDENTICAL
------------------------------
The useBarcodeScanner hook itself - getUserMedia, the BarcodeDetector-with-ZXing-fallback decoding logic, the useEffect cleanup stopping every camera track - is character-for-character the same code already built in Food Tracker (React + Firebase)'s own Chapter 4. The ScanScreen component's overall shape (call useBarcodeScanner with a callback, render a video element bound to the returned ref) is also identical.

WHAT ACTUALLY CHANGED
------------------------------
Only the body of the handleDetected callback changed - in the Firebase course it called a Cloud Function (lookupBarcode({ barcode })), while here it calls fetch("/api/lookup/" + barcode) against this course's own Express route from Chapter 3. That's the entire difference: one function call inside one callback.

WHY SO LITTLE NEEDS TO CHANGE
------------------------------
The hook was deliberately designed to know nothing about any backend at all - it only calls one plain callback prop, onDetected(barcode), and leaves every decision about what happens with that barcode entirely up to whichever parent component supplies the callback. Because the backend was never baked into the hook's own logic, swapping which backend receives the barcode only ever requires changing the callback's own implementation, never the hook itself.

WHY THIS WORKS AS AN ANSWER
------------------------------
It correctly identifies that the entire scanning hook and cleanup logic are unchanged, correctly isolates the one line that actually differs (the fetch call vs. the Cloud Function call inside handleDetected), and correctly explains that this is possible because the hook was deliberately built backend-agnostic from the start.