Can Xano output HTML to a HTMX powered frontend?

Eddie

I'd like to use HTML, CSS and a library called HTMX for my frontend, while using Xano for my backend.

HTMX is basically a way of sprinkling some interactivity / reactivity into your frontend without having to use a JavaScript frontend framework like React or Vue. It gives you access to AJAX, CSS Transitions, WebSockets and Server Sent Events directly in HTML (using attributes).

HTMX expects to get HTML (not JSON) from the backend. Can Xano return HTML to the frontend...or can it only return JSON to the frontend?

Michael Udinski

Hi  - you can output HTML in Xano, you'd just need to use a custom header. (Utility Fuctions > HTTP Header). Then you'd want to define: Content-type: text/html

Inayet Hadi

Hi  , while attempting to provide my perspectives, I researched to confirm or enhance some of my understandings, and thank you b/c I stumbled upon  web apis and the info you could access from developer.mozilla.org website. 

I think best practices is to separate and isolate your frontend presentation from your backend infrastructure, one of the many benefits is to easily use best practices in each area without affecting the other.

I am going to tag  who heads the PRO group where we learn and solve problems to iterate fast with Xano, and  the man in Xano's leadership wanting us to be successful with Xano. I am sure others can provide their experiences. 

Ray Deck

 while this is possible per  's reply above, complex manipulation of raw text output is not where Xano shines. If you are keen on this kind of HTML injection, I'd look around at options that might allow you easier control over the raw output of an API.

Fetching information in JSON (or in older days, XML) has the profit of cleaving data from display. The front-end uses javascript to decide how to render the information into the view, without worrying about how it got made. The back-end gets and delivers information, unconcerned about how it will be displayed. I like the pattern ,because this distinction means a clearer separation of concerns (so-called model and view) between backend and frontend, and net decreases complexity and development time.

My broad advice is to build in the pattern that you find easiest! 

Eddie

Thanks for all the feedback...it's much appreciated.

In regards to 's advice to build in the pattern I find easiest:  I know HTML and CSS, but I don't know much JavaScript. So I was hoping that something like HTMX would be a good fit for me in building a frontend that can work well with a Xano backend.

It looks like HTMX has an extension that supports transforming a JSON request response into HTML via a client-side template before it is swapped into the DOM.

Is something like this likely to work well with Xano's JSON output?