loading...
Cover image for When that “simple” JavaScript tutorial is super complicated

When that “simple” JavaScript tutorial is super complicated

yaphi1 profile image Yaphi Berhanu Originally published at simplestepscode.com ・3 min read

This article originally appeared on Simple Steps Code which tries its best to help people learn JavaScript and actually remember it.

“For some reason JavaScript tutorials often start with ‘In this tutorial we will write a simple...’ and, 12,000 lines later you can't remember what it was you were trying to learn.”

@perrydBUCS in a comment on dev.to

This is really well said, and it illustrates the key problem with a lot of tutorials: they promise simplicity at the beginning, and then they end up being so long and complicated that the readers give up.

Let's talk about how you can get around this problem and get the most out of a tutorial.

Tip #1: Start with the smallest possible piece

puzzle icon

A lot of tutorials group a bunch of concepts into one big step. For example, they might ask you to perform an animation when a button is clicked.

If you follow along with the tutorial at this point, you'll end up typing (or pasting) a lot of stuff and not remembering it.

Instead, break the first step down into even smaller steps. First show a button. Next make the button do something simple (like maybe just saying hello when clicked). After that, try to create the animation on its own. Once you have a working button and a working animation, you can put the pieces together, and you'll understand how they work.

It also helps if you strip out unnecessary styles or markup in order to stay close to the bare essentials of what makes the code work. (Key word: unnecessary. If some of the styles and markup are necessary, keep them.)

In general, smaller pieces are easier to understand, easier to work with, and easier to remember. This approach will make a huge difference in how you learn.

Tip #2: Experiment before moving on

experiment icon

If you're learning new concepts, don't just follow a tutorial as written. Experiment with each step. For example, if the tutorial shows you one type of animation, try another type too. If something needs to happen when a button is clicked, try making different things happen when that button is clicked.

Adjust, experiment, play, break things. You'll learn so much in such a short time this way.

Tip #3: Try each step on your own first

running icon

When possible, try something on your own before looking at the tutorial. You might struggle, but you'll think deeply about the problem you're trying to solve and the issues to be aware of. This will prepare you to understand the tutorial much better because you'll understand why certain steps are included.

It isn't always possible to try solving the problem before looking at the tutorial, but it's something to consider in case it makes sense for your situation.

Key takeaways

key icon

The next time you see a tutorial, try these tips:

  • Break it down into the smallest possible pieces.
  • Experiment before moving to the next step.
  • Try to solve some pieces on your own first.

When trying these tips myself, here's what happened:

Instead of doing ten tutorials and learning zero things, I would do one tutorial and learn ten things.

I hope this will happen for you too.

This article was reprinted from Simple Steps Code which tries its best to help people learn JavaScript and actually remember it.

If you hated this article, feel free to visit my site and yell at me. However, if you have kind comments, put them here on dev.to :)

Discussion

pic
Editor guide
Collapse
ben profile image
Ben Halpern

Instead of doing ten tutorials and learning zero things, I would do one tutorial and learn ten things.

That is an awesome quote. I get caught up doing this a lot. It took me forever to learn the basics of Varniche cache because I tried to take it all in at once, and it was just a complicated mess. When I instead focused on learning one simple thing first, the process cascaded from there.

Collapse
yaphi1 profile image
Yaphi Berhanu Author

Glad you liked it! I've definitely fallen into the same trap too many times.

Collapse
garyfalkland profile image
Gary Fitzwater

Well written article in regards the problem i have with learning Javascript just now. Many of the tutorials do not stop through and progress with what you have learnt until it has became a known concept.
Far to many tutorials and courses go through new concept after new concept without creating a good foundation of what you have learn't before moving on.

Collapse
yaphi1 profile image
Yaphi Berhanu Author

And then at the end, "Look! We covered X, Y, and Z!" but who really learned it?

Glad you liked the article!

Collapse
dougblackjr profile image
Doug Black

This is so good. I walk into every tutorial feeling like I don't understand what "simple" means. This is excellent!

Collapse
yaphi1 profile image
Yaphi Berhanu Author

Glad you enjoyed this post! Often tutorials get built one small step at a time, and then the end result is a monster that doesn't reflect the process of putting together tiny pieces.