Learning elm without prior frontend experience

tl;dr Is it possible to learn elm for frontend with no prior experience with frontend development?

I am a backend engineer mostly working with python/go/rust for creating APIs. I have some understanding of how the web frontend (HTML/CSS/JS) works, but working with UIs have never really attracted me. Specially, structuring and styling web pages always seemed like a hack to me. I did learn some JS 4-5 years ago, but not so much since then.

I am now really interested in learning a functional language. Learning frontend has also been in my bucket list for long time.

So I was wondering if I can learn elm and frontend (frontend with elm) at the same time? That would give me a way to not seriously learn CSS/JS (which I actually don’t want do).

Or is it a bad idea?

(I’ll probably still try elm. Just wanted to know other’s opinions.)

IMO you should learn HTML5 in detail first. There are important technical reasons (especially in accessibility and SEO) for doing HTML “right” and you should incorporate those into your elm code rather than try to claim that you don’t need them if you have elm. (This is a common pitfall across web frameworks: Your framework cannot and is not trying to replace HTML5.)

That being said, I don’t see any reason why you would have to learn JS before Elm. There are some things for which you do have to use JS ports in Elm, but for the most part you can put almost all of your interactivity in Elm and not worry about JS.

(I always prefer to do my styling with CSS classes even in Elm, so I don’t really have an opinion on learning Elm before styling.)

3 Likes

Elm sounds like a really good fit for your use case. The functional and frontend pieces are fairly separate, so you can work on them independently, and then combine them.

You can get a working website (that doesn’t look good) using almost no frontend code.
You can get a beautiful website that has no interaction.
And then you can combine them together in a type-safe way that “just works” when it compiles.

Elm also has some useful packages (elm-css, accessible-html-with-css) that enforce a type system over html/css and make working with those much nicer and help avoid pitfalls.

2 Likes

So I was wondering if I can learn elm and frontend (frontend with elm) at the same time? That would give me a way to not seriously learn css/js (which I actually don’t want do).

I did, and I don’t regret it!

I learned Elm about 4 years ago, and at the time the only prior “frontend” experience I had was writing .erb templates in Ruby on Rails, and the only programming experience I had was ~1.5 yrs of Ruby programming (no CS degree). I had also learned a teeny bit of JavaScript, and had done a beginner React tutorial. If you are really adamant about avoiding detailed knowledge of HTML & CSS as well (I was; particularly CSS), I expect you’d be able to use GitHub - mdgriffith/elm-ui: What if you never had to write CSS again? with great success (I did).

It’s true that this seems to be the reverse experience that most Elm developers have—that is, most Elm developers learned JS and were frontend engineers prior to coming to Elm—but I very much enjoyed having Elm be my first serious frontend engineering experience. There are of course occasions that will arise where knowledge of HTML, CSS, and JS will be necessary, depending on the specifics of what you’re trying to accomplish, and where you might need to dive a little deeper into those technologies than you might otherwise want to in order to accomplish your goal(s). But I think there is at least a lot of knowledge in the Elm community around how to manage those interfaces and what you need to know about them.

1 Like

For most front end you can likely learn and use Elm and not have to learn CCS, HTML, or JS. To do that you’d want to use mdgriffith/elm-ui for your view code as it’d allow you to build your GUI without learning HTML or CSS.

As your experience with Elm grows, you’ll likely want to learn a little bit of HTML, CSS, and JS as they will allow you to do more with your app. But they aren’t necessary.

As to @eleanor’s concerns about accessibility, mdgriffith/elm-ui as well as tesk9/accessible-html should be able to provide you with most of the basic accessibility items you’ll need. From there, if you decide to continue building front ends, then I would recommend reading more about accessibility.

3 Likes

I don’t have much trouble with HTML and basic CSS. It’s only when things like “floating” (like overlapping divs) things comes in front that makes me say, “Nah, this looks messy. May be I should stay in my comfort zone of backend.” I just cannot reason with them.

Thanks, that helps!

I actually came to this forum after watching the talk “From Rails to Elm and Haskell” and the one on elm-ui which made me interested. Probably, the only reason I didn’t learn frontend before was CSS and the “tricks” you need to know.

And the similarities with my background with yours assures me. I started professional development ~2 years ago with django (no CS degree either) and in the beginning days, I wrote a lot of jinja2 templates. So I don’t have that much of a problem with HTML (styling was done by someone else).

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.