Author's note

Hi there my friend, I am Nathanael, a frontend developer. I know from personal experience how confusing it is learning JavaScript as a beginner. It could feel a little abstract at the start, especially if all the prior knowledge you have is HTML and CSS. I've been there and I know how it feels.

The Visualizing JavaScript series will help you understand a little more of how useful JavaScript is in the real world. This series will help you go from "Okay I've read about this, but what do I do with this knowledge" to "Ohhh so this is how to make this cool feature using this term I learned".

More than 95% of websites are built with JavaScript and this one you're on is no exception, you can even build mobile applications with JavaScript! So yea, learning JavaScript properly is a big investment that will help you in the long run.

"For the things we have to learn before we can do them, we learn by doing them."

— Aristotle

This series will have a hands-on approach. What this means is we will learn by building mini projects, so you'd enjoy this series more if you code along, that way you can see it work on your own local machine and you can even add comments as you go.

Adding comments as you code helps you do three things:

  1. You can look at your code later and use the comments as a refresher for what you might have forgotten.
  2. It helps you understand the code faster and in your own words too.
  3. We might have to work together on a project sometime in the future and having the habit of adding comments to your code makes life easier for everyone😅.

What you need to fully enjoy the series:

  • You need a code editor to code along (examples of a code editor are VS code, Atom, Notepad++), I personally use VS Code, but any one you use will do the job just fine. Don't just copy my codes, write along too!
  • Explaining every single term in detail would make each article a bit more bulky than we would like, so basic knowledge of JavaScript would be nice, this includes knowledge of terms such as functions, arrays, methods, variables etc...

If you're completely new and have zero knowledge of JavaScript, it's completely fine, everyone starts somewhere and you can start your journey at Freecodecamp or MDN web docs for free.

  • Basic knowledge of HTML and CSS would be nice too, that way you can fully customise whatever you learn to your taste/needs. You'll see why this is important as you go on.

How many projects will we build?

At the moment there is no specific number of projects in mind, We want to build as many projects as possible to help us see how JavaScript works in real life. If you have any JavaScript mini project you would like me to write about, feel free to mention it in the comments section of any article of the series and I'll get to it.

Constructive criticism, suggestions, ideas and corrections are always welcome so please feel free to use the comments. If you prefer to discuss these outside the comments, please feel free to connect with me on twitter.

Conclusion

JavaScript is a wonderful language used everywhere on the web today and you've made a great decision learning it. Join me and let's level up our JavaScript knowledge by building cool stuff. You won't regret it!