sgcHTML Aplicaciones web, escritas en Pascal. Sin JavaScript.

Crea interfaces web completas y modernas directamente desde Delphi, C++ Builder y .NET. sgcHTML es un framework de componentes del lado del servidor con 110 widgets listos para usar: gráficos, cuadrículas, formularios, paneles, chat y más. Muchos se enlazan directamente a un TDataSet, generan marcado Bootstrap 5 y se mantienen interactivos mediante htmx. Tú escribes Object Pascal o C#, sgcHTML escribe el HTML, el CSS y el JavaScript.

¿Prefieres no construirlo tú mismo? Lo construimos por ti →
  • Delphi
  • Delphi
  • C++ Builder
  • Bootstrap 5 + htmx
  • Enlace a datos / TDataSet
  • Sin JavaScript
  • 110Componentes de UI en diez familias
  • 3Lenguajes: Delphi, C++ Builder y .NET
  • 17Idiomas de UI integrados, incluidos los de derecha a izquierda
  • 15Aplicaciones reales funcionando en línea
  • 0Líneas de JavaScript escritas a mano
Míralas funcionar

Dieciocho vídeos. Sin diapositivas.

Cada clip es una grabación de pantalla de una aplicación real en funcionamiento, narrada y con subtítulos. Elige uno de la lista. No se descarga nada hasta que pulses reproducir.

sgcHTML en dos minutos

Crea una interfaz web completa desde Delphi con componentes del lado del servidor, marcado Bootstrap 5 y htmx, sin ningún paso de compilación de JavaScript.

Demos en vivo

Quince aplicaciones reales, funcionando ahora mismo.

Quince aplicaciones reales, funcionando ahora mismo

ERP: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

ERP

ERP

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Informes y BI: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Informes y BI

Informes & BI

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Punto de venta: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Punto de venta

Punto de venta

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Servicio de campo: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Servicio de campo

Servicio de campo

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Almacén (WMS): una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Almacén (WMS)

Almacén (WMS)

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Monitor en vivo: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Monitor en vivo

Monitor en vivo

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Consola de administración: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Consola de administración

Consola de administración

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
De derecha a izquierda (RTL): una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

De derecha a izquierda (RTL)

Portal de clientes

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
Portal de clientes: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

Portal de clientes

SaaS multiinquilino

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.
SaaS multiinquilino: una aplicación web Delphi creada con sgcHTML, ejecutándose en un navegador. En vivo

SaaS multiinquilino

Un sitio de marketing público, una página de precios y un flujo de alta delante de un plano de control aislado por inquilino.

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

Más demos en línea: IA, instrumentos y SCADA

MCP Apps

Una aplicación Delphi renderizada dentro de ChatGPT, Claude o VS Code: las herramientas MCP devuelven páginas de sgcHTML que el host muestra, y sus botones siguen funcionando ahí.

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

Instruments

Una sala de control para un lazo de caldera simulado: medidores, pantallas, controles de operador, registradores gráficos y un osciloscopio mantenidos en vivo por el servidor, sin sondeo.

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

SCADA / IoT

Un mímico de una planta de agua de refrigeración con depósitos, válvulas, bombas y flujo animado, además de medidores, un registrador gráfico y alarmas, todo controlado por MQTT. En línea funciona con una planta simulada.

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

Instrumentos

Una sala de control para un circuito de caldera simulado: indicadores, displays, controles de operador, registradores de banda y un osciloscopio mantenidos en vivo por el servidor, sin sondeo.

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

SCADA / IoT

Derecha a izquierda (RTL)

Clientes, productos, proveedores y facturación, con gráficos de panel, administración por roles e inicio de sesión con passkey.

Ver todas las demos en línea →

Cómo funciona

Tú escribes Pascal o C#. sgcHTML escribe el front end.

Un panel web en unas pocas líneas

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
}
  1. Inicia un servidor, adjunta htmxUn TsgcWSHTTPServer atiende las peticiones y un TsgcHTMX_Engine_Server mantiene la página interactiva y en vivo sobre WebSocket.
  2. Construye la página a partir de componentesDefine las propiedades de un gráfico, una cuadrícula o un formulario y lee después su HTML. TsgcHTMLTemplate_Bootstrap lo envuelve en un documento responsive completo.
  3. Sírvela y envía actualizacionesLos clics y los envíos de formularios llegan a tus manejadores de eventos y el servidor intercambia fragmentos HTML en el sitio. Sin cadena de compilación de JavaScript.
