Live data from Hacker News

Ask HN: What's is your go to toolset for simple front end development?

news.ycombinator.com

251–260 of 295 posts

Re: Ask HN: What's is your go to toolset for simple front end development?

#251

Earlier quoted context omitted.

While Mithril is interesting unless you are resume-building I'd avoid anything React-like until you are a small team and just go Vanilla JS with events, it can go a long way if you are a solo dev, especially if you have a backend experience and can write clear and simple code.

Can I ask a concrete question: say someone wants to render a table with data coming via an Ajax call to a JSON API. How should they do that with the tools you're suggesting? Use the native JS DOM API to synthesize table rows? (Just in case tone of voice doesn't come across, if that's the solution great, I'm not implicitly criticizing it in advance).

Yes, use Fetch API to retrieve the resources, and pass the resulting data to a function that uses the DOM APIs to create the table element + children. If you're not attaching event handlers to the elements, and if the data is properly sanitized, you can also use a combination of `innerHTML` + HTML written in template strings to dynamically create the markup.

Often people will see this and say "that doesn't scale!" Well, yeah, unless you start writing optimizations, at which point, you maybe created your own framework or view library and maybe you should start looking at something like Preact or Mithril.

Re: Ask HN: What's is your go to toolset for simple front end development?

#252

Earlier quoted context omitted.

How stable is it? I've been screwed over twice by Angular, RXJS, etc. Every month we had to redo most of our work as the community kept deciding on new directions of correctness.

Check the second link above. There are frameworks for this pattern in most languages, many with many years of effort into them. I can personally recommend Vaadin.

The web-components backed vaadin or vaadin flow (JSF-like, all-Java)?

Re: Ask HN: What's is your go to toolset for simple front end development?

#254

Earlier quoted context omitted.

Can I ask a concrete question: say someone wants to render a table with data coming via an Ajax call to a JSON API. How should they do that with the tools you're suggesting? Use the native JS DOM API to synthesize table rows? (Just in case tone of voice doesn't come across, if that's the solution great, I'm not implicitly criticizing it in advance).

Yes, use Fetch API to retrieve the resources, and pass the resulting data to a function that uses the DOM APIs to create the table element + children. If you're not attaching event handlers to the elements, and if the data is properly sanitized, you can also use a combination of `innerHTML` + HTML written in template strings to dynamically create the markup. Often people will see this and say "that doesn't scale!" We…

Thanks, that's really helpful to me. In particular, I wanted to know whether creating a table dynamically from Ajax data was sufficient reason to start using Preact/Mithril, and you made it clear that in your opinion it's not.

Re: Ask HN: What's is your go to toolset for simple front end development?

#255

Man, given all the comments suggesting frameworks that will require you to do html/css/js it seems like no one has really read your post. For your use case I would look at AppSmith ( https://github.com/appsmithorg/appsmith ) or ToolJet ( https://github.com/ToolJet/ToolJet ). These are full-stack low-code frameworks, but it's easy to use them to do just the frontend and connect to a backend API you implement yourself…

Thank you. At work we've been having a look at these. Decent for in house stuff.

Re: Ask HN: What's is your go to toolset for simple front end development?

#256

Ignore any recommendation of React, TypeScript, Vite, or Tailwind. Here are some recommendations that don't require NPM/Node. Pick a "classless" CSS library from a site like CSSBed[1]. These are kind of like Bootstrap, except you don't need to write any CSS or apply any CSS classes in your HTML for them to work. No tooling necessary; just include a tag in your HTML document. If you'd like to try something similar to…

Great thread all around! Have been hearing raves about "htmx" and finally clicked the above link. Chagrined to find the tight DOM element coupling is done via data-set string attributes. Mapping to data store keys. Kind of the inevitable no-framework pattern I just assumed everyone was implementing ;)

Re: Ask HN: What's is your go to toolset for simple front end development?

#257

Earlier quoted context omitted.

Point taken; I admit I wrote that as a sort of frustration and reaction to the abundance of comments telling a newb at front-end developer to just take the deep dive and start installing a bunch of NPM packages / CLI tools. In my opinion, those tools hide amazing layers of complexity that become a problem as soon as you need to eject. I think any beginner at front-end development should realistically start by getting…

I think it just depends what you want to build. Once your UI reaches a certain level of complexity, the benefits of various tools begin to outweigh the cost. If you know you're going to end up at that point because your designs include a high level of interactivity, you might as well use tools that will support your needs from the beginning--either that or revise the designs to be less ambitious. Often newbies have a…

> Once your UI reaches a certain level of complexity, the benefits of various tools begin to outweigh the cost.

What's that certain level of complexity? I have some heuristics I might use, but what I've noticed is that even discussion about where these product behavior thresholds are seems to be rare.

And "polish" and "silky smooth" don't seem like features that come automatically with any of the top frameworks either, nor things that are inherently difficult without them.

Re: Ask HN: What's is your go to toolset for simple front end development?

#258
post #82
post #62

Earlier quoted context omitted.

Seconding this. I've been using LiveView in production for ~18 months now, on a couple of projects. Hugely simplifies the overall stack. Combine with TailwindCSS, TailwindUI.com, and you have some very powerful tooling at a low development cost.

You or your company hiring, by any chance. I've been using that exact stack for a few years now, and Elixir+LV jobs are hard to come by :P. I probably need to focus more on 'vanilla' back- and frontend stuff, but man has it been fun so far! Definitely made me enjoy my work more.

We are betting big on moving to liveview and are hiring.

We run a half dozen elixir apps in the healthcare and research sectors.

people@polkadotskysoftware.com

Re: Ask HN: What's is your go to toolset for simple front end development?

#259
post #237

Man, given all the comments suggesting frameworks that will require you to do html/css/js it seems like no one has really read your post. For your use case I would look at AppSmith ( https://github.com/appsmithorg/appsmith ) or ToolJet ( https://github.com/ToolJet/ToolJet ). These are full-stack low-code frameworks, but it's easy to use them to do just the frontend and connect to a backend API you implement yourself…

Now this is what the OP was looking for, and it so happens that I'm going to look into these too! Thanks! Quick question because I have no idea what I'm doing: is there any integration in either of those that you know of for one or more 3rd party auth system(s)? I don't want to write my own auth!

I'm not sure about ToolJet, but I know it's possible to use external auth systems with AppSmith.

It supports at least Firebase and Supabase. I think self-hosting Supabase + AppSmith could be a good combo for quickly hashing out prototypes or internal company apps.

Post reply on HN