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?
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.