Panel del ERP creado con sgcHTML para Delphi, mostrado en una ventana del navegador: tarjetas de KPI, un gráfico de barras de ingresos y una cuadrícula de facturas recientes.
El panel de la demo ERP: tarjetas de KPI, un gráfico de ingresos y una cuadrícula de facturas recientes, todo creado con componentes.

Lee la guía de primeros pasos

Bajo el capó

Tu back end se convierte en el servidor web.

sgcHTML convierte tu back end actual de Delphi, C++ Builder o .NET en un servidor de aplicaciones web. Cada componente es una clase nativa que genera HTML de Bootstrap 5, y htmx mantiene la página interactiva y en vivo sin una sola línea de JavaScript escrita a mano.

Componentes que generan HTML

Cada widget es una clase: TsgcHTMLComponent_Chart, TsgcHTMLComponent_Grid, TsgcHTMLComponent_Form y 86 más. Define sus propiedades y lee después su propiedad HTML para obtener marcado Bootstrap 5 limpio, listo para servir.

Servido por tu propio servidor

Coloca un TsgcHTMLEngine_Server (o conecta el HTML a un TsgcWebSocketHTTPServerexistente). Las peticiones llegan a tu evento OnCommandGet y respondes con una página construida a partir de componentes. Sin pila web externa.

Alojamiento en WebBroker y DataSnap

sgcHTML no está atado al servidor de sgcWebSockets. Sirve las mismas páginas construidas con componentes desde cualquier aplicación Embarcadero WebBroker mediante TsgcHTMX_Engine_Server_WebBroker, o desde un servidor DataSnap con envío WebSocket en vivo en el mismo puerto que tus endpoints REST.

Alojamiento en WebBroker y DataSnap →

Interactivo con htmx

Añade un TsgcHTMX_Engine_Server y los clics, los envíos de formularios y las actualizaciones en vivo llegan a tus manejadores de eventos en Pascal o C#. El servidor intercambia fragmentos HTML en el sitio. La sensación de una SPA, sin la cadena de compilación de JavaScript.

Tiempo real sobre WebSockets

Como htmx funciona sobre el servidor de sgcWebSockets, puedes enviar HTML en vivo a todos los navegadores conectados. Los paneles, los monitores y las ventanas de chat se actualizan en el instante en que cambian tus datos, dirigidos por el servidor y sin sondeo. Donde un proxy bloquea los WebSockets, la misma página puede recibir sus actualizaciones mediante eventos enviados por el servidor.

Temas y plantillas

TsgcHTMLTemplate_Bootstrap envuelve tu contenido en un documento responsive completo. TsgcHTMLThemeController y TsgcHTMLThemeBuilder ofrecen temas claro y oscuro y una hoja de estilos compartida. Bootstrap 5.3 y htmx se entregan integrados, sin CDN en tiempo de ejecución.

Enlace directo a la base de datos

Grid, DataTable, Chart, Select, TreeView, Scheduler, Timeline y Form se enlazan directamente a un TDataSet mediante LoadFromDataSet / DataSource. Apunta un componente a una consulta y él genera las filas.

Interfaz localizada, 17 idiomas

Textos de interfaz integrados (botones, etiquetas, mensajes de validación) en inglés, español, francés, alemán, portugués, italiano, neerlandés, sueco, noruego, polaco, checo, turco, ruso, chino, japonés, coreano y árabe. Elige uno con sgcHTMLSetLanguage. El árabe y el hebreo voltean toda la página de derecha a izquierda automáticamente: dir="rtl", la hoja de estilos RTL de Bootstrap y componentes reflejados, sin cambios de código.

Salida segura por defecto

Cada componente pasa su texto dinámico, sus atributos, su JavaScript en línea y sus URL por una codificación automática y una sanitización de URL (sgcHTMLEncode, sgcHTMLAttrEncode, sgcJSEncode, sgcHTMLSanitizeURL), de modo que los datos del usuario no pueden salirse de su contexto ni inyectar scripts.

Biblioteca de componentes

110 componentes, diez familias.

Desde la navegación hasta las cuadrículas de datos, los gráficos, los formularios, las superposiciones y el chat con IA, todo el vocabulario de Bootstrap 5 como componentes nativos. Cada uno enlaza a su propia página con ejemplos para Delphi, C++ Builder y .NET.

Ver →
  • NavBar
  • Sidebar
  • Ruta de navegación
  • Tabs
  • Pagination
  • Toolbar
  • TreeView
  • Stepper
  • Dropdown
  • ButtonGroup
  • ListGroup
  • DashboardLayout
  • Splitter

