Reactor Lab’s Web Labs are written with plain HTML/CSS/Javascript with only the jQuery library and a plotting library added. Many web sites and apps are built using TypeScript and React. I used Claude AI to help me write an explanation of these tools.

TypeScript is a way to declare values in Javascript as to type, that is, what kind of value it is (function, number, boolean, string, array, etc.) and what operations can be performed on it. Declaring value types is a way to help avoid runtime errors.

JavaScript written with TypeScript is saved in .TS files. A TypeScript compiler continuously checks for type errors while compiling .TS files into standard JavaScript files that can be executed by a web browser alongside the project’s HTML and CSS files.

CSS files are written and handled normally when developing with TypeScript or React.

React enables building complex user interfaces (UI) by composing simple, self-contained components. These components encapsulate UI structure, state, and behavior, and can be reused within a project or shared across multiple projects.

React code in development is written using JSX, a JavaScript syntax extension that looks like HTML/XML embedded in JavaScript. React code is saved in .JSX files.

TypeScript and React can be used independently or can be used together. When TypeScript is used along with React, the code is saved in .TSX files.

The .TSX and .JSX files are run through a transpiler that processes the files and outputs standard Javascript files that can be run in a web browser. A short index.html file loads the Javascript files. In practice, modern build tools like esbuild or Vite handle both TypeScript compilation and JSX transpilation in a single step.

The Javascript files output by the transpiler contain calls to functions in the React runtime Javascript library, which is downloaded by the browser along with the other files in the project. The React runtime library handles the UI display by manipulating the Document Object Model (DOM), such as adding divs and buttons, etc., based on component state changes.