Should you REALLY learn JavaScript before React, Angular etc?

00:00:00: Since I have all these courses on React,

00:00:04: Angular, Vue, and so on, I do sometimes

00:00:08: get the question whether you should

00:00:10: learn JavaScript first before picking up

00:00:14: one of those popular libraries or

00:00:18: frameworks.

00:00:19: And I think the answer is not a clear yes

00:00:23: or no, but I do definitely not agree with

00:00:27: people who almost preach that you

00:00:31: must learn all the basics first, that you

00:00:34: must learn vanilla JavaScript first before

00:00:38: you dive into one of those frameworks or

00:00:41: libraries.

00:00:42: But at the same time, I also don't think

00:00:46: that you should skip vanilla JavaScript.

00:00:49: And here's what I mean.

00:00:51: When you start learning web

00:00:54: development, when you start your

00:00:55: journey as a web developer, you will, of

00:00:59: course, at some point, probably relatively

00:01:02: early, come into contact with JavaScript

00:01:06: because you need JavaScript to add

00:01:10: some interactivity to your website.

00:01:13: Now, as a side note, you can nowadays

00:01:16: actually add quite a bit of interactivity to

00:01:20: your website and, for example, open a

00:01:24: modal without using JavaScript.

00:01:27: And that might be worth a separate

00:01:29: episode.

00:01:30: But still, it is quite common to use

00:01:34: client-side JavaScript for many

00:01:37: interactive features you might want to

00:01:39: add to your website.

00:01:41: And there still are certain use cases

00:01:43: where you need JavaScript.

00:01:46: So as you're becoming a web developer,

00:01:49: you will naturally, pretty early on, get in

00:01:53: touch with JavaScript, so to say.

00:01:56: Now, you will also, depending on how

00:01:58: much research you do and if you're

00:02:01: taking an online course or not and

00:02:03: which course you're taking, you will also

00:02:06: likely relatively soon find out that there

00:02:10: are certain libraries or frameworks that

00:02:14: can make your life easier as you're

00:02:17: working on your website and as you're

00:02:19: using JavaScript there.

00:02:21: In the past, that has been jQuery, for

00:02:25: example.

00:02:26: And just as a little fun fact, jQuery is still

00:02:30: super popular, even though it's not in

00:02:33: the tech Twitter bubble, but it is in

00:02:36: general still being used on a lot of

00:02:38: websites.

00:02:39: But nowadays, most courses and

00:02:43: tutorials guide you towards other

00:02:46: frameworks and libraries for a reason,

00:02:49: because those frameworks and libraries

00:02:51: like React or Angular or Vue or HTMX

00:02:55: and others solve certain problems in a

00:02:59: more elegant way than jQuery did and

00:03:03: do allow you to focus on your core

00:03:07: business logic, the core problem you

00:03:09: want to solve, and not having to worry

00:03:12: about reaching out to individual

00:03:14: elements on the page and manipulating

00:03:17: them with JavaScript.

00:03:19: So it makes sense to learn about one of

00:03:22: those libraries or frameworks at some

00:03:25: point, unless you absolutely don't want

00:03:27: to do anything front-end web

00:03:29: development related and you only want

00:03:31: to focus on the back-end, which is fine

00:03:33: too.

00:03:34: But if that's not the case, you will, of

00:03:36: course, pick up one of those libraries or

00:03:39: frameworks at some point, most likely.

00:03:41: And the question now just is, should you

00:03:44: dive deeply into vanilla JavaScript, as it's

00:03:49: called, so into JavaScript that's not using

00:03:53: any library, before you then learn React

00:03:57: or Angular?

00:03:58: And here, my opinion is that you should

00:04:01: not dive deeply into vanilla JavaScript

00:04:05: before learning React or Angular or Vue

00:04:10: or whatever.

00:04:11: And that does not mean that you should

00:04:14: not learn it at all.

00:04:15: You should just not dive super deep into

00:04:19: it.

00:04:20: And here's why.

00:04:21: Of course, you need to learn the very

00:04:24: basics.

00:04:24: You need to learn how JavaScript

00:04:27: generally works.

00:04:28: You need to learn what variables are and

00:04:31: functions, which core data types you

00:04:34: have in there, like numbers, strings,

00:04:38: objects, arrays, and so on.

00:04:41: You need all these things because you're

00:04:44: going to use all these language features,

00:04:47: no matter which library or framework

00:04:50: you're going to work with.

00:04:52: So you absolutely need that foundation.

00:04:55: But I, for example, don't think that you

00:04:59: need a deep understanding of how you

00:05:02: can manipulate the DOM, for example.

00:05:05: You should know that the DOM exists

00:05:08: and what the DOM is.

00:05:10: You should know that.

00:05:11: But you don't need a deep

00:05:13: understanding of how to manipulate the

00:05:16: DOM with vanilla JavaScript.

00:05:19: And in my opinion, you also don't need a

00:05:22: deep understanding of advanced

00:05:25: language patterns, niche features, which

00:05:29: might not matter for the library you're

00:05:32: working with.

00:05:33: For example, if you are working with

00:05:36: React, if you want to learn React, you