Datos y tablas

Ver →
  • Grid
  • DataTable
  • TreeGrid
  • PivotTable
  • Calendar
  • Scheduler
  • Timeline
  • ActivityFeed
  • KanbanBoard
  • Gantt

Ordenables, filtrables, exportables y enlazados a datasets.

Gráficos y visualización

Ver →
  • Chart (Chart.js)
  • CandlestickChart
  • Gauge
  • Heatmap
  • Sparkline
  • TreeMap
  • Diagram (flujo SVG)
  • Map (Leaflet)
  • QRCode
  • Barcode

Visuales basados en tus propios conjuntos de datos.

Formularios y entradas

Ver →
  • Form
  • Edit
  • Memo
  • CheckBox
  • RadioGroup
  • Select
  • MultiSelect
  • InputGroup
  • AutoComplete
  • DatePicker
  • TimePicker
  • ColorPicker
  • Slider
  • FileUpload
  • RichEditor
  • Rating
  • SignaturePad
  • Transfer

Contenido y diseño

Ver →
  • Panel
  • StatCard
  • Accordion
  • Carousel
  • Image
  • Avatar
  • Video
  • Badge
  • PDFViewer

Tarjetas, contenido multimedia y mosaicos de KPI para paneles.

Superposiciones y comentarios

Ver →
  • Modal
  • Offcanvas
  • Popover
  • Toast
  • Snackbar
  • Notification
  • Spinner
  • Placeholder
  • ContextMenu
  • ProgressBar
  • JobProgress
  • LogViewer

Diálogos y superficies de estado.

Chat e IA

Ver →
  • ChatBox
  • Chat (estilo WhatsApp)
  • AIChat
  • Presence

AIChat con selector de proveedor, streaming de tokens y citas de fuentes RAG, y Presence para el estado en línea en vivo.

Autenticación

Ver →
  • Login
  • SocialLogin (OAuth)
  • OAuthCallback
  • WebAuthnLogin (passkeys)
  • UserManagement
  • RolesPermissions

Flujos de inicio de sesión y pantallas de administración listos para usar.

Instrumentos y SCADA

Ver →
  • Gauge
  • LinearGauge
  • LED
  • LEDBar
  • SegmentDisplay
  • Odometer
  • AnalogClock
  • Compass
  • VUMeter
  • Knob
  • ToggleSwitch
  • PushButton
  • NumericStepper
  • StripChart
  • Oscilloscope
  • Annunciator
  • SCADAPanel

Paneles de sala de control mantenidos en vivo por el servidor, con enlace MQTT.

Infraestructura y motor

Ver →
  • EngineServer
  • HTMXEngine
  • PageBuilder
  • TemplateBootstrap
  • ThemeController
  • ThemeBuilder
  • HTMXFragment
  • HTMXRouter

Las piezas no visuales que sirven las páginas y las mantienen en vivo.

Ver la matriz completa de características

Recién añadido

Novedades de sgcHTML.

Cada novedad está desactivada hasta que la uses, así que una página que no use ninguna se genera exactamente igual que antes. La lista completa está en la matriz de características.

Tu página dentro de ChatGPT y Claude

Una herramienta MCP responde con una página en lugar de texto, construida con los mismos componentes que usas en cualquier página web y mostrada por ChatGPT, Claude y VS Code. Requiere la edición Enterprise o All-Access, o el pack sgcAI.

Ver MCPApp →

Generador de páginas con IA

Describe una página o entrega una captura de pantalla al diseñador, y construye la página con tus propios componentes. Responde a partir de un esquema construido desde tu registro, por lo que no puede nombrar una clase que no le hayas ofrecido, y no se aplica nada hasta que lo aceptes. Necesita las unidades de IA de la edición Enterprise o All-Access, o el pack sgcAI.

Lee la guía →

CRUD como un solo componente

El listado, la búsqueda, la paginación, el formulario, el borrado y la ruta de escritura de una tabla como un único componente, sobre un dataset o sobre tu propio SQL. Un asistente del IDE lo crea.

Ver CRUD →

Hazle una pregunta a una cuadrícula

Una pregunta en lenguaje natural se convierte en filtros, ordenaciones, agrupaciones y resaltados, validados contra tus propias columnas antes de aplicar nada. Funciona sin clave de API mediante un analizador integrado, y con siete proveedores cuando las unidades de IA están en tu edición.

Ver AIAssistant →

