Support JSX return in Bun.serve() routes with automatic static markup rendering

[hnordt]

It would be great if Bun.serve() could natively handle JSX returns and automatically convert them to static markup, without needing to import React:

Bun.serve({
  routes: {
    "/jsx": {
      POST() {
        return (
          <button hx-post="/clicked" hx-swap="outerHTML">
            {count++}
          </button>
        );
      },
    },

    "/renderToStaticMarkup": {
      POST() {
        return new Response(
          Bun.renderToStaticMarkup(
            <button hx-post="/clicked" hx-swap="outerHTML">
              {count++}
            </button>,
          ),
          {
            headers: { "Content-Type": "text/html" },
          },
        );
      },
    },
  },
});

When using htmx or similar libraries, developers often need to return HTML fragments directly from the server. f Bun could detect JSX returns automatically (for example, when jsx: "preserve" is set in tsconfig.json), it could convert the JSX into static HTML internally. This would make Bun’s server API more expressive and ergonomic, allowing a seamless mix of JSX and server-side rendering, similar to how templating engines work, but with TypeScript and JSX syntax.

[nowm]

SSR needs more love, definitely!

[suchy]

Yes yes yes! With JSX as server side templating (without react) the web app part will be complete <3

[rempas]

To my disappointment, I tried to do that today and I learned that it isn't possible.

Bun is awesome! I hope this get implemented soon so we can fully have a web framework, without extra bloat! Just transpilation to pure JS! ;)