It's not surprising these are such popular questions, in this ever changing landscape, new frameworks popping out every week as well as a language in constant evolution. It's easy to feel confused and overwhelmed.
Well, today we're gonna tackle exactly this. By the end of this article, you will have a clear idea of the exact skills you need in order to truly be able of building anything with vanilla JS.
Now, this could easily be a 10000 words articles, but I don't want that. I want this to be short, concise and to the point, and for this very reason I made it into 10 steps.
It means, learns what a variable is, functions, loops, scope, hoisting, HTTP, comments, learn how the web works and get to the point where you can build small projects with clean, readable code.
Any resource out there is good to teach you the basics, after all, they're the..basics! Just make sure you're learning from unopinionated, respected sources.
This is by far the least popular step, yet the most effecting at building you into a PRO coder that can build anything!
So many times I've heard: "but Tenzin, can I skip algorithmic challenges? I'm not good at math..." Guess what amigo...no one is! No one is good at anything until one day they decided they were going to become good at it! 😉
Any area of your life you feel you suck at, accept it, embrace, define how you wanna be instead and start working. Besides, you don't need to be a grand-master of math to solve coding challenges! If you can do basic operations you'll be just fine.
Now I hear you saying...how many? I'd say at the very least 100. Hold on! I can still hear you there, screaming at the monitor 🤣 If you only did 1 challenge per day, in 3 months you'd already have 90 under the belt!
Where do you go to find algorithmic challenges, you ask? Here are the best websites:
If you're learning to code by yourself, that is without a formal education in CS, you HAVE to go through a CS course, and by far the best out there on the planet, which is 100% free is...CS50 by Harvard.
They have amazing videos, quizzes, exercises. It's gonna teach the history of computers, what an algorithmic is, what are data structure, memory, compiling, abstraction and much more.
All these things that course is gonna teach you, it is simply amazing!
I'm telling you, you have to go through a book! There's nothing out there, no article, course, YouTube video that is going to make you into a complete developer as a book will!
And most programmers out there have not gone through a book, properly. Remember, the key principle here is to understand! So don't rush it, go through a book cover to cover and don't move on if you don't understand something.
So, go through a book, possibly even multiple books! But you have to start with one. Being the good guy that I'm, I've curated a list of the best JS books out there at the moment:
You don't know JS
So now, pick one and stick with it!
A lot of folks out there think they understand asynchronous JS just because they can set a timeout function, unfortunately, that is just not enough.
So what should you learn? Start with timers (setTimeout, setInterval) then explore callbacks, learn what a callback hell is, promises, async-await.
Learn how asynchronous code interacts with the rest of your code, learn how to the call stack work.
Oh, and did I mention build projects? Yeah, build a ton of project because that's the only thing that's gonna help you retain what you learned and improve your skill, that's the only way you're gonna get better by actually applying your skills.
Small projects are great to start and to sharpen the say, but a big project is worth a 1000 small one.
Oh, and of course build a ton of projects related to OOP!
Learn functional programming, if you asked me 3-4 years ago I would have probably skipped it but nowadays, in 2020 and going into the next years it has become fundamentals.
If you eventually wanna move into senior positions it has become an absolute requirement. So learn what it is, how it's different from OOP and why it is advantageous in specific situations.
Also, If you get good good at functional programming you'll have a much easier time learning libraries like React and Redux.
Learn this pattern because it's gonna help become a much better developer you're gonna learn how to build an app that is maintainable and scalable into the future.
Because there's a big difference between being able to build something and building it the right way.
Also learn about MVC, model, view controller framework. The model is the state, the data. The view is the UI, the controller is the guy who's allowing them to interact. A lot of the big scales apps are based around the MVC system.
One more reason to learn design patters is that it's gonna make picking up any library of framework much easier! Because you're gonna understand how they work instead of just learning how to use them.
Speaking about frameworks, start with one and get good at it! Don't skip from one to the other. The main three are React, Vue and Angular. The latter is a little more advanced. If you're a beginner I would recommend Vue or React, Vue being more beginner-friendly but react being more popular.
What's important is that you pick one and stick to it, build a ton of projects with it and learn it inside out.
One of the main problems that frameworks and libraries are trying to solve are: keeping your UI in sync with your state. You can do it with vanilla JS and design patters but if the app gets big enough comes a point that is simply too much to be scalable and maintainable.
You could make the argument that you could optimise every little piece of JS but if you go down that route, pretty soon you'll realise that you're be building you're own framework or library! 😂
So you might as well go with one that is built by Facebook!
If your goal is to work at a company, especially a big company, then learning how to write tests for your code is essential. But we all should learn how to test our code, is make you a better developer and your code more robust!
For example, I went through a scheme book in just one day and that changed everything for me. I understood recursion and functional programming, all in a much more natural way.
Speaking of different languages, CS50 its gonna go through C which is a super powerful language that is much harder to learn than dynamically typed languages but its gonna make you into one hell of a developer and it's covered in-depth in that beautiful sweet course. (take that course, seriously)
Another tip is teaching! There's not a better way of learning than teaching, and I have a video on how to make money teaching and tutoring so check that out!
So how long is it gonna take, you ask? Probably forever but gun to my head, if I had to give you a precise number, I would say 1-2 years if you went about full time or 4-5 if you went about it part-time.
And by the way, just so you don't misunderstand, you don't need to become a master to start earning, building or get a job! There are plenty of paid JS developer that haven't mastered it yet, actually it's most of us!