Bouw complete, moderne web-UI's rechtstreeks vanuit Delphi, C++ Builder en .NET. sgcHTML is een server-side componentframework met 89 kant-en-klare, data-aware widgets — grafieken, grids, formulieren, dashboards, chat en meer — die rechtstreeks aan een TDataSet binden, Bootstrap 5-markup renderen en interactief blijven via htmx. Jij schrijft Object Pascal of C#, sgcHTML schrijft de HTML, CSS en JavaScript.
sgcHTML verandert je bestaande Delphi-, C++ Builder- of .NET-back-end in een webapplicatieserver. Elk component is een native class die Bootstrap 5-HTML uitstuurt; htmx houdt de pagina interactief en live zonder ook maar één regel handgeschreven JavaScript.
Elke widget is een class — TsgcHTMLComponent_Chart, TsgcHTMLComponent_Grid, TsgcHTMLComponent_Form en 86 meer. Stel de eigenschappen in en lees vervolgens de HTML-eigenschap uit om schone Bootstrap 5-markup te krijgen die klaar is om te serveren.
Plaats een TsgcHTMLEngine_Server (of koppel de HTML aan een bestaande TsgcWebSocketHTTPServer). Verzoeken komen binnen in je OnCommandGet-handler; jij beantwoordt ze met een pagina die uit componenten is opgebouwd. Geen externe webstack.
sgcHTML is niet gebonden aan de sgcWebSockets-server. Serveer dezelfde uit componenten opgebouwde pagina's vanuit elke Embarcadero WebBroker-applicatie via TsgcHTMX_Engine_Server_WebBroker, of vanuit een DataSnap-server met live WebSocket-push op dezelfde poort als je REST-endpoints.
Voeg een TsgcHTMX_Engine_Server toe en kliks, formulierposts en live updates gaan heen en weer naar je Pascal/C#-eventhandlers. De server wisselt HTML-fragmenten ter plekke uit — het SPA-gevoel, zonder de JavaScript-buildketen.
Omdat htmx over de sgcWebSockets-server draait, kun je live HTML naar elke verbonden browser pushen. Dashboards, monitors en chatvensters werken bij op het moment dat je data verandert — server-gedreven, zonder polling.
TsgcHTMLTemplate_Bootstrap verpakt je content in een compleet responsief document; TsgcHTMLThemeController en TsgcHTMLThemeBuilder bieden lichte/donkere thema's en een gedeelde stylesheet. Bootstrap 5.3 en htmx worden ingebouwd meegeleverd — geen CDN tijdens runtime.
Grid, DataTable, Chart, Select, TreeView, Scheduler, Timeline en Form binden rechtstreeks aan een TDataSet via LoadFromDataSet / DataSource. Richt een component op een query en het rendert de rijen.
sgcHTML wordt geleverd met ingebouwde UI-tekst (knoppen, labels, validatieberichten) in 17 talen: Engels, Spaans, Frans, Duits, Portugees, Italiaans, Nederlands, Zweeds, Noors, Pools, Tsjechisch, Turks, Russisch, Chinees, Japans, Koreaans en Arabisch. Kies er een met sgcHTMLSetLanguage en componenten renderen in de taal van de bezoeker met de juiste native schriften, waaronder CJK, Cyrillisch en Arabisch.
Elk component stuurt zijn dynamische tekst, attributen, inline JavaScript en URL's door automatische HTML-, attribuut-, JavaScript- en URL-codering plus URL-sanering (sgcHTMLEncode, sgcHTMLAttrEncode, sgcJSEncode, sgcHTMLSanitizeURL), zodat gebruikersgegevens niet uit hun context kunnen breken en script kunnen injecteren. Bescherming tegen XSS en injectie staat aan zonder extra werk.
Van navigatie-chrome tot datagrids, grafieken, formulieren, overlays en AI-chat — het volledige Bootstrap 5-vocabulaire als native componenten. Elk linkt naar zijn eigen pagina met Delphi-, C++ Builder- en .NET-voorbeelden.
NavBar, Sidebar, Breadcrumb, Tabs, Pagination, Toolbar, TreeView, Stepper, Dropdown, ButtonGroup, ListGroup, DashboardLayout, Splitter.
Componenten bekijken →Grid, DataTable, TreeGrid, PivotTable, Calendar, Scheduler, Timeline, ActivityFeed, KanbanBoard, Gantt — sorteerbaar, filterbaar, exporteerbaar, dataset-gebonden.
Componenten bekijken →Chart (Chart.js), CandlestickChart, Gauge, Heatmap, Sparkline, TreeMap, Diagram (SVG-flow), Map (Leaflet), QRCode, Barcode — datagedreven beelden uit je eigen datasets.
Componenten bekijken →Form, Edit, Memo, CheckBox, RadioGroup, Select, MultiSelect, InputGroup, AutoComplete, DatePicker, TimePicker, ColorPicker, Slider, FileUpload, RichEditor, Rating, SignaturePad, Transfer.
Componenten bekijken →Panel, StatCard, Accordion, Carousel, Image, Avatar, Video, Badge, PDFViewer — cards, media en KPI-tegels voor dashboards.
Componenten bekijken →Modal, Offcanvas, Popover, Toast, Snackbar, Notification, Spinner, Placeholder, ContextMenu, ProgressBar, JobProgress, LogViewer — dialoogvensters en statusvlakken.
Componenten bekijken →ChatBox, Chat (WhatsApp-stijl), AIChat met providerkeuze, token-streaming en RAG-bronvermeldingen, Presence voor live onlinestatus.
Componenten bekijken →Login, SocialLogin (OAuth), OAuthCallback, WebAuthnLogin (passkeys), UserManagement, RolesPermissions — kant-en-klare aanmeldflows en beheerschermen.
Componenten bekijken →EngineServer, HTMXEngine, PageBuilder, TemplateBootstrap, ThemeController, ThemeBuilder, HTMXFragment, HTMXRouter — de niet-visuele onderdelen die pagina's serveren en live houden.
Componenten bekijken →Start een HTTP-server, koppel de htmx-engine en beantwoord verzoeken met een pagina die uit componenten is opgebouwd. Dezelfde API in Delphi, C++ Builder en .NET.
uses
sgcWebSocket_Server, sgcHTMX_Engine_Server,
sgcHTML_Template_Bootstrap, sgcHTML_Component_Chart;
// 1. Start a server and attach the htmx engine
FServer := TsgcWSHTTPServer.Create(nil);
FServer.Port := 8080;
FServer.OnCommandGet := HandleGet;
FHTMX := TsgcHTMX_Engine_Server.Create(nil);
FHTMX.Server := FServer; // realtime htmx over WebSocket
FServer.Active := True;
// 2. Build the page from components
function TForm1.BuildDashboard: string;
var
oChart: TsgcHTMLComponent_Chart;
oPage: TsgcHTMLTemplate_Bootstrap;
begin
oChart := TsgcHTMLComponent_Chart.Create(nil);
oPage := TsgcHTMLTemplate_Bootstrap.Create(nil);
try
oChart.ChartType := ctBar;
oChart.AddLabel('Q1'); oChart.AddLabel('Q2'); oChart.AddLabel('Q3');
oChart.AddDataset('Revenue', [1200, 1900, 1500],
'#7C3AED', 'rgba(124,58,237,.25)', True);
oPage.Title := 'Dashboard';
oPage.BodyContent := oChart.HTML; // component -> HTML
Result := oPage.GetHTML; // full Bootstrap document
finally
oPage.Free;
oChart.Free;
end;
end;
// includes: sgcWebSocket_Server.hpp, sgcHTMX_Engine_Server.hpp,
// sgcHTML_Template_Bootstrap.hpp, sgcHTML_Component_Chart.hpp
// 1. Start a server and attach the htmx engine
FServer = new TsgcWSHTTPServer(this);
FServer->Port = 8080;
FServer->OnCommandGet = HandleGet;
FHTMX = new TsgcHTMX_Engine_Server(this);
FHTMX->Server = FServer; // realtime htmx over WebSocket
FServer->Active = true;
// 2. Build the page from components
String __fastcall TForm1::BuildDashboard()
{
TsgcHTMLComponent_Chart *oChart = new TsgcHTMLComponent_Chart(NULL);
TsgcHTMLTemplate_Bootstrap *oPage = new TsgcHTMLTemplate_Bootstrap(NULL);
try
{
oChart->ChartType = ctBar;
oChart->AddLabel("Q1"); oChart->AddLabel("Q2"); oChart->AddLabel("Q3");
oChart->AddDataset("Revenue", OPENARRAY(double, (1200, 1900, 1500)),
"#7C3AED", "rgba(124,58,237,.25)", true);
oPage->Title = "Dashboard";
oPage->BodyContent = oChart->HTML; // component -> HTML
return oPage->GetHTML(); // full Bootstrap document
}
__finally
{
delete oPage;
delete oChart;
}
}
using esegece.sgcWebSockets;
// 1. Start a server and attach the htmx engine
var server = new TsgcWebSocketHTTPServer();
server.Port = 8080;
server.OnCommandGet += HandleGet;
var htmx = new TsgcHTMX_Engine_Server();
htmx.Server = server; // realtime htmx over WebSocket
server.Active = true;
// 2. Build the page from components
string BuildDashboard()
{
var chart = new TsgcHTMLComponent_Chart();
chart.ChartType = TsgcHTMLChartType.ctBar;
chart.AddLabel("Q1"); chart.AddLabel("Q2"); chart.AddLabel("Q3");
chart.AddDataset("Revenue", new double[] { 1200, 1900, 1500 },
"#7C3AED", "rgba(124,58,237,.25)", true);
var page = new TsgcHTMLTemplate_Bootstrap();
page.Title = "Dashboard";
page.BodyContent = chart.HTML; // component -> HTML
return page.GetHTML(); // full Bootstrap document
}
Grijp naar kant-en-klare componenten als je een widget in één regel wilt, of zak naar de node-laag als je volledige controle over de markup nodig hebt.
De 89 TsgcHTMLComponent_*-widgets. Configureer eigenschappen, bind optioneel een dataset en lees HTML uit. Veel ervan bieden ook een statische Build(...)-helper voor inline gebruik in één regel.
Primitieven zoals TsgcHTMLContainer (met een Void-vlag voor zelfsluitende tags), TsgcHTMLCard, TsgcHTMLForm, TsgcHTMLField, TsgcHTMLButton en TsgcHTMLTable stel je samen tot elke lay-out, die je vervolgens rendert met TsgcHTMLTemplate_Bootstrap. De node-set bevat ook Bootstrap-bouwstenen zoals TsgcHTMLModal, TsgcHTMLOffcanvas, TsgcHTMLAccordion, TsgcHTMLCarousel, TsgcHTMLToast, TsgcHTMLProgress, TsgcHTMLSpinner, TsgcHTMLListGroupNode, TsgcHTMLInputGroup, TsgcHTMLButtonGroupNode, TsgcHTMLRadio, TsgcHTMLBreadcrumb, TsgcHTMLNavbarNode en TsgcHTMLImage.
TsgcHTMLPageBuilder met zijn design-time-editor laat je pagina's samenstellen in de IDE, terwijl TsgcHTMLThemeController de lichte/donkere thema's voor de hele app beheert.
Met sgcCustomization HTML beschrijf je de applicatie die je nodig hebt en het eSeGeCe-team bouwt deze voor je met de sgcHTML + sgcWebSockets-componenten. Drie eenmalige pakketten vanaf €149, en je ontvangt een compleet project dat je kunt compileren, uitbreiden en herstylen met je gelicentieerde componenten.
Heb je al een webapplicatie gebouwd met IntraWeb, uniGUI, TMS WEB Core, Elevate Web Builder of D2Bridge? Stapsgewijze gidsen loodsen je door de overstap naar sgcHTML, met een conceptmapping voor elk framework. Er is ook een migratiehulpformulier als je wilt dat ons team de overstap helpt plannen of uitvoert.
Combineer sgcHTML met onze andere component-bibliotheken voor Delphi, C++ Builder en .NET.
Enterprise-componenten voor WebSocket, HTTP/2, MQTT, AMQP, WebRTC en AI/LLM. sgcHTML wordt geserveerd over dezelfde krachtige HTTP- en WebSocket-servers.
Meer informatie →QUIC- en HTTP/3-client- en servercomponenten voor Delphi, C++ Builder en .NET. Serveer de gerenderde UI van sgcHTML via HTTP/3 voor paginalaadtijden met lagere latentie op netwerken met pakketverlies.
Meer informatie →Digitale handtekeningen op enterpriseniveau — XAdES, PAdES, CAdES en ASiC met 10 sleutelproviders en 21 EU-landprofielen.
Meer informatie →OpenAPI 3.0-parser en SDK-generator. Zet elke OpenAPI-spec in seconden om in een sterk getypeerde Delphi-client.
Meer informatie →Native componenten voor Windows Hello, vingerafdruk en het Windows Biometric Framework voor Delphi en C++ Builder.
Meer informatie →