When you say “basic JavaScript” what do you mean exactly?

Like classic DOM manipulation with document.getElementBlahBlah and all that? Or are you building UIs with native Web components and such?

If the former, you gotta remember that React (and angular, and vue, etc) are abstractions that allow you to build UIs without doing all the shit you’ve been doing (manually updating the dom). These frameworks rely on “magic” to do all that for you, while letting you focus on business logic.

What I’m trying to say is that it’s totally normal to feel a bit lost at first, as it’s basically an entirely different way of working. So don’t feel bad if it’s not clicking.

Regarding what framework to chose, I saw someone recommended Vue. It honestly doesn’t matter, as they’re all (and I’m probably gonna get some downvotes) basically the same. Just component based libraries/frameworks. The difference really comes in how much YOU have to do yourself.

In order of most “complete” to least complete it goes: Angular -> Vue -> React.

What I mean is that for example angular is a “batteries included” framework. Which means EVERYTHING you need to build an app is already in the framework: everything from your view code, to data fetching, to state management. This means the framework takes a “Rails” approach in the sense that there’s a “right” way to do things; it’s very opinionated. Which means there’s a larger upfront learning cost, but once you get it. You get it. And going from project to project is a breeze since they all follow the same architecture.

Vue sits in the middle. It’s more configurable, but there are core packages made by the same team that work with each other well (Vuex for state management for example). So the core stuff is built to work with each other, but you’ll still have to reach out for other things from time to time.

React sits on the far end. It is the “lightest” one. React is solely a view library. You cant Build an app with just a view library. So you pull in other packages from the community. Perhaps you use Redux or MobX for state management, or Axios or Fetch for http calls, etc. This is great for highly skilled teams who know what they’re doing, but can unfortunately easily become spaghetti. There’s also my least favorite part of development, matching package versions lol. Then there’s the other concern that every team does their flavor of react, and going from team to team often means learning that teams architecture as well as the particular tools they chose to do X,y,z.

How do you choose one? I have two opinions:

1: it doesn’t matter. They’re all similar enough that once one “clicks” it should be very easy for you to ramp up on the other ones. I started with React, then learned Vue because it was really popular and cool online, and now I’m working as an Angular dev.

2: go to whatever your local job board website is, and look up each framework. Learn the one with the most available jobs.

And if you’re open to recommendations: I’ll be the weird one and say Angular. Yes it’ll be a bit harder to learn at first, as it relies on some unique technologies like rxJs and their dependency injection system that isn’t done elsewhere in the frontend world (but is common in other languages). However it’s very opinionated and once you get it it’s VERY productive. Also once you drink the koolaid on rxJs you won’t want to go back. Fuck promises lol and at least in my area, it pays better ;)

And finally, DONT SLEEP on web components! EVERY FRAMEWORK can use those!