Where Gleam meets Mendix.
We connect the Gleam and Mendix communities — so Mendix widget developers can enjoy the power of Gleam, and Gleam developers can tap into Mendix's rich widget ecosystem.
|
Build tooling & framework for Mendix Pluggable Widget development.
gleam run -m glendix/dev
gleam run -m glendix/build
gleam run -m glendix/define |
Use Mendix's rich widget ecosystem in any Gleam web project. Works with lustre, redraw, or any Gleam frontend framework.
gleam run -m mendraw/install
gleam run -m mendraw/marketplace |
Mendix pluggable widgets are React components written in JavaScript or TypeScript, and TypeScript is a meaningful improvement over plain JavaScript. Gleam's advantage is not that those languages lack useful features; it is that Gleam makes a smaller, safer set of defaults mandatory while still compiling to JavaScript and interoperating with the existing ecosystem.
| Concern | JavaScript | TypeScript (strict) |
Gleam ✨ |
|---|---|---|---|
| Static checking | The language is dynamic and weakly typed; without separate analysis tooling, incompatible value use is discovered at runtime. | Broad compile-time checking, but types are erased. any, assertions, and documented unsound cases can bypass the checker. |
Full static checking is mandatory. There is no TypeScript-style unchecked any escape hatch; JavaScript externals must declare types, though their implementations remain trusted. |
| Missing values | null and undefined are runtime values; accessing a property on either throws. |
strictNullChecks distinguishes them, but ! and type assertions can remove the check without runtime validation. |
Ordinary types do not implicitly admit null. Absence is modeled explicitly, for example as Option(value) with Some or None. |
| UI state models | Tagged objects and switch are possible, but the language does not check that every state is handled. |
Discriminated unions support exhaustive checks with an explicit never or return-type pattern. |
Custom types and case are built in, and the compiler checks that pattern matching covers every variant. |
| Expected failures | Exceptions, rejected promises, or ad hoc sentinel values; a function signature does not require callers to handle them. | Tagged unions can model failures, but thrown exceptions remain unchecked by a function's return type. | Built-in Result(value, error) makes expected success and failure explicit data that can be composed or pattern matched. |
| Mutation | const prevents rebinding, not mutation of objects or arrays. |
readonly adds compile-time intent, but it does not provide deep or runtime immutability and can change through aliasing. |
Bindings and core data structures are immutable; updates produce new records, lists, or dictionaries. |
| JavaScript ecosystem | Direct access to Mendix, React, browser, and npm APIs. | Emits JavaScript and uses the same ecosystem, but type annotations do not validate runtime input. | Compiles to JavaScript ES modules and calls JavaScript through typed externals. The unchecked implementation is isolated at that boundary. |
Pluggable widgets sit on dynamic JavaScript APIs, but their own state is usually finite: loading, ready, empty, invalid, or failed. Gleam lets the JavaScript boundary stay small while the widget core uses types that do not silently admit JavaScript nulls, domain-specific custom types, exhaustive state transitions, typed failures, and immutable updates. When the model changes, the compiler points to the branches that must change with it.
TypeScript remains an excellent choice for gradually migrating an existing codebase or for widgets that mainly orchestrate JavaScript libraries. But for a new or state-heavy widget — where making invalid states harder to represent and keeping refactors compiler-guided matter more than unrestricted JavaScript flexibility — Gleam is the stronger default.
Official references:
Mendix on pluggable widget components;
MDN on JavaScript's type system and const;
TypeScript on strict, erased types, soundness, null checking, exhaustiveness, and readonly;
Gleam on full type checking, Option, exhaustive pattern matching, Result, immutability, and JavaScript externals.