Llega a un navegador cerrado

Eventos enviados por el servidor para redes que bloquean los WebSockets, Web Push para un navegador que no está en ejecución, una bandeja de notificaciones y una tabla de preferencias. Web Push requiere la edición Enterprise o All-Access.

Ver WebPush →

Sesiones, enrutamiento y pruebas

Sesiones por cookie, tokens CSRF, limitación de intentos de inicio de sesión y protección de rutas por rol. Parámetros de ruta y filtros de método en las rutas, navegación de página única desde la plantilla de página y helpers para probar el marcado que generas.

Ver Auth →
Para desarrolladores .NET

ASP.NET Core Razor Tag Helpers.

Si creas aplicaciones ASP.NET Core MVC o Razor Pages al estilo de Telerik o DevExpress, sgcHTML ahora habla el mismo idioma. Tag Helpers como <sgc-grid>, <sgc-form>, <sgc-dialog> y <sgc-chart>, y sus gemelos fluidos en Html.Sgc(), generan HTML Bootstrap 5 en el servidor y se comunican con tus controladores mediante htmx. No hay que aprender ningún framework de JavaScript ni escribir ningún origen de datos JSON. La capa Razor se distribuye en el paquete esegece.sgcHTML.AspNetCore NuGet, edición Community incluida, y llegará en la próxima versión.

@* Views/Orders/Index.cshtml, page 1 renders inline from the model *@
@model IQueryable<OrderRow>

<sgc-grid name="orders" key="Id" items="Model"
          asp-action="Read" asp-export-action="Export" export="xlsx,pdf"
          page-size="15" sortable="true" filterable="true"
          searchable="true" push-url="true">
    <sgc-column field="Reference" searchable="true" />
    <sgc-column field="Customer" searchable="true" />
    <sgc-column field="OrderDate" title="Date" format="{0:yyyy-MM-dd}" filter="range" />
    <sgc-column field="Total" format="{0:N2}" align="right" filter="range" />
    <sgc-column field="Paid" />
</sgc-grid>
// Program.cs
builder.Services.AddControllersWithViews();
builder.Services.AddSgcHtml(o => o.ServeRootPage = false);  // the MVC app owns "/"
builder.Services.AddSgcHtmlRazor();   // SgcDataRequest binder, grid state, /sgcHTML.css
// ...
app.UseWebSockets();   // before UseSgcHtml, needed by live charts
app.UseSgcHtml();
app.MapDefaultControllerRoute();

// Controllers/OrdersController.cs
public class OrdersController : Controller
{
    private readonly ShopDb FDb;

    public OrdersController(ShopDb db) { FDb = db; }

    // An IQueryable projection: EF Core turns paging, sort and filters into SQL.
    private IQueryable<OrderRow> Rows() =>
        FDb.Orders.AsNoTracking().Select(o => new OrderRow
        {
            Id = o.Id, Reference = o.Reference, Customer = o.Customer.Name,
            OrderDate = o.OrderDate, Total = o.Total, Paid = o.Paid
        });

    public IActionResult Index() => View(Rows());

    // Every page, sort, filter and search click of the grid lands here.
    public IActionResult Read(SgcDataRequest request) => this.SgcGrid(request, Rows());

    // The toolbar export links: the filtered and sorted rows as XLSX or PDF.
    public IActionResult Export(SgcDataRequest request) =>
        this.SgcGridExport(request, Rows(), "orders");
}
@* The same grid with the fluent builder, the twin of Html.Kendo().Grid<T>() *@
@(Html.Sgc().Grid<OrderRow>("orders")
    .Key(o => o.Id)
    .Columns(c =>
    {
        c.Bound(o => o.Reference).Searchable();
        c.Bound(o => o.Customer).Searchable();
        c.Bound(o => o.OrderDate).Title("Date").Format("{0:yyyy-MM-dd}").Filter(SgcGridFilterKind.Range);
        c.Bound(o => o.Total).Format("{0:N2}").Align("right").Filter(SgcGridFilterKind.Range);
        c.Bound(o => o.Paid);
    })
    .Items(Model)
    .Read("Read")
    .Export(SgcExportFormat.Xlsx, SgcExportFormat.Pdf)
    .ExportAction("Export")
    .Pageable(15)
    .Sortable().Filterable().Searchable().PushUrl())
@* _Layout.cshtml: live="ws" opens the WebSocket that live charts listen to *@
<sgc-scripts live="ws" />

