🗺️ Software Architecture — MOC

Map of Content. Principles, patterns, and structural decisions in software systems.

See also: CSS & Styling Architecture — tokens, cascade, and the component styling contract.

Angular UI Patterns

• Angular Modal Service Pattern — custom MatDialog wrapper with semantic modal vs popup distinction
• Angular Overlay Invocation Patterns — direct component-driven vs NgRx-driven (URL-bound) overlay triggers
• Angular Child-to-Parent Error Propagation via Output — @Output per child; breaks down in steppers with multiple children
• Angular Parent-Scoped Error Bus Pattern — shared injectable stream; children self-register, parent subscribes once; foundation for a rules engine

Component structure & placement

• Reuse Scope Drives Angular Component Extraction and Placement — reuse scope decides both extraction mechanism (ng-template → component) and file location (inline → sibling → feature components/ → UI module)
• App-Wide UI Components Get a Generic API as Pre-Payment for Library Extraction — only tier-4 app-wide components get a generic API + own data model; pre-payment for lifting into a standalone library

Data grids

• Grid Columns Are Row-Object Keys Projected into Augmentable Descriptors — row object's keys = columns; project one descriptor per attribute, augment with lib props (DevExtreme dataField, visible, order, filterable, sortable)
• A Grid Separates Row-Data Array from a View-State Config Object — keep backend row array separate from the config object holding active columns, per-row errors, filters, sort, groups

State & editor patterns

• Dual-Snapshot Dirty Tracking — keep original + current, detect changes by comparing on demand; no delta log
• Persist Flat, Render as Tree — store hierarchical data flat (dot-namespaced), rebuild the tree lazily at render
• Version Structure, Not Content — audit-log only the changes a downstream consumer must respond to (structural ops, not value edits)
• EventTarget as a Zero-Dependency State Bus — native EventTarget pub/sub backs the store; no framework or library

Core notes

• Config Schema and Runtime Unified in a Single Renderer — co-locating interpreter and executor eliminates schema/runtime drift
• Reactive State Bus Pattern — minimal pub/sub for UI reactivity without framework overhead
• Declarative Data Apps — apps as serializable JSON config, not imperative code
• Template Variables as Implicit Dependency Declarations — {{varName}} as a reactive graph declaration primitive
• API Proxy as Browser Security Boundary — secrets stay server-side, injected at forward time
• Stateless Editor Panel as Pure Projection — UI panels as pure functions of their data model

All linked notes

LIST
FROM [[Software Architecture]]
WHERE type = "zettel" OR type = "source"
SORT file.name ASC

Open questions

• When does co-locating schema + runtime become a liability (hard to evolve independently)?
• What is the minimal viable reactive primitive before you need a framework?