I’m an experienced backend developer. To me, the backend world seems super simple compared to the frontend world.
It seems like there are a million options and I don’t have the experience to say what’s good and what’s not. I’m hit with major choice paralysis, basically.
I don’t have any special requirements - I “just” want to build a pretty standard, responsive, modern-looking UI. Ideally without too much boilerplate, in a framework that “feels good”, in a way that might at some point attract other contributors as well, if I get to the point of open sourcing.
Of course I could just reach for the most popular thing i.e. React, but that doesn’t seem to be the “hip” thing to use nowadays (or maybe I’m wrong? What do I know, I’m a backend dev).
But even if I choose a framework, there’s a million other libraries out there to choose as well. For instance, which UI library to choose? What about observability and state management and authentication and so on?
Sorry if this is a bit ranty. I am honestly just looking for an experienced frontend developer to point me in some direction (i.e. some set of frameworks/libraries; a “stack” if you will), so I can get out of this choice paralysis.
What would be your go-to stack for a new frontend project today?
If you don’t care too much and don’t have experience yet, why not go for native browser and HTML/CSS/JavaScript?
Even if you eventually migrate to other web UI libs and frameworks, the foundations knowledge will be useful.
Aye. K.I.S.S. has been forgotten in frontend. Its so simple to make basic sites. No need for huge ass frameworks or complicated build pipes most of the time.
I guess because you end up rewriting a lot of stuff manually, rather than going for tried-and-true solutions that work out of the box? I mean isn’t that the same as every framework, regardless if we’re talking JS or frontend or backend or whatever. I mean I use a framework in the backend as well, I’m not about to roll my own routing system and manually listening to a socket and everything.
I totally get the sentiment of KISS, but if you know that your site will not be super simple and will need interactivity and the possibility of complex workflows, isn’t the raw HTML/CSS/JS kinda limiting? That’s the impression I’m getting from what I’ve read online.
But you (almost certainly) started using those backend frameworks after you had experience. You learned the basics first, and then incorporated frameworks when you got to larger projects.
I came here to say the same thing as the original reply in this thread, albeit with slightly different justification:
If you don’t know the basics, and can’t build a functional site with just HTML/CSS/JavaScript, all of the frameworks will be a nightmare. You should really learn those first, even if it means building a practice site, or completely rebuilding your frontend when you decide to use a framework.
The frameworks can make your life easier, but there’s a learning curve, and a huge cognitive burden especially when you are just starting. You’ll fight them more than work with them at the start.
That all said, never use what’s “hip” on the frontend. JS frameworks typically have the lifespan of a house fly. React is one of very, very few that has remained popular, and continued to get updates for a long time (at least in JS framework terms). It’s a solid choice with a huge community, good docs, good tooling, etc. There may be other valid choices, but seriously - avoid anything new and flashy, because that usually just means its deficiencies haven’t been found yet, and as soon as they are, there will be a new framework.
I maybe should’ve lead with that in my post, but I do know HTML/CSS/JS on a basic level. Again, as I thought I laid out in my post and as I have said in other comments, I’m not really here to ask for advice on learning these things. I’m asking for advice on a stack choice.
Some other people mentioned Svelte. Would you say that’s too “hip”? What other options are there than React, if we exclude all the hip stuff?
Are you building something for fun, or something meant to last? If you want it to last, I’d be looking at old frameworks - obviously React, and Vue has also been around a long time. Angular is also old, but Google maintains it, so they could kill it at any moment (and personally I hated it when I had to use it).
I’ve never used Svelte, and don’t know much about it. From a quick look online, primarily what it does differently than other frameworks is use a compiler. I’d be a little concerned here, because what it compiles to is JS, as that’s what runs in your browser. This can make debugging more challenging, because when you pull up the debugger in the browser, it’s not your code, it’s the compiled code. They may have solved this problem, they may have browser extensions and IDE plugins to help with this, but find out before you start. If you can’t use a debugger, use a different framework.
I’d argue Svelte’s main differentiator is its simplicity compared to many frameworks. The syntax is essentially just an html page, with <script> tags for reactive code and normal HTML markup with additions like {#if} or {#each}.
As for debugging, a typical Svelte project ran with Vite will have debug mappings that makes the console debug window look very close to your actual code.
I don’t know what you’re looking for, and what your “not super simple” is, but baseline browser tech provides various controls, layout mechanisms, styling, interactivity, etc.
Do you have a concrete idea of what and where specifically you hope for gains by using frameworks? Do you plan to hold a lot of state on the client that needs state separated from the DOM and its mechanisms? Do you want a standard library of styled components instead of using the native ones or styling them yourself? Do you want more robust JavaScript? Those are all very different concerns and requirements.
I like the low complexity, low barrier, low requirements of baseline web tech. The native html form controls may arguably look “ugly”, but those can be styled, individually or through a style-only CSS lib.