Timeline

An interactive web application for displaying user-selected events on a visual timeline. Each timeline renders milestones, dates, and descriptions along a vertical axis, with alternating entries and date badges.

Built with a .NET 10 Minimal API backend (Clean Architecture) and a Vue 3 SPA frontend.

Tech stack

Backend

• .NET 10 / C# 13
• ASP.NET Core Minimal APIs
• MediatR (CQRS-lite)
• FluentValidation
• Entity Framework Core with SQLite
• MSTest

Frontend

• Vue 3 (Composition API, <script setup>)
• TypeScript
• Vite
• Tailwind CSS v4
• Vue Router

Project structure

Timeline.slnx
├── src/
│   ├── Timeline.Domain          # Entities, value objects, domain events
│   ├── Timeline.Application     # Use cases, MediatR handlers, DTOs, validators
│   ├── Timeline.Infrastructure  # EF Core (SQLite), repositories, migrations
│   └── Timeline.Api             # Minimal API endpoints, DI host, CORS
├── tests/
│   ├── Timeline.Domain.Tests
│   ├── Timeline.Application.Tests
│   └── Timeline.Api.Tests
└── client/                      # Vue 3 SPA
    └── src/
        ├── components/
        ├── views/
        ├── router/
        ├── services/            # Typed fetch wrappers (no Axios)
        └── types/               # TypeScript mirrors of backend DTOs

Backend dependencies point inward: Api → Application → Domain. Infrastructure implements Application interfaces.

Prerequisites

• .NET 10 SDK
• Node.js (LTS recommended)

Getting started

Backend

dotnet build
dotnet run --project src/Timeline.Api

The API listens on http://localhost:5094. Pending EF Core migrations are applied automatically on startup against the SQLite database (timeline.db).

In development, the OpenAPI document is available at /openapi/v1.json.

Frontend

cd client
npm install
npm run dev

The Vite dev server runs on http://localhost:5173 and proxies /api to the .NET API.

Production build

cd client
npm run build      # outputs to client/dist

Testing

dotnet test

Tests use MSTest and mirror the source structure. Project naming convention: *.Tests.

API

Endpoints are grouped under /api/timelines:

Method	Route	Description
GET	/api/timelines	List all timeline summaries
GET	/api/timelines/{id}	Get a single timeline with its events

Conventions

• Minimal APIs for HTTP endpoints, grouped via MapGroup.
• Dependency injection for all services — no new for services.
• MediatR dispatches commands and queries from endpoints to Application handlers.
• FluentValidation validates inputs in the Application layer.
• EF Core migrations live in the Infrastructure project.
• Prefer record types for DTOs and value objects.
• Use global usings via each project's GlobalUsings.cs.
• Keep endpoints thin — business logic belongs in Application handlers.

See .editorconfig for formatting rules.