-
Notifications
You must be signed in to change notification settings - Fork 4
Home
The Vitruv-UI-Methodologist is a web-based configuration tool for the Vitruvius framework. It allows domain experts — called methodologists — to define how different models in a software project relate to each other, without requiring deep knowledge of the underlying Vitruvius internals.
Concretely, a methodologist uses this tool to:
- manage metamodels (the structural blueprints of a domain, defined as
.ecorefiles) - compose VSUMs (Virtual Single Underlying Models — a project that bundles multiple metamodels and their relationships)
- define reactions between metamodels, which describe how a change in one model should propagate to another
- validate and export the resulting configuration as a buildable Vitruvius artifact
This tool is intended for methodologists who work with the Vitruvius framework and need a guided, visual interface rather than manual framework configuration. It does not require writing Java or interacting with Eclipse directly.
End users of the generated models (i.e. developers who consume the VSUM) are not the primary audience of this UI.
The project is split into two repositories:
| Repository | Description |
|---|---|
| Vitruv-UI-Methodologist | React + TypeScript frontend (this repo) |
| methodologistUI-backend | Spring Boot backend with PostgreSQL, Keycloak, and LSP process management |
Frontend: React 18, TypeScript, ReactFlow, Monaco Editor, React Testing Library, Vite / CRA, SonarQube
Backend: Spring Boot (Java 17), PostgreSQL, Keycloak (OIDC), Flyway, JaCoCo, Maven
LSP: Xtext-based Reactions DSL LSP, NeoJoin LSP — both running as per-session processes managed by the backend and connected via WebSocket
# Vitruv-UI-MethodologistThe Vitruv-UI-Methodologist is a web-based configuration tool for the [Vitruvius framework](https://github.com/vitruv-tools). It allows domain experts — called methodologists — to define how different models in a software project relate to each other, without requiring deep knowledge of the underlying Vitruvius internals.
Concretely, a methodologist uses this tool to:
- manage metamodels (the structural blueprints of a domain, defined as
.ecorefiles) - compose VSUMs (Virtual Single Underlying Models — a project that bundles multiple metamodels and their relationships)
- define reactions between metamodels, which describe how a change in one model should propagate to another
- validate and export the resulting configuration as a buildable Vitruvius artifact
This tool is intended for methodologists at KIT who work with the Vitruvius framework and need a guided, visual interface rather than manual framework configuration. It does not require writing Java or interacting with Eclipse directly.
End users of the generated models (i.e. developers who consume the VSUM) are not the primary audience of this UI.
The project is split into two repositories:
| Repository | Description |
|---|---|
| [Vitruv-UI-Methodologist] | React + TypeScript frontend (this repo) |
| [methodologistUI-backend] | Spring Boot backend with PostgreSQL, Keycloak, and LSP process management |
The frontend communicates with the backend via a REST API and WebSocket connections.
| Term | What it means |
|---|---|
| Metamodel | An .ecore file describing the structure of a domain (classes, attributes, references). Displayed on the canvas as a UML class diagram. |
| VSUM | A project that groups metamodels and defines how they relate. Corresponds to a Vitruvius VirtualModel. |
| Reaction | A rule written in the Reactions DSL that specifies how a change in one metamodel triggers an update in another. |
| ViewType | A specification of how a particular model view is constructed from the underlying VSUM data. |
| Artifact | The compiled, deployable output of a fully configured VSUM — a .zip file ready for use by the Vitruvius framework. |
| Screen | Route | Purpose |
|---|---|---|
| Sign in / Sign up | /login |
Authentication via username/password or Keycloak SSO |
| OTP verification | /verify-otp |
Email verification for new accounts |
| Home | / |
Overview with navigation to library, projects, and profile |
| Model Library |
/ (Library tab) |
Browse and manage all uploaded metamodels |
| Projects |
/ (Projects tab) |
Create and open VSUM projects |
| Canvas | /canvas/:id |
Main working area — compose and configure a VSUM |
| Profile |
/ (Profile tab) |
Edit name and change password |
For a full screen-by-screen navigation flow, see UI Navigation.
| Page | Description |
|---|---|
| Home | This page |
| UI Navigation | Screen flow diagram (Mermaid) and per-screen description |
| Architecture | Tech stack, folder structure, service boundaries |
| Getting Started | Local development setup (frontend + backend) |
| Features | Canvas modes, model drawer, reactions, constraints, ViewTypes |
| API & Backend | REST endpoints, authentication, LSP integration |
| Development Guide | Code conventions, SonarQube rules, testing patterns |
Frontend: React 18, TypeScript, ReactFlow, Monaco Editor, React Testing Library, Vite / CRA, SonarQube
Backend: Spring Boot (Java 17), PostgreSQL, Keycloak (OIDC), Flyway, JaCoCo, Maven
LSP: Xtext-based Reactions DSL LSP, NeoJoin LSP — both running as per-session processes managed by the backend and connected via WebSocket