https://htmx.org logo
Join Discord
Powered by
# htmx-general
  • m
    Yeah, I am all for LOB. Many years ago I refactored the entire codebase of my products for separation of concerns because CSS styles and Javascript just could not be mixed together with HTML 🤦‍♂️ Now I am trying to go back to something simple with htmx and tailwind css, and maybe Alpine if needed.
  • m
    There are definitely tradeoffs, but for front end code I think it's the right thing
  • f
    I'm not sure what I was doing wrong before, but after spending a while reading the htmx source code and understanding how the different things get registered, I've now finally got hyperscript triggering on htmx:sseMessage events.
  • f
    however -- It doesn't look like the event itself is defined ...
    Copy code
    on htmx:sseMessage(event) call console.log(event)
    just prints
    Copy code
    undefined
    to the console.
  • f
    Chrome dev tools show this running:
    Copy code
    (function(){
var eventListeners = []
  eventListeners.push((function(me){var my = me;
_hyperscript.runtime.forEach( [me], function(target){
  target.addEventListener('htmx:sseMessage', function(event){
var event = event.detail.event;
var it = console.log(event)  })
})
}));
      function applyEventListenersTo(elt) { _hyperscript.runtime.applyEventListeners(this, elt) }
      return {eventListeners:eventListeners, applyEventListenersTo:applyEventListenersTo}
})()
  • f
    And the line
    Copy code
    var event = event.detail.event
    seems a little sus to me.
  • f
    Well ... changing the argument to another variable name gives the slightly-better looking
    Copy code
    var myname = event.detail.myname
    ... but it still evaluates as
    Copy code
    undefined
  • f
    Hmm.
  • f
    I need to think a bit deeper on this.
  • m
    @User I know what's going on
  • m
  • m
    when I built hyperscript initially I thought all the event attributes would be on 
    detail
    because that's where they end up on custom events
  • m
    annoying, sorry about that
  • m
    you should be able to 
    log event
    and see what's available
  • m
    and use the properties off the event symbol :/
  • m
    I appreciate you using hyperscript
  • l
    @mysterious-toddler-20573 This is probably a silly question, but what do people use for the client/server communiation in projects like Meld? Some sort of websockets?
  • m
    I would guess ajax
  • m
    but the magic is that it matches up controller URLs and content replacement for you
  • m
    so you don't have to think too much about things
  • m
  • m
    Copy code
    html
<!--HTML from anywhere-->
<div data-controller="hello">
  <input data-hello-target="name" type="text">

  <button data-action="click->hello#greet">
    Greet
  </button>

  <span data-hello-target="output">
  </span>
</div>
  • m
    that button click gets mapped to the back end controller logic, which then ends up updating the output content
  • m
    It's a fine model, but it's well beyond what htmx aspires to be.
  • b
    I played a lot with Stimulus. What I didnt get, why its better than onclick=function(getelement... ) on a single tag w/o jquery. At the end using Stimulus I had more js than before with a lot more complex html. Its quite impressing though.
  • l
    Right. Eventually it'll want to bind Julia functions to buttons. However, that should be built a layer above HTMX. Even then, I'd imagine the semantics will be hard to figure out. There are lots of things the backend function could want to do.
  • l
    I'm another few days away before I even play with HTMX more... by server-side template library is way, way too slow.
  • l
    @billions-rain-29850 frameworky things get you very productive fast, till you hit something that works against how you think they should be working.... then you're kinda screwed. It's hard to do, but really good libraries have a tight focus and excellent way to extend (often deep within critical code) to do what the original authors didn't anticipate.
  • l
    Complex problems often start out as frameworks till the conceptual model is figured out, serious encapsulation & extension is articulated, and then a transition happens to where the work becomes a library, keeping out of your way and just doing its job with very little pomp & circumstance... if it seem "easy", it's either a truly boring problem, or a ton of effort has been put into encapsulating the complexity with a easy-to-use interface and mental model.
  • f
    ^ This.
1...909192...1146Latest