@* The view *@
<sgc-chart name="live-orders" type="line" height="260" live="true">
    <sgc-series name="Orders / s" data="new double[] { 0 }" color="#dc3545" />
</sgc-chart>
// builder.Services.AddHostedService<LiveSalesFeed>();
public sealed class LiveSalesFeed : BackgroundService
{
    private readonly ISgcHtmlHub FHub;
    private readonly Queue<string> FLabels = new Queue<string>();
    private readonly Queue<double> FValues = new Queue<double>();

    public LiveSalesFeed(ISgcHtmlHub hub) { FHub = hub; }

    protected override async Task ExecuteAsync(CancellationToken stoppingToken)
    {
        var oRandom = new Random();
        while (!stoppingToken.IsCancellationRequested)
        {
            await Task.Delay(1000, stoppingToken);
            FLabels.Enqueue(DateTime.Now.ToString("HH:mm:ss"));
            FValues.Enqueue(oRandom.Next(0, 20));
            if (FValues.Count > 20) { FLabels.Dequeue(); FValues.Dequeue(); }

            // One WebSocket message redraws the chart in every open browser.
            await FHub.BroadcastChartAsync("live-orders", FLabels.ToArray(),
                new SgcChartSeries("Orders / s", FValues.ToArray(), "#dc3545"));
        }
    }
}

Una cuadrícula sobre IQueryable

<sgc-grid> pagina, ordena, filtra (texto y rango), busca y exporta a XLSX y PDF en el servidor. El controlador responde con this.SgcGrid(request, query), y EF Core convierte cada clic en SQL parametrizado. push-url mantiene la página, la ordenación y los filtros en la barra de direcciones, de modo que la recarga y el botón de retroceso funcionan.

Formularios enlazados con asp-for

<sgc-textbox>, <sgc-select>, <sgc-datepicker>, <sgc-checkbox> y <sgc-autocomplete> se enlazan a tu modelo con asp-for y muestran los errores de ModelState bajo cada entrada. <sgc-form hx="true"> envía por htmx, y this.SgcRedirect(url) navega tras un guardado válido.

Cualquier elemento con sgc-dialog="name" carga su URL en un <sgc-dialog>. Tras un envío válido, this.SgcCloseDialog("edit-order", refresh: "orders") cierra el diálogo y recarga la cuadrícula, el patrón de edición emergente sin ningún script propio.

Gráficos en vivo, sin SignalR

<sgc-chart> muestra datos estáticos, sondea una acción con refresh-every="5s", o pasa a live="true": un servicio en segundo plano llama a hub.BroadcastChartAsync(...) y todos los navegadores abiertos se redibujan mediante el WebSocket de sgcHTML. Los gráficos de Telerik y DevExpress necesitan infraestructura SignalR para el envío desde el servidor, sgcHTML lo trae integrado.

¿Vienes de Telerik UI for ASP.NET Core o de DevExpress? [DataSourceRequest] pasa a ser SgcDataRequest, ToDataSourceResult pasa a ser this.SgcGrid(request, query) (o query.ToSgcDataResult(request) solo para los datos), y Html.Kendo().TextBoxFor(m => m.X) pasa a ser Html.Sgc().TextBoxFor(m => m.X). La demo MVC ejecutable, 22.RazorMvc, es el ejemplo de pedidos de Telerik escrito con sgcHTML sobre EF Core.

Dos capas de API

Componentes de alto nivel o nodos de bajo nivel.

Componentes de alto nivel o nodos de bajo nivel

Capa de componentes

Los 110 TsgcHTMLComponent_* widgets. Configura las propiedades, enlaza opcionalmente un dataset y lee HTML. Muchos exponen además un helper estático Build(...) para uso en línea de una sola línea.

Capa de nodos / composición

Primitivas como TsgcHTMLContainer (con un indicador Void para etiquetas autocerradas), TsgcHTMLCard, TsgcHTMLForm, TsgcHTMLField, TsgcHTMLButton y TsgcHTMLTable se componen en cualquier diseño y se renderizan después con TsgcHTMLTemplate_Bootstrap. El conjunto de nodos incluye también bloques de construcción de Bootstrap como TsgcHTMLModal, TsgcHTMLOffcanvas, TsgcHTMLAccordion, TsgcHTMLCarousel, TsgcHTMLToast, TsgcHTMLProgress, TsgcHTMLSpinner, TsgcHTMLListGroupNode, TsgcHTMLInputGroup, TsgcHTMLButtonGroupNode, TsgcHTMLRadio, TsgcHTMLBreadcrumb, TsgcHTMLNavbarNode y TsgcHTMLImage.

