Asia/Phnom_Penh
BlogJune 20, 2025

Clean architecture in a Vue codebase

Separating business logic from the view, without going overboard
Makara Nuol
Clean architecture in a Vue codebase
Presentation components that also do business logic don't scale. They grow, split awkwardly, and become hard to test. Pulling logic out into composables and use-cases keeps the view layer thin and the rules testable on their own.
  • Views.vue files. Props in, events out. Render state.
  • Composables — reactive glue. Hold state, call use-cases, expose refs the view consumes.
  • Use-cases — plain functions. Orchestrate domain rules. No Vue imports.
  • Gateways — anything that talks to the outside world (HTTP, storage). Wrapped behind a thin interface.
I don't add layers I don't need. A form component that just calls one API doesn't need a dedicated use-case — the composable is enough. Layers earn their place by making something reusable, testable, or swappable. If none of those apply, skip it. This is a dummy post — published as placeholder content.
Share this post: