Wire up Elm lang and Semantic UI

Question

How easy is it to use ready-made jQuery plugins in Elm? I'm just starting to learn Elm lang and I'm curious if it's possible to use Semantic UI's dropdowns in my application. How should one approach such task? Without libraries like Semantic UI it's pretty hard to make proper dropdowns for mobile, for example, and writing all that code from scratch seems like reinventing the wheel.

Answer 1

It's not a good idea. Elm is pure. That means for any given state, we can generate the UI. And to programatically change the UI, the state must change.
The entire reason for using Elm is because of the belief that impurity is difficult to reason about, and purity is preferred.

jQuery makes it possible for an action to directly read & modify the UI without changing the application state. It's impure.

Thus Elm and jQuery are fundamentally at odds and you will likely get into a mess trying to get the two to work together.

Probably the easiest way to proceed is find a CSS library that doesn't require JS, that gives you a reasonable set of components to work with (e.g. http://purecss.io/) and use Elm in conjunction with that.

Answer 2

I don't know about jQuery specifically, but Elm has a Ports / Interop System specifically for using existing Javascript libraries and avoiding re-inventing too many wheels. I haven't use it but it might fit your needs.