Skip to main content

Internals

This section explains how the Bilup editor is built: the React and Redux architecture of scratch-gui, how the top-level component is composed, how the app talks to the virtual machine, how state is managed, how themes are applied, and how the addon system works.

It is the companion to Contributing. Contributing tells you how to check out, build, and change the code. Internals tells you how the code is put together so those changes make sense.

This is developer-facing material. If you only want to use the editor, you do not need any of it.

Scope

Almost everything here is about scratch-gui, because that is where the interface, the Redux store, the theme engine, and the addon framework live. The runtime and compiler live in scratch-vm and are covered separately in the API Reference. Where scratch-gui talks to the VM, that boundary is described in Architecture.

Bilup is a fork of TurboWarp, which is a fork of Scratch. Much of the structure here is inherited from Scratch and TurboWarp. The pages point out where Bilup diverges.

The pages

  1. Architecture covers the big picture: React plus Redux, how gui.jsx is composed from higher-order components, and the bridge to the VM.
  2. Components describes the presentation components and the container/component split.
  3. Containers explains the container pattern that connects components to Redux.
  4. State Management lists the real reducers in the store and how selectors, action creators, and middleware fit together.
  5. Theming covers how themes turn into CSS custom properties on the document and how block colors are applied.
  6. The Addons System covers the addon settings store and the window system.

See also