# TypeScript Boundary Lab

By Chason Arthur · Revision 104.027 · Published and updated November 3, 2026.

## Click and run locally

1. Extract this whole ZIP to a new directory.
2. Use Python 3.10 or later to run `python preview.py` from that directory.
3. Open the loopback URL printed by the preview.
4. Click Run this example. Use Reset to stop and clear the environment.
5. View the code, follow the tutorial, and compare the two implementations.
6. Stop the preview with Ctrl+C.

The included prebuilt browser application runs without installing its language toolchain. Serve it through the preview; opening the HTML file directly is not supported. The preview binds to 127.0.0.1 and serves only `site/`. Source and native tools remain outside that document root. A port can be selected with `python preview.py --port 4190`.

The React application runs real compiled TypeScript against three invented sample responses. It makes no customer API calls. The public controls choose reviewed examples; they do not execute visitor-supplied code.

No account, key, database connection, payment or customer record is needed. The package's simple local navigation is independent of the production site's navigation enhancement. Optional links to the full Zyel catalog and a fresh download point to zyel.io.

## Edit and check TypeScript

Install Node 24 and pnpm. From this package root:

```sh
pnpm install --frozen-lockfile
pnpm run typecheck
pnpm run build
pnpm test
python refresh_source.py
```

`src/domain.ts` owns the runtime validator, state transition and asynchronous ordering. `src/app.tsx` is the React interface. The build produces the browser JavaScript and a native test module. The negative type tests deliberately require type errors for mixed identifiers and incomplete states.

After editing, rebuild and refresh the source viewer before reloading the preview. The compiled JavaScript and original source are different representations of the same release; the browser does not compile visitor input.


## Files and evidence

`FILE_MANIFEST.json` records SHA-256 hashes of the extracted files. `site/lab/typescript-boundaries/source/manifest.json` identifies the source displayed in the code viewer. `TEST_MATRIX.md` separates browser, native and optional engine-specific checks. The recording script follows the same reviewed scenarios.

## License and revision labels

Original teaching and application code are MIT-licensed. See THIRD_PARTY_NOTICES.md for the separate runtime licenses and their source. Revision numbers identify editions and do not count earlier public updates. The publication date is separate from the revision label.