DEV Community

Cover image for Is "fundamentals first" the best approach to learning web development?
Alex Menor
Alex Menor

Posted on • Edited on

Is "fundamentals first" the best approach to learning web development?

A bit more than a year ago I started learning web development. Coming from a Computer Science background, where the I/O with computers is usually based on a terminal, they were exciting times.

So I started focusing on fundamentals as most people recommended: HTML, CSS and Javascript.

As I was doing this in my free time while also studying my degree I got exhausted by the time I got to Javascript and had to put it down for a while.

When I picked it up again, I progressed much faster through Javascript and started learning React. It was like unlocking a tool I could got creative with. I started enjoying coding.

Now with some perspective, I wonder what would have happened if I had started the other way around. Actually, a thread from Dan Abramov got me wondering.

Apparently this needs to be said but you can absolutely start with React and skip “JS fundamentals” IF YOU WANT. You’ll be confused about some things for sure (!), but for some people (incl. me) getting something on the screen is the only thing sustaining the initial interest

My past self would have argued the same, you would get confused about many things along the way, and while it's true, he makes a good point:

People keep answering: “but they will be confused”. YES they will be confused. The goal is not to eliminate confusion from the learning process, it is to not to lose people who give up because what they’re learning feels too far from what they want to be doing (make an app).

I even got confused going through fundamentals first. Specially with CSS. I remembered the moment I understood where flexbox was useful, like six months after "learning" it.

You are not going to see the importance of advanced topics of JS and CSS in the beginning, while is a totally worthy effort, you understand why much later.

The point I want to make is that while it's good for you to master the fundamentals, you realize it much later, which can discourage you to keep learning.

Note I didn’t say you never need to go lower level. You do — you will get stuck otherwise. And after you learn it, you’ll be convinced you “should have” learned that thing first, because you have an emotional understanding of why it mattered now.

And this is the most important thing for me: You should master fundamentals, that is no deal. The question is when.

Some people hold that should be in the beginning, perhaps biased by the former point.

I personally feel that you can set three phases:

  1. Get the basics of HTML, CSS and Javascript right. Don't get burned out.
  2. Pick up a framework, but keep in mind that you have some gaps to fill later on.
  3. Master the basics on demand as you make projects.

You get a motivation boost in phase 1 because you are starting, in phase 2 because you are finally more powerful than before and in phase 3 as you progress doing and getting your hands dirty.

Finally, this is just my opinion. The most important thing is that you keep learning and feeling motivated to do so.

This is the thread I was talking about, thanks for reading 👋🏻.

Top comments (22)

Collapse
 
jamesncox profile image
James Cox

In my bootcamp we tackled JavaScript before we got to React, but coming from Ruby to JavaScript was a real mind-f**k for me. I don't know why, but I REALLY struggled with vanilla JS.

Then we got to React, and I still had barely any idea how to do basic things in JS. I didn't understand core concepts like DOM manipulation, event bubbling, barely anything.

But, something about React helped so much! And while I still wouldn't call myself a JavaScript master by any stretch of the imagination, I completely understand those concepts SO MUCH better now. The "why" and "how" make so much more sense to me.

I am actually really excited about going back to building things with vanilla JS. And all thanks to React for making things so much simpler to understand in many ways.

Collapse
 
alexmenor profile image
Alex Menor

I’m glad you got away with it!

Collapse
 
jamesncox profile image
James Cox

Thanks! Me too! That JavaScript section of my curriculum almost defeated me, but luckily I got through it. I was pretty beat up by then, but React was the lifeline I needed!

Collapse
 
etienneburdet profile image
Etienne Burdet

I am on the "learn to code the way baby learn to talk side". They know nothing about grammar, they don't read the doc and they are the fastest learner you can imagine. Why? Because they learn to make extremely efficient mistakes and thus making extremely good guesses (PAC learning in AI terms).

I think it's very important to start on a project ASAP and start "guessing". It puts you in a situation where you actually need something new. It's very important, because you know "why" and "where" you need that skill/knowledge even before you even know what it is (it actually really wires thing up in your brain). And if you struggle that's even better: you learn what doesn't work, what seems and the emotion only reinforce the learning.

