UI-Framework — für .NET-Teams, die Webanwendungen liefern
Schreiben Sie UI in C#.Liefern Sie JavaScript.
Ein C#-first UI-Framework, das nach TypeScript kompiliert — damit .NET-Teams moderne Webanwendungen liefern, ohne zweiten Technologie-Stack, ohne zweites Team, ohne zweiten Auslieferungsweg.
UI-Framework — für .NET-Teams, die Webanwendungen liefern
Schreiben Sie UI in C#.Liefern Sie JavaScript.
Ein C#-first UI-Framework, das nach TypeScript kompiliert — damit .NET-Teams moderne Webanwendungen liefern, ohne zweiten Technologie-Stack, ohne zweites Team, ohne zweiten Auslieferungsweg.
public class Counter : StatefulComponent{ private int _count = 3; public override VisualNode Build(...) { var row = new Row(gap: 12); row.Add(new Text($"{_count}")); row.Add(Button("+1", () => SetState( () => _count++))); return row; }}
LIVE-VORSCHAU
3
WARUM ES EXISTIERT
Drei Entscheidungen, auf denen das Framework aufbaut
Schreiben Sie UI in reinem C#Deklarative Komponenten in der Sprache, die Ihr Team schon kennt. Kompiliert nach TypeScript, läuft als JavaScript. Kein Kontextwechsel.
Server-Aktionen, typsicherRufen Sie Servermethoden vom Client aus auf, mit vollständiger Typsicherheit, automatischer Serialisierung und eingebautem CSRF-Schutz. Kein REST-Gerüst.
CSS ohne RuntimeStyles werden zur Kompilierzeit herausgezogen. Keine Analyse zur Laufzeit, kein FOUC, kein Tailwind-JIT. Ausgeliefert wird reines CSS — schnell, cachebar, debugbar.
Schreiben Sie UI in reinem C#Deklarative Komponenten in der Sprache, die Ihr Team schon kennt. Kompiliert nach TypeScript, läuft als JavaScript. Kein Kontextwechsel.
Server-Aktionen, typsicherRufen Sie Servermethoden vom Client aus auf, mit vollständiger Typsicherheit, automatischer Serialisierung und eingebautem CSRF-Schutz. Kein REST-Gerüst.
CSS ohne RuntimeStyles werden zur Kompilierzeit herausgezogen. Keine Analyse zur Laufzeit, kein FOUC, kein Tailwind-JIT. Ausgeliefert wird reines CSS — schnell, cachebar, debugbar.
Schreiben Sie UI in reinem C#Deklarative Komponenten in der Sprache, die Ihr Team schon kennt. Kompiliert nach TypeScript, läuft als JavaScript. Kein Kontextwechsel.
Server-Aktionen, typsicherRufen Sie Servermethoden vom Client aus auf, mit vollständiger Typsicherheit, automatischer Serialisierung und eingebautem CSRF-Schutz. Kein REST-Gerüst.
CSS ohne RuntimeStyles werden zur Kompilierzeit herausgezogen. Keine Analyse zur Laufzeit, kein FOUC, kein Tailwind-JIT. Ausgeliefert wird reines CSS — schnell, cachebar, debugbar.
WAS ES TUT
Die fünf Dinge, die ein .NET-Team zuerst merkt
Über 20 produktionsreife KomponentenGrid mit Virtualisierung, Modal, Formular, Tabelle, Tabs, Combobox, Baum, Kalender, Toast — jedes Grundelement, mit dem man eine echte Anwendung ausliefert. Thematisierbar, barrierefrei (WAI-ARIA) und getestet.
Hot Reload auf UnternehmensniveauSpeichern Sie eine C#-Datei, und der Browser aktualisiert sich an der Stelle, unter Beibehaltung des Komponentenzustands. Die Schleife ist so eng wie die, die Ihr Frontend-Team schon hat.
Setzen Sie Haltepunkte in Ihrem UI-CodeSource Maps tragen das C# durch, der Debugger hält also in der Datei, die Sie geschrieben haben — nicht in erzeugtem JavaScript, das Sie erst rückwärts verstehen müssten.
Styles zur Kompilierzeit, Geschwindigkeit zur LaufzeitLegen Sie Styles neben die Komponenten — ausgeliefert werden sie als statisches Stylesheet. Keine Analyse zur Laufzeit, kein zusätzliches JS, keine Klassennamen, die durch die Hierarchie gereicht werden.
Rufen Sie Ihr Backend wie eine lokale Methode aufVersehen Sie eine C#-Methode mit [ServerAction] und rufen Sie sie aus einem Button-onClick auf. Argumente werden serialisiert, Typen fließen durch, Fehler kommen an. CSRF und Authentifizierung sind erledigt.
Über 20 produktionsreife KomponentenGrid mit Virtualisierung, Modal, Formular, Tabelle, Tabs, Combobox, Baum, Kalender, Toast — jedes Grundelement, mit dem man eine echte Anwendung ausliefert. Thematisierbar, barrierefrei (WAI-ARIA) und getestet.
Hot Reload auf UnternehmensniveauSpeichern Sie eine C#-Datei, und der Browser aktualisiert sich an der Stelle, unter Beibehaltung des Komponentenzustands. Die Schleife ist so eng wie die, die Ihr Frontend-Team schon hat.
Setzen Sie Haltepunkte in Ihrem UI-CodeSource Maps tragen das C# durch, der Debugger hält also in der Datei, die Sie geschrieben haben — nicht in erzeugtem JavaScript, das Sie erst rückwärts verstehen müssten.
Styles zur Kompilierzeit, Geschwindigkeit zur LaufzeitLegen Sie Styles neben die Komponenten — ausgeliefert werden sie als statisches Stylesheet. Keine Analyse zur Laufzeit, kein zusätzliches JS, keine Klassennamen, die durch die Hierarchie gereicht werden.
Rufen Sie Ihr Backend wie eine lokale Methode aufVersehen Sie eine C#-Methode mit [ServerAction] und rufen Sie sie aus einem Button-onClick auf. Argumente werden serialisiert, Typen fließen durch, Fehler kommen an. CSRF und Authentifizierung sind erledigt.
Über 20 produktionsreife KomponentenGrid mit Virtualisierung, Modal, Formular, Tabelle, Tabs, Combobox, Baum, Kalender, Toast — jedes Grundelement, mit dem man eine echte Anwendung ausliefert. Thematisierbar, barrierefrei (WAI-ARIA) und getestet.
Hot Reload auf UnternehmensniveauSpeichern Sie eine C#-Datei, und der Browser aktualisiert sich an der Stelle, unter Beibehaltung des Komponentenzustands. Die Schleife ist so eng wie die, die Ihr Frontend-Team schon hat.
Setzen Sie Haltepunkte in Ihrem UI-CodeSource Maps tragen das C# durch, der Debugger hält also in der Datei, die Sie geschrieben haben — nicht in erzeugtem JavaScript, das Sie erst rückwärts verstehen müssten.
Styles zur Kompilierzeit, Geschwindigkeit zur LaufzeitLegen Sie Styles neben die Komponenten — ausgeliefert werden sie als statisches Stylesheet. Keine Analyse zur Laufzeit, kein zusätzliches JS, keine Klassennamen, die durch die Hierarchie gereicht werden.
Rufen Sie Ihr Backend wie eine lokale Methode aufVersehen Sie eine C#-Methode mit [ServerAction] und rufen Sie sie aus einem Button-onClick auf. Argumente werden serialisiert, Typen fließen durch, Fehler kommen an. CSRF und Authentifizierung sind erledigt.
DIE BIBLIOTHEK22 Komponenten, kein Starterpaket
Grid
Daten
Virtualisiert, sortierbar, filterbar
Table
Daten
Verstellbare Spalten, ausklappbare Zeilen
Tree
Daten
Verzögert geladen, per Ziehen umsortierbar
Form
Eingabe
Validierte, asynchronfähige Felder
Combobox
Eingabe
Asynchrone Suche, Mehrfachauswahl
DatePicker
Eingabe
Zeiträume, Sprachen, Zeitzonen
Modal
Überlagerung
Stapelbar, Fokusfalle, Portal
Drawer
Überlagerung
Seitlich verankert, verstellbar
Toast
Überlagerung
In Warteschlange, aktionsbewusst
Tabs
Navigation
Verzögerte Panels, Tastaturnavigation
Menu
Navigation
Kaskadierend, über die Tastatur bedienbar
Breadcrumb
Navigation
Kürzend, Überlauf als Liste
Card
Layout
Mit Slots, thematisierbar
Splitter
Layout
Verstellbar, Zustand bleibt erhalten
Stack
Layout
Abstands-Tokens, responsiv
Calendar
Datum
Monats-, Wochen- und Agendaansicht
Scheduler
Datum
Anlegen per Ziehen, Wiederholungen
Chart
Visualisierung
Balken, Linien, Ring — thematisierbar
Progress
Rückmeldung
Linear, kreisförmig, unbestimmt
Skeleton
Rückmeldung
Automatische Form, animiert
Avatar
Anzeige
Initialen als Rückfall, Statuspunkt
Badge
Anzeige
Zähler, semantische Farben
Grid
Daten
Virtualisiert, sortierbar, filterbar
Table
Daten
Verstellbare Spalten, ausklappbare Zeilen
Tree
Daten
Verzögert geladen, per Ziehen umsortierbar
Form
Eingabe
Validierte, asynchronfähige Felder
Combobox
Eingabe
Asynchrone Suche, Mehrfachauswahl
DatePicker
Eingabe
Zeiträume, Sprachen, Zeitzonen
Modal
Überlagerung
Stapelbar, Fokusfalle, Portal
Drawer
Überlagerung
Seitlich verankert, verstellbar
Toast
Überlagerung
In Warteschlange, aktionsbewusst
Tabs
Navigation
Verzögerte Panels, Tastaturnavigation
Menu
Navigation
Kaskadierend, über die Tastatur bedienbar
Breadcrumb
Navigation
Kürzend, Überlauf als Liste
Card
Layout
Mit Slots, thematisierbar
Splitter
Layout
Verstellbar, Zustand bleibt erhalten
Stack
Layout
Abstands-Tokens, responsiv
Calendar
Datum
Monats-, Wochen- und Agendaansicht
Scheduler
Datum
Anlegen per Ziehen, Wiederholungen
Chart
Visualisierung
Balken, Linien, Ring — thematisierbar
Progress
Rückmeldung
Linear, kreisförmig, unbestimmt
Skeleton
Rückmeldung
Automatische Form, animiert
Avatar
Anzeige
Initialen als Rückfall, Statuspunkt
Badge
Anzeige
Zähler, semantische Farben
Grid
Daten
Virtualisiert, sortierbar, filterbar
Table
Daten
Verstellbare Spalten, ausklappbare Zeilen
Tree
Daten
Verzögert geladen, per Ziehen umsortierbar
Form
Eingabe
Validierte, asynchronfähige Felder
Combobox
Eingabe
Asynchrone Suche, Mehrfachauswahl
DatePicker
Eingabe
Zeiträume, Sprachen, Zeitzonen
Modal
Überlagerung
Stapelbar, Fokusfalle, Portal
Drawer
Überlagerung
Seitlich verankert, verstellbar
Toast
Überlagerung
In Warteschlange, aktionsbewusst
Tabs
Navigation
Verzögerte Panels, Tastaturnavigation
Menu
Navigation
Kaskadierend, über die Tastatur bedienbar
Breadcrumb
Navigation
Kürzend, Überlauf als Liste
Card
Layout
Mit Slots, thematisierbar
Splitter
Layout
Verstellbar, Zustand bleibt erhalten
Stack
Layout
Abstands-Tokens, responsiv
Calendar
Datum
Monats-, Wochen- und Agendaansicht
Scheduler
Datum
Anlegen per Ziehen, Wiederholungen
Chart
Visualisierung
Balken, Linien, Ring — thematisierbar
Progress
Rückmeldung
Linear, kreisförmig, unbestimmt
Skeleton
Rückmeldung
Automatische Form, animiert
Avatar
Anzeige
Initialen als Rückfall, Statuspunkt
Badge
Anzeige
Zähler, semantische Farben
GEMESSEN AN EINER HELLO-WORLD-ANWENDUNGBundle-Größe und Zeit bis zur Bedienbarkeit
NIEDRIGER IST BESSER
eQuantic.UIUS
18 kB142 ms
React + Redux
64 kB410 ms
Angular
132 kB720 ms
Blazor WASM
1450 kB2100 ms
WARUM .NET-TEAMS ES WÄHLENEin Stack, nicht zweiDie meisten .NET-Häuser landen bei einem JS-Stack, den sie kaum pflegen — ein Team in C#, ein anderes in TypeScript, zwei CI-Strecken, zwei Auslieferungswege. eQuantic.UI führt das auf den Stack zurück, den Sie schon betreiben.
Eine Sprache, von Anfang bis EndeDas Modell, der Endpunkt und der Button, der ihn aufruft, sind alle in C#, von denselben Leuten geprüft, in einem Repository.
Kein JS-Runtime-AufwandDas Framework kompiliert sich weg. Ausgeliefert wird JavaScript, das Ihr Browser ausführt, und CSS, das er zwischenspeichert — kein Interpreter.
Werkzeuge auf ProduktionsniveauHot Reload, das den Zustand behält, Haltepunkte in Ihren eigenen Dateien, und der .NET-Build, den Sie in der CI schon haben.
Besessen, nicht gemietetMIT-lizenziert, auf NuGet, und im Einsatz bei den Produkten dieses Katalogs — einschließlich der Seite, die Sie gerade lesen.
WARUM .NET-TEAMS ES WÄHLENEin Stack, nicht zweiDie meisten .NET-Häuser landen bei einem JS-Stack, den sie kaum pflegen — ein Team in C#, ein anderes in TypeScript, zwei CI-Strecken, zwei Auslieferungswege. eQuantic.UI führt das auf den Stack zurück, den Sie schon betreiben.
Eine Sprache, von Anfang bis EndeDas Modell, der Endpunkt und der Button, der ihn aufruft, sind alle in C#, von denselben Leuten geprüft, in einem Repository.
Kein JS-Runtime-AufwandDas Framework kompiliert sich weg. Ausgeliefert wird JavaScript, das Ihr Browser ausführt, und CSS, das er zwischenspeichert — kein Interpreter.
Werkzeuge auf ProduktionsniveauHot Reload, das den Zustand behält, Haltepunkte in Ihren eigenen Dateien, und der .NET-Build, den Sie in der CI schon haben.
Besessen, nicht gemietetMIT-lizenziert, auf NuGet, und im Einsatz bei den Produkten dieses Katalogs — einschließlich der Seite, die Sie gerade lesen.
DER TECHNOLOGIE-STACKFügt sich in Ihren bestehenden Betrieb ein
LOS GEHT'SVon Null zur laufenden Anwendung in 60 Sekunden
# Die Vorlage installierendotnet new install eQuantic.UI.Templates# Scaffold a new appdotnet new equi-app -n MyAppcd MyApp# Mit Hot Reload startendotnet watch run
WAS ENTWICKLER FRAGENDas Framework, ehrlich
Eine Sprache, den ganzen Weg hinunter
Installieren Sie die Vorlage, erzeugen Sie ein Grundgerüst, und sehen Sie zu, wie C# zu dem JavaScript wird, das Ihre Nutzer tatsächlich ausführen. MIT-lizenziert, heute auf NuGet.