1
Visitor action
You click the button.
Backend made visible
Follow the request through the stack.
A small demo of how this site is wired. One click crosses the UI, API boundary, persistence layer, realtime broadcast, and live state so the moving parts are visible instead of only described.
Progress0/6
2
Angular frontend
The component calls a typed service and updates UI state.
3
ASP.NET Core API
A minimal endpoint receives the action and validates the flow.
4
MySQL persistence
The event is saved so the counter survives restarts.
5
SignalR broadcast
The backend pushes the new state to every connected browser.
6
Live UI update
Every visitor sees the system react without refreshing.
Correlationwaiting-for-simulation
The runtime path tells you where a request goes. Architecture tells you how the responsibilities around that request are organised.
Same request,
different architecture.
The same application action can travel through very different structures depending on how responsibilities and dependencies are organised. Pick an architecture and follow the request.
These are different ways to structure an application, not a ranking.
scenario
Scenario: a user submits a request to book a call.
0/5
Speed
Presentation
01
UI
Triggers the application action
e.g. clicks “Booking”
02
Controller
Receives the HTTP request
e.g. receives the Booking request
Application / Business
03
Business Service
Coordinates business behaviour
e.g. validates and processes the Booking
Data Access
04
Repository
Handles persistence access
e.g. creates the Booking record
Infrastructure
05
Database
Stores application state
e.g. creation of the Booking row
currently executingalready executed
key idea
Responsibilities are grouped into horizontal layers, with each layer handling a specific technical concern.
use it when
The application is straightforward and the dependency graph remains simple.
watch out
As the application grows, layers can become tightly coupled and business flows may spread across several technical layers.
code shape
One way this could be organised
src/
├── Api/
└── Controllers/
├── Application/
└── Services/
├── DataAccess/
└── Repositories/
└── Infrastructure/
└── Database/
available for freelance work
Book a slotNeed help structuring or untangling an application?
If your codebase needs clearer boundaries, a new application flow, or work across frontend and backend, tell me what you’re working on.