It create those "HAHA" and "I see what you did there" moments that you never get by reading a book on closures before this even go crazy. Trying all sort thisbinding in Meteor.js only to read Scope & Closure is one of my most efficient learning experience.

Do frameworks help for that? Definitely: you can use reactivity and a lot of it's implication without caring about event bubbling for exemple. Framework help you focus on structure rather than technical mundanities. Better: if you "guessed out" one framework, then the error you made along the way, will make you even better at "guessing" the next one and so on.

The only thing is to learn to identify quickly which grey area is slowing you down too much and where your guesses are being infecients.

It's called induction teaching and basically is the way most decent pedagogy is done today.
The old way of learn "all the theory before even doing an exercise" is virtually not used anymore. Not even for maths classes in French schools (if that doesn't say something, then what does?)

Collapse
 
alexmenor profile image
Alex Menor

Top comment

Collapse
 
squirrellogic profile image
Squirrel Logic

"Fundamentals first" is a concept we are struggling with teaching art/design classes. There's this balance of being stuck in education hell and actually working on a useful project. The most successful creatives (which include developers) have a project they want to make before they start learning. That helps a ton with motivation. Learning the fundamentals usually means that work on their project has halted until they know enough. But the problem is that it's impossible to know how much you need to know to start working on your project idea. I believe that even if they did know how much knowledge they needed to get started, they would be doing nothing but learning for so long before furthering their project that they would burn out.

I think the best way to learn the fundamentals and not burn out due to inactivity on your first project, is through "just-in-time learning." Learn some fundamentals, then do some exercise that pushes your project forward in some way. When you try out each new skill, you need to figure out how to somehow apply it to your project. Learning HTML? Use HTML to create a proposal for your project, using semantic markup. Learning CSS? Mock up an interface for your project, or a promotional page for it. Learning JavaScript? Create an array that has all the tags for your project, or an object that has the data type for your project.

If courses were designed with more open-ended assignments that would help push people's projects along as they learn the fundamentals, I think people would burn out less while still learning things in the right order. I do like the in-browser unit tests that freeCodeCamp uses for grading, but right after those tests, people should be directed to work on their project. That will also help the fundamentals stick.

Collapse
 
ahferroin7 profile image
Austin S. Hemmelgarn

What order you choose to learn thing in is your business, not anybody else's.

However, you need to keep in mind the two reasons why 'fundamentals first' is what so many people recommend:

  • There are many things that just don't make sense if you don't already have the background for them.
  • it's very important when using a complicated tool to understand how that tool actually works (not what it does, but how it does what it does).

The first point is just a non-issue for some people (they quite simply are fine with "because that's the way it's done" reasoning for why they should do things they way they need to do them), but even for those for whom it's an issue, it's just a side effect of how they learn.

The second point though is something that often gets neglected, even with 'fundamentals first' approaches, and it's a huge but often never discussed issue among software developers. Understanding how the tool/library/platform/framework you're using actually works is important for a couple of reasons:

  • It helps you understand when you actually need to use that tool. For example, many sites that use React or a similar framework don't actually need the framework, they would work just fine with a minimalistic in-house MVC or MVVM layer built on HTML <template> tags and the Fetch API. However, the developers quite often either just don't know this (they know how to use framework X, so that's what they'll use even if there are better choices) or they don't know enough about how the framework works to be able to prove to the people who are responsible for the decision that it's actually worth it (and it usually is, a truly minimal MVC layer is only a few thousand lines of code client side, compared to the almost 500k lines of code in React).
  • When something inevitably goes wrong, it helps you understand why it's gone wrong. Being able to differentiate from a limitation of the platform, a bug in your own code, and a bug in your dependencies is super important to efficiently debugging issues you run into, and it's exponentially easier if you have a proper understanding of how everything you're working with actually works.
  • It helps you avoid bugs in the first place. A pretty sizable percentage of bugs in software are a result of the developer not actually having a complete understanding of what the tools they were using do. This goes double for bugs in websites and web apps. Many of these could be completely avoided if developers actually properly understood what they were working with.
Collapse
 
alexmenor profile image
Alex Menor • Edited

I agree with many things. One thing that helped me is to put the problem in the center of everything and always think about the frameworks and languages as a tool to solve them.
We sometimes just fall in love with coding and forget what we do it for.

Collapse
 
etienneburdet profile image
Etienne Burdet

I beg to disagree: in theory it would be perfect if you could gather all the knowledge to chose between let's say mini-homemade-MVC and React. In practice that is a very tough task for even the most seasoned devs/CTO, let alone a beginner.

I would rather say, the day you can make that, you have mastered the fundamentals. Before that, I think you're much better off trying something a bit blindly and learn from your mistakes.

Collapse
 
ahferroin7 profile image
Austin S. Hemmelgarn

But that doesn't mean that knowing the fundamentals first can't help you significantly. I'll admit my particular example was a rather complex one, but there are plenty of simpler ones. For example, properly understanding the fundamentals helps you decide when it matters enough to use a more complex data structure than trivialities like a list or map.

Collapse
 
aleksikauppila profile image
Aleksi Kauppila

I’m an advocate of “build ton of stuff and pause for learning when faced with recurring problems”. Beginning with nearly 100% practice and naturally moving to learn more theory when it becomes important.

It’s definitely not necessary to know how things work in order to be able to use them. The features and interfaces are poorly designed if it requires the consumer to know about the ugly details.

However once a person is gaining experience it becomes very useful to dive into the fundamentals. That will serve well really quickly when advancing towards seniority.

Collapse
 
andreidascalu profile image
Andrei Dascalu

One point about this. You can approach learning however you want. You can learn React first, it's the pragmatic way to the first job and it's a useful skill at the end of the day. But you're not deferring the confusion in the learning process. If you learn React to apply it, once you have your job it's a different part of the process, where learning is done on the job and any confusion about the basics will reflect on your productivity. What will you say to your team? I'm a beginner that know react but no idea how vanilla js works in the browser? Maybe you jumped to typescript and you're writing stuff without having any idea how it impacts the Babel output (or parcel or whatever)?
Well, in all interviews I've been to and all I've ever held, you wouldn't get to React questions without passing fundamentals.
Then again, maybe you mean purely learning, in which case I would say React makes more sense after going through some basics.

Collapse
 
joelbonetr profile image
JoelBonetR 🥇

It depends on your way to learn things, there's no better approach for everyone, there's no magic on using a methodology or another, it's all about the way we learn over the base learning process our brain needs. check this for further information 😁

Collapse
 
samrocksc profile image
Sam Clark • Edited

Huh, interesting take, I like it, and thank you for the read!

I think I agree with you to an extent, I will say this: Having OS knowledge of Linux, understanding how networking works, and understanding the difference between templating languages allowed me to progress(both in salary and levels) a lot faster than folks coming out of framework-oriented bootcamps.

On the other hand, you're right, if you want to get stuck in the industry fast, i think you're right. But I think you should have metered expectations if you choose not to progress in learning after that.

Collapse
 
leicorre profile image
LeiCorre

I found with JavaScript, I understood arrays and loops very quickly. I somewhat understood functions, callbacks, and objects and I really struggled with regular expressions. Learning React and D3 significantly heightened my understanding in all these areas. The other element I found was time. Some things which had previously been confusing became a lot clearer when I wasn’t attempting to force more coding information into my brain.

Collapse
 
juanfrank77 profile image
Juan F Gonzalez

I've seen this pop up a lot on twitter last week. So here's my take on the subject.

Someone can totally learn a JS framework without having good knowledge of JS. And said person could totally make cool stuff with that framework if it works out. Obviously things are going to go wrong and when they do, it's going to be all black magic and debugging will be a massive pain because of the lack of fundamentals.

A different person can start learning JS from the fundamentals and not touch a framework and go through all the theory and deal with all the abstractions and muster the motivation to learn it as a whole but we all know that you never finish learning JS.

The "fundamentals first" advice is mainly of some people trying to save others that world of pain (or at least part of it) but then the issue comes when they take well-meaning advice and share it like it was gospel and then others are doing things wrong if they don't follow that advice.

Sure, go ahead and learn Vue, React, and whatever while barely knowing anything more past functions in JS. Nothing is going to happen until it happens and you find it the hard way. It's like trying your older brother's bike when you're just starting to learn how to ride.

Just because you can do something doesn't mean that you should.