Architecture Overview
How the web app and server are organized.
Overview
Two repos, one product: web (Next.js, App Router) renders the UI and calls
server (.NET) over a REST API, plus SignalR hubs for live game state
(submissions, lobby updates). Auth0 issues the tokens both sides trust.
Server
The backend server is built based on Clean Architecture with CQRS, and domain driven design (DDD). The solution is broken up into these projects:
| Project | Owns |
|---|---|
StackDuel.Domain | Entities, value objects, domain logic - no framework dependencies. |
StackDuel.Application | Use cases / handlers that orchestrate domain objects. |
StackDuel.Infrastructure | EF Core, repositories, external services (Judge0, blob storage, message bus). |
StackDuel.Api | HTTP endpoints, SignalR hubs, and auth wiring |
Web
The front end is built on top of Next.js to provide better SEO and performance. We also use Shadcn, Tailwindcss, React Query, and Zustand. This tech stack helps speed up our development by providing rapid prototyping, flexible state management, and plenty of out-of-the-box components.
Each feature area lives under src/domains/<name>/ and typically contains
its own components/, lib/, models/, api/ (React Query hooks), and
forms/ - the domain owns everything specific to it. src/shared/ is for
code with no single owning domain: layouts, the shadcn-based ui/
component library, auth guards, and router-config.ts, the single source
of truth for every app route.
Pages under src/app/ stay thin - they fetch/compose and delegate the
actual UI to a src/views/<area>/*-layout.tsx component.