Crie UIs web modernas e completas diretamente a partir de Delphi, C++ Builder e .NET. sgcHTML é um framework de componentes server-side com 89 widgets prontos e data-aware — gráficos, grids, formulários, dashboards, chat e muito mais — que se vinculam diretamente a um TDataSet, renderizam para markup Bootstrap 5 e permanecem interativos através do htmx. Você escreve Object Pascal ou C#, e o sgcHTML escreve o HTML, CSS e JavaScript.
O sgcHTML transforma seu back end existente em Delphi, C++ Builder ou .NET em um servidor de aplicações web. Cada componente é uma classe nativa que emite HTML Bootstrap 5; o htmx mantém a página interativa e ao vivo sem uma única linha de JavaScript escrito à mão.
Cada widget é uma classe — TsgcHTMLComponent_Chart, TsgcHTMLComponent_Grid, TsgcHTMLComponent_Form e mais 86. Defina suas propriedades e então leia a propriedade HTML para obter markup Bootstrap 5 limpo e pronto para servir.
Adicione um TsgcHTMLEngine_Server (ou conecte o HTML a um TsgcWebSocketHTTPServer existente). As requisições chegam ao seu handler OnCommandGet; você responde com uma página construída a partir de componentes. Sem stack web externa.
O sgcHTML não está preso ao servidor sgcWebSockets. Sirva as mesmas páginas construídas a partir de componentes em qualquer aplicação WebBroker da Embarcadero via TsgcHTMX_Engine_Server_WebBroker, ou em um servidor DataSnap com push ao vivo por WebSocket na mesma porta dos seus endpoints REST.
Adicione um TsgcHTMX_Engine_Server e cliques, envios de formulários e atualizações ao vivo fazem round-trip para seus handlers de eventos Pascal/C#. O servidor troca fragmentos de HTML no lugar — a sensação de SPA, sem nada da cadeia de build de JavaScript.
Como o htmx roda sobre o servidor sgcWebSockets, você pode enviar HTML ao vivo para cada navegador conectado. Dashboards, monitores e janelas de chat atualizam no instante em que seus dados mudam — orientado pelo servidor, sem polling.
TsgcHTMLTemplate_Bootstrap envolve seu conteúdo em um documento responsivo completo; TsgcHTMLThemeController e TsgcHTMLThemeBuilder fornecem temas claro/escuro e uma folha de estilos compartilhada. Bootstrap 5.3 e htmx vêm embutidos — sem CDN em tempo de execução.
Grid, DataTable, Chart, Select, TreeView, Scheduler, Timeline e Form se vinculam diretamente a um TDataSet via LoadFromDataSet / DataSource. Aponte um componente para uma consulta e ele renderiza as linhas.
O sgcHTML traz textos de UI integrados (botões, labels, mensagens de validação) em 17 idiomas: inglês, espanhol, francês, alemão, português, italiano, holandês, sueco, norueguês, polonês, tcheco, turco, russo, chinês, japonês, coreano e árabe. Escolha um com sgcHTMLSetLanguage e os componentes são renderizados no idioma do visitante com os scripts nativos corretos, incluindo CJK, cirílico e árabe.
Cada componente encaminha seu texto dinâmico, atributos, JavaScript inline e URLs através de codificação automática de HTML, atributos, JavaScript e URL, além de sanitização de URL (sgcHTMLEncode, sgcHTMLAttrEncode, sgcJSEncode, sgcHTMLSanitizeURL), de modo que os dados do usuário não conseguem escapar do seu contexto e injetar script. A proteção contra XSS e injeção fica ativa sem trabalho extra.
Da estrutura de navegação a data grids, gráficos, formulários, overlays e chat de IA — todo o vocabulário Bootstrap 5 como componentes nativos. Cada um leva à sua própria página com exemplos em Delphi, C++ Builder e .NET.
NavBar, Sidebar, Breadcrumb, Tabs, Pagination, Toolbar, TreeView, Stepper, Dropdown, ButtonGroup, ListGroup, DashboardLayout, Splitter.
Ver componentes →Grid, DataTable, TreeGrid, PivotTable, Calendar, Scheduler, Timeline, ActivityFeed, KanbanBoard, Gantt — ordenáveis, filtráveis, exportáveis, vinculados a dataset.
Ver componentes →Chart (Chart.js), CandlestickChart, Gauge, Heatmap, Sparkline, TreeMap, Diagram (fluxo SVG), Map (Leaflet), QRCode, Barcode — visuais orientados a dados a partir dos seus próprios datasets.
Ver componentes →Form, Edit, Memo, CheckBox, RadioGroup, Select, MultiSelect, InputGroup, AutoComplete, DatePicker, TimePicker, ColorPicker, Slider, FileUpload, RichEditor, Rating, SignaturePad, Transfer.
Ver componentes →Panel, StatCard, Accordion, Carousel, Image, Avatar, Video, Badge, PDFViewer — cards, mídia e blocos de KPI para dashboards.
Ver componentes →Modal, Offcanvas, Popover, Toast, Snackbar, Notification, Spinner, Placeholder, ContextMenu, ProgressBar, JobProgress, LogViewer — diálogos e superfícies de status.
Ver componentes →ChatBox, Chat (estilo WhatsApp), AIChat com seletor de provedor, streaming de tokens e citações de fontes RAG, Presence para status online ao vivo.
Ver componentes →Login, SocialLogin (OAuth), OAuthCallback, WebAuthnLogin (passkeys), UserManagement, RolesPermissions — fluxos de login prontos e telas de administração.
Ver componentes →EngineServer, HTMXEngine, PageBuilder, TemplateBootstrap, ThemeController, ThemeBuilder, HTMXFragment, HTMXRouter — as peças não visuais que servem as páginas e as mantêm ao vivo.
Ver componentes →Inicie um servidor HTTP, anexe o motor htmx e responda às requisições com uma página construída a partir de componentes. A mesma API em Delphi, C++ Builder e .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
}
Use componentes prontos quando quiser um widget em uma linha, ou desça para a camada de nós quando precisar de controle total sobre o markup.
Os 89 widgets TsgcHTMLComponent_*. Configure as propriedades, opcionalmente vincule um dataset, leia HTML. Muitos também expõem um helper estático Build(...) para uso inline em uma linha.
Primitivos como TsgcHTMLContainer (com uma flag Void para tags autofecháveis), TsgcHTMLCard, TsgcHTMLForm, TsgcHTMLField, TsgcHTMLButton e TsgcHTMLTable se compõem em qualquer layout e então renderizam com TsgcHTMLTemplate_Bootstrap. O conjunto de nós também inclui blocos de construção do Bootstrap como TsgcHTMLModal, TsgcHTMLOffcanvas, TsgcHTMLAccordion, TsgcHTMLCarousel, TsgcHTMLToast, TsgcHTMLProgress, TsgcHTMLSpinner, TsgcHTMLListGroupNode, TsgcHTMLInputGroup, TsgcHTMLButtonGroupNode, TsgcHTMLRadio, TsgcHTMLBreadcrumb, TsgcHTMLNavbarNode e TsgcHTMLImage.
TsgcHTMLPageBuilder com seu editor em tempo de design permite montar páginas na IDE, enquanto TsgcHTMLThemeController gerencia o tema claro/escuro em toda a aplicação.
Com o sgcCustomization HTML você descreve a aplicação de que precisa e a equipe eSeGeCe a constrói para você com os componentes sgcHTML + sgcWebSockets. Três pacotes únicos a partir de €149, e você recebe um projeto completo que pode compilar, estender e reestilizar com seus componentes licenciados.
Já tem uma aplicação web construída com IntraWeb, uniGUI, TMS WEB Core, Elevate Web Builder ou D2Bridge? Guias passo a passo mostram como movê-la para o sgcHTML, com um mapeamento de conceitos para cada framework. Há também um formulário de assistência à migração se você quiser que nossa equipe ajude a planejar ou faça a mudança.
Combine o sgcHTML com nossas outras bibliotecas de componentes para Delphi, C++ Builder e .NET.
Componentes corporativos de WebSocket, HTTP/2, MQTT, AMQP, WebRTC e IA/LLM. O sgcHTML é servido sobre os mesmos servidores HTTP e WebSocket de alto desempenho.
Saiba mais →Componentes cliente e servidor QUIC e HTTP/3 para Delphi, C++ Builder e .NET. Sirva a UI renderizada do sgcHTML sobre HTTP/3 para carregamentos de página com menor latência em redes com perdas de pacotes.
Saiba mais →Assinaturas digitais corporativas — XAdES, PAdES, CAdES e ASiC com 10 provedores de chaves e 21 perfis de países da UE.
Saiba mais →Parser OpenAPI 3.0 e gerador de SDK. Transforme qualquer especificação OpenAPI em um cliente Delphi fortemente tipado em segundos.
Saiba mais →Componentes nativos de Windows Hello, impressão digital e Windows Biometric Framework para Delphi e C++ Builder.
Saiba mais →