00:05:38: don't really need to understand what

00:05:41: classes are in JavaScript to get started

00:05:46: with React, because modern React

00:05:48: doesn't really use classes anymore.

00:05:52: Now, I can already hear some people

00:05:54: saying, yeah, well, you're going to write

00:05:56: bad React code if you don't know

00:05:59: advanced JavaScript features.

00:06:01: If you don't know about closures, for

00:06:03: example, you will at some point certainly

00:06:06: introduce bugs in your React code.

00:06:10: And you would be right.

00:06:12: You should absolutely become better at

00:06:15: JavaScript and learn more about it.

00:06:17: But my point is that becoming better at

00:06:22: JavaScript is something you'll

00:06:24: automatically do as you work on React

00:06:28: apps and as you're learning React.

00:06:30: I'm not saying that you should learn the

00:06:33: basics of JavaScript, then pick up some

00:06:37: basics of React and feel like you're done.

00:06:42: No, that's not the case.

00:06:43: But I am saying that it will probably be

00:06:46: more fun to learn JavaScript and dive

00:06:50: deeper into JavaScript if you're doing it

00:06:54: along the way whilst also learning React

00:06:57: and therefore building web applications

00:07:02: and user interfaces that are probably

00:07:04: more fun.

00:07:05: Because let's be honest, if you're

00:07:07: working with just vanilla JavaScript,

00:07:11: you're kind of limited regarding the

00:07:14: complexity of the web applications and

00:07:17: user interfaces you can build with that.

00:07:20: Sure, theoretically, you can build

00:07:23: anything.

00:07:24: But of course, those libraries and

00:07:26: frameworks like React exist for a reason.

00:07:29: They make it easier to build complex

00:07:32: web applications and websites.

00:07:35: And I do believe that you will have a

00:07:37: better time and you'll be more

00:07:39: motivated to learn JavaScript and of

00:07:42: course also learn more advanced and

00:07:45: niche features at some point if you're

00:07:48: learning it side by side with React, for

00:07:51: example.

00:07:52: Now, you could of course say that the

00:07:54: danger is that you don't really know

00:07:57: which part is React and which part is

00:08:02: vanilla JavaScript.

00:08:04: But for example, especially when

00:08:06: working with React, that danger

00:08:09: probably isn't too high because React

00:08:12: doesn't have that many React-specific

00:08:15: features.

00:08:16: Sure, it has JSX, which technically is not

00:08:20: React-specific, but it's not part of vanilla

00:08:23: JavaScript.

00:08:24: It also has the idea of building custom

00:08:27: components, custom HTML elements,

00:08:30: you could say, by defining functions.

00:08:33: It has the concept of outputting

00:08:35: dynamic content between curly braces.

00:08:37: And none of these things will work with

00:08:40: vanilla JavaScript, but you will learn that

00:08:43: at some point when working with React.

00:08:47: Chances are high that you're following

00:08:49: along with some guide or some course

00:08:51: that simply tells you that a certain

00:08:54: feature is React-specific.

00:08:56: And even if that's not the case, you will

00:08:58: find out if you start trying to use some

00:09:01: feature you thought to be vanilla

00:09:04: JavaScript in vanilla JavaScript and it

00:09:07: doesn't work.

00:09:09: And the same is true if you would pick

00:09:11: Angular or Vue, for example.

00:09:14: Those frameworks have some extra

00:09:17: features, a bit more features, than React,

00:09:20: in my opinion, that are non-vanilla

00:09:24: JavaScript-like, but it's the same thing

00:09:26: there.

00:09:27: You will find out that something's not

00:09:29: vanilla JavaScript.

00:09:31: You will find out.

00:09:32: And you could make the opposite case

00:09:34: as well.

00:09:35: If you become a JavaScript expert before

00:09:39: picking up React or Angular or whatever,

00:09:42: there also could be a danger of

00:09:44: transferring some patterns and concepts

00:09:47: you know from vanilla JavaScript to

00:09:50: those frameworks and libraries.

00:09:52: You could, for example, be inclined to

00:09:54: reach out to the DOM manually through

00:09:58: vanilla JavaScript code and manipulate

00:10:00: it at some point.

00:10:02: And that would be something you

00:10:04: typically shouldn't do when using one of

00:10:06: those libraries.

00:10:07: So I don't think that's necessarily a big

00:10:10: problem.

00:10:11: You will automatically learn what is

00:10:14: vanilla JavaScript and what is

00:10:16: library-specific at some point.

00:10:19: Because the idea, of course, always is

00:10:22: that you don't stop learning.

00:10:24: As a web developer, or I guess as a

00:10:27: human in general, we never do.

00:10:29: There's always more to learn.

00:10:31: There's always more to become better

00:10:33: at.

00:10:33: But I do believe that many people will

00:10:37: have a better time becoming a web

00:10:39: developer and learning front-end web

00:10:41: development if they learn it whilst

00:10:44: building something fun and whilst

00:10:46: building something at least a bit more

00:10:48: realistic.

00:10:50: And in my opinion, that's the case if you

00:10:52: pick up a library or a framework early.