Welcome. This site supports keyboard navigation and screen readers.
Press ? at any time for keyboard shortcuts. Press [ to focus the sidebar, ] to focus the content.
High-contrast themes are available via the toolbar.
serard@dev00:~/cv
public class App : IHostedService {
private readonly ILogger _log;
private readonly IServiceProvider _sp;
public async Task StartAsync(CancellationToken ct)
{
var result = await _sp.GetRequiredService<IPipeline>()
.Map(ctx => ctx.Validate())
.Bind(ctx => ctx.Execute())
.Recover(err => Result.Fail(err));
_log.LogInformation("Pipeline: {Status}", result);
}
}
[AggregateRoot("Order")]
public partial class OrderAggregate
{
[Property] public string CustomerId { get; }
[Property] public OrderStatus Status { get; }
[Composition] public List<OrderLine> Lines { get; }
[Invariant]
public bool MustHaveLines() => Lines.Count > 0;
[DomainEvent]
public record OrderPlaced(string OrderId, DateTime At);
}
const render = async (md: string) => {
const { html, meta } = await marked.parse(md);
document.querySelector('#output').innerHTML = html;
await processMermaid(document.querySelector('#output'));
hljs.highlightAll();
};
<template>
<nav id="sidebar" role="navigation">
<div v-for="section in toc" :key="section.id">
<a :href="section.path">{{ section.title }}</a>
</div>
</nav>
</template>
apiVersion: apps/v1
kind: Deployment
metadata:
name: api-gateway
spec:
replicas: 3
selector:
matchLabels:
app: gateway
template:
spec:
containers:
- name: api
image: registry.local/api:latest
ports:
- containerPort: 8080
[MetaConcept("Entity")]
public abstract class EntityConcept
{
[MetaProperty] public string Name { get; }
[MetaReference] public AggregateConcept Root { get; }
[MetaConstraint]
public bool NameNotEmpty() => !string.IsNullOrEmpty(Name);
}
module.exports = {
entry: './src/index.ts',
output: { path: path.resolve(__dirname, 'dist') },
resolve: { extensions: ['.ts', '.js'] },
module: {
rules: [{ test: /\.ts$/, use: 'ts-loader' }]
}
};
Every interaction on this site — the scroll spy, the headings panel, the
sidebar resize, the version-news tooltip, the copy-feedback flash, the
keyboard navigation, the mermaid pan/zoom — is driven by one of ~40 pure state
machines living under src/lib/
and wired to the DOM through adapters in
src/app-shared.ts.
The diagram below proves it. It is generated at build time by walking the
TypeScript source with the compiler API, laying the result out with elkjs,
and inlining the resulting SVG straight into this page. No JavaScript is
required to see it: crawlers, RSS readers, the Firefox reader view, and
visitors with scripts disabled all see the same diagram, with every machine
name, adapter name and import edge readable as plain text.
When JavaScript is enabled, a tiny hydration adapter attaches click, hover and
filter behaviour on top of the same SVG — selection, filtering and the detail
panel are themselves driven by four new pure machines:
explorer-selection-state,
explorer-filter-state,
explorer-detail-state
and fsm-simulator-state.
The explorer is, recursively, a composition of state machines.
Try it live. Double-click any machine node to open its own state diagram
in a popover, then click the green event buttons on the right to step
through the machine: the active state lights up, fireable transitions turn
green, history accumulates at the bottom. Reset replays from the initial
state. Drag to pan, scroll to zoom, Esc closes the popover.
scripts/extract-state-machines.ts walks src/lib/*.ts with the
TypeScript Compiler API and extracts every exported state machine, its
state union, and its public methods. It also walks src/app-shared.ts to
find every adapter (IIFE module) and which machine factories it references,
producing the directed import graph.
scripts/render-state-machine-svg.ts loads the JSON, hands it to
elkjs for layered layout, then walks the result and emits a self-contained
SVG fragment with data-node-id / data-node-kind / data-edge-from
attributes on every element.
scripts/lib/page-renderer.ts sees include: data/state-machines.svg.html
in this page's frontmatter and substitutes the file's contents for the literal
token above. The SVG ships inside the static HTML.
src/state-machines-explorer.ts runs in the browser, finds the inlined
SVG, and attaches interactivity using four pure machines
(explorer-selection-state, explorer-filter-state, explorer-detail-state,
fsm-simulator-state) plus the existing pan/zoom logic from svg-viewport-state.ts
and the modal primitives from machine-popover-state.ts and panel-events.ts.
No third-party runtime libraries are loaded — every line of interactivity
flows through the same compositional pattern as the rest of the site.
src/lib/fsm-simulator-state.ts is the meta cherry: a state machine
that replays other state machines. When you double-click a node,
attachSimulator reads the per-node data-node-transitions attribute,
hands the transition table to a fresh FsmSimulatorMachine, and on every
onStateChange tick toggles .msd-state--active on the current state
bubble, .msd-transition-group--available on the green arcs, and rebuilds
the event button list. The same machine powers the unit tests under
test/unit/fsm-simulator-state.test.ts — there is no DOM code in the
machine itself.