Constructor visual de páginas

TsgcHTMLPageBuilder con su editor en tiempo de diseño permite montar páginas en el IDE, mientras que TsgcHTMLThemeController gestiona los temas claro y oscuro en toda la aplicación.

Tres formas de empezar

Empieza desde donde estás.

¿No quieres construirlo tú mismo?

Con sgcCustomization HTML describes la aplicación que necesitas y el equipo de eSeGeCe la construye por ti con los componentes sgcHTML + sgcWebSockets. Tres paquetes de pago único desde €149, y recibes un proyecto completo que puedes compilar, ampliar y restilizar con tus componentes con licencia.

¿Ya usas WebBroker o DataSnap?

Sirve las mismas páginas construidas con componentes desde cualquier aplicación Embarcadero WebBroker, o desde un servidor DataSnap con envío WebSocket en vivo en el mismo puerto que tus endpoints REST.

TESTIMONIOS

Qué dicen los desarrolladores

La confianza de desarrolladores de Delphi, C++ Builder, Lazarus y .NET que construyen aplicaciones en tiempo real en todo el mundo.

Vuestra librería sgcWebSockets es muy útil y fácil de configurar. ¡Seguid así!
Simone Moretti Desarrollador Delphi
sgcWebSockets es increíble y vuestro soporte es el mejor.
Christian Meyer Fundador y CTO
Muchas gracias por vuestra ayuda y soporte, me encantan vuestros componentes.
Mark Steinfeld CTO

Lanza una interfaz web sin salir de tu IDE.

Añade gráficos, cuadrículas, formularios, paneles y páginas en tiempo real a tu aplicación Delphi, C++ Builder o .NET, con el lenguaje que ya usas.

Más de eSeGeCe

Otros productos de eSeGeCe

Combina sgcHTML con nuestras otras bibliotecas de componentes para Delphi, C++ Builder y .NET.

sgcWebSockets

Componentes empresariales de WebSocket, HTTP/2, MQTT, AMQP, WebRTC e IA/LLM. Añade mensajería en tiempo real y la pila de red completa a tu aplicación sgcHTML.

sgcQUIC

Componentes cliente y servidor QUIC y HTTP/3 para Delphi, C++ Builder y .NET. Sirve la UI renderizada de sgcHTML sobre HTTP/3 para cargas de página con menor latencia en redes con pérdidas.

sgcWebRTC

Motor WebRTC completo para Delphi y C++ Builder: llamadas de audio/vídeo, canales de datos y compartición de pantalla. Un complemento para sgcWebSockets Enterprise.

sgcSign

Firmas digitales empresariales: XAdES, PAdES, CAdES y ASiC con 10 proveedores de claves y 21 perfiles por país de la UE.

sgcOpenAPI

Parser de OpenAPI 3.0 y generador de SDK. Convierte cualquier especificación OpenAPI en un cliente Delphi fuertemente tipado en segundos.

sgcBiometrics

Componentes nativos de Windows Hello, huella dactilar y Windows Biometric Framework para Delphi y C++ Builder.

sgcIndy

Componentes Indy TCP/IP actualizados con TLS moderno, IPv6 y compatibilidad con HTTP/2 para Delphi 7 a 13.

sgcAI

15 componentes de IA, LLM y MCP para Delphi y C++ Builder. Un único componente de chat llega a OpenAI, Anthropic, Gemini, DeepSeek, Ollama, Grok y Mistral. Producto independiente, incluye el runtime de sgcWebSockets Core.

sgcMQ

Componentes cliente de MQTT 3.1.1 y 5.0, AMQP 0.9.1, AMQP 1.0, Apache Kafka y STOMP para Delphi y C++ Builder. Producto independiente, incluye el runtime de sgcWebSockets Core.

sgcCrypto

Biblioteca de criptografía de propósito general para Delphi y C++ Builder: cifrado simétrico y asimétrico, funciones hash y algoritmos post-cuánticos. Se incluye gratis desde sgcWebSockets Standard.

sgcSocial

Clientes de WhatsApp Business Cloud API y de Telegram TDLib. Producto independiente, incluye el runtime de sgcWebSockets Core.

Lo último del blog

Ver todas las publicaciones →

Estás viendo la vista sgcHTML de eSeGeCe.

Muéstrame otro enfoque →
Garantía de devolución de 30 días¿No estás satisfecho? Solicita un reembolso completo en los 30 días posteriores a la compra. Ver política de reembolso