Ask HN: Front end web app development tools for back end engineer

2 points by cpeth 4 years ago | 3 comments

What's the best way to get a SPA up and running quickly if you generally dislike the unholy trinity of html/css/js and the endless frameworks to manage and combine them?

Now that Elm-UI appears to be dead, is there anything else that would allow me to just compose code? Is Flutter's web app support fleshed out enough? Blazor / Bolero seem good except for shipping the entire .Net runtime to the browser as WASM.

Are any of the Rust -> WASM projects mature enough to provide a pleasant and quick developer experience?

I'm asking because many of my side projects stall out when I get to coding a front-end; I lose the passion as I don't find coding for the browser enjoyable regardless of the frameworks I have tried. Maybe there is a tool / language / framework out there that I am missing.

midrus 4 years ago |

Give a try to Unpoly[1].

I really, really, really love it and feel like this is what 90% of projects need, and maybe the remaining 10% are the ones that need a full frontend framework.

Unpoly augments HTML in a declarative way, it comes with support for navigation, modals, sidebars, popups, forms, validation, etc out of the box and allows you to also add custom behavior if that's not enough. It is backend agnostic so you don't need any special integration in your backend other than it being able to spit out plain old html. It is very "full stack" in the sense you won't need much more (think of it as the non-Rails stimulus + turbo + hotwire +....). Unless you're using Rails and Hotwire, I think Unpoly is the best alternative while keeping things sane.

I work full time as a frontend developer, now with Vue and previously with React. Believe me, in most of the cases the added complexity doesn't make any sense at all.

[1] https://unpoly.com/

ale_jacques 4 years ago |

Also, take a look at HTMX (https://htmx.org).

MrWiffles 4 years ago |

Sadly, I don't think there really is anything out there right now that fits the bill here. You can try playing around with some WYSIWYG HTML editors/tools if you like, but I doubt that'll play nicely with the general SPA development workflow for building stuff like a react app (for example).

I was essentially in the same place you are about a year ago, and had to dive into the god awful hellscape that is javascript for a project. Ultimately I just had to bite the bullet and write straight-up JS/JSX. It's definitely a learning curve, and if you're like me you'll hate every minute of it, but once you get the hang of it in general it's not the absolute worst thing you'll ever do (or have ever done).

Not a promotion (I'm not affiliated and they don't pay me for this!), but I've found CodeKit on MacOS useful from time to time. https://codekitapp.com. I've used it to serve and automatically rebuild the SPA I'm working on whenever I change the source code. It does a hell of a lot more though, so maybe check it out (if memory serves they have a trial...I think).

In terms of frontend frameworks, I personally despise react. It's extremely bare-bones and you have to go plugging in a ton of other crap from all over the place to get the bare minimum needed to build anything actually useful at all. Routing, for example, isn't even included out of the box for react.

By contrast, I've found Vue.js to be MUCH more developer-friendly. It performs just as well as react, does NOT require that absolute shitstorm that is JSX, and unlike react, it's a "batteries included" framework that will have pretty much everything you need (probably more) to build out a very useful and feature-rich SPA right out of the box with libraries officially maintained, tested and integrated with Vue by the Vue team. No more cobbling together a frankenapp from tons of disparate libraries you've never heard of necessary! There's a learning curve to Vue as well, but I personally think it's worth your time (think about future career prospects vs. NOT having any front-end experience), and it's definitely a smoother experience than working with react, especially for haters like us. Personally, I used Vue Mastery video tutorials to get started learning it sometime last year, just before version 3 came out. I found the "real world vue" series EXTREMELY helpful in learning just WTF is going on. Commercial, but worth a limited investment to get your feet wet, IMO. https://www.vuemastery.com (again, not a promotion/not affiliated/not paid).

Front-end sucks, period. I don't envy you here, but I wish you luck!