Run it. Change it. Verify it.

Try it without installing a toolchain

1. Open the playground and keep its default scenario.
2. Run the comparison and read the results before opening the code.
3. Change the scenario, run again, and identify which decision changed.
4. Open View the code, choose a source file and read the explanation above it.
5. Reset the environment, including a run that is still pending.

Run your downloaded copy

Download and extract the ZIP into a new folder. With Python 3 installed, open a terminal in that folder and run the command below. It serves only this package on loopback; opening index.html directly is insufficient for workers and WebAssembly.

python preview.py

Open http://127.0.0.1:4210/ in your browser. Stop the server with Ctrl+C. The prebuilt preview needs no dependency installation and makes no automatic requests to another site. The source code and notices are included alongside it.

Run the native exercise

The commands below start in the extracted package root. Node-based examples require Node 24 or later; the Go adapter requires Go 1.27 or later; the Python adapter requires Python 3.11 or later. Install only the toolchain used by this lab. Exact dependency versions and the Node lockfile are in the download.

npm ci
npm test
npm run rebuild
python preview.py

A rejected save returns the safeguarded editor to two seats. A competing edit preserves the server’s newer four-seat record. A successful save updates the safeguarded summary to three seats.

Read GETTING_STARTED.md for the native request examples and shutdown steps. Native servers bind to 127.0.0.1. The optional monitoring containers expose only loopback ports. They are a separate exercise from the browser preview.

Make one meaningful change

Add a second editable field and a field-level validation error. Preserve an unsaved draft when a conflict arrives, then offer an explicit review-and-retry action instead of silently overwriting the newer record.

Add the expected result first, reproduce the failure, repair it, then rerun the native and browser checks. Use npm run rebuild for the Node/browser examples. The Go package includes rebuild_wasm.py; the Python package includes refresh_source.py.

Record what you learned

Capture the scenario, edition, input records, observed outcome and the test that checks it. Explain one alternative you rejected and why. Avoid converting a small local result into a throughput, security or accuracy claim about a production system.

Read the primary documentation

• React: optimistic state
• React: preserving state and keys
• React: memo

Kindred’s full-stack role emphasizes React/Next.js, interface craft and ownership through the backend.

Related role from the job review

Choose your next step