Tuesday, 9 October, 2018 UTC


Summary

This is the first post of a series called ‘Learn JavaScript for Free’ - in these chapters you will find excellent materials and a roadmap for learning JS from scratch. As the JavaScript community is one of the best out there, the series will entirely rely on free JavaScript resources.
The series is written by Mate Boer - an autodidact developer who learned JavaScript on his own when he decided to abandon his career in Law - and now works at RisingStack. His primary motivation is to help those who need guidance to start a career in software development.
Table of contents:
  • It’s Hard to Figure Out Where to Start
  • About My JavaScript Path
  • Acquiring the Engineering Mindset
  • Learn the JavaScript Fundamentals for Free! (Web and JS Basics)
  • Start with vanilla JS, learn the frameworks and advanced concepts later.
  • Moving Forward

Why Learn JavaScript Now?
JavaScript is almost everywhere: in your browser, web apps, mobile apps, cloud services, even IoT devices. It’s easy to get started with it as all you need is a plain text editor and a browser. It is a beginner friendly language, with an awesome community around it.
You can code both frontend and backend with JavaScript, which makes it extremely useful.

It’s Hard to Figure Out Where to Start
To become a JavaScript Engineer, you have to acquire various skills. For beginners, finding an optimal learning path is not apparent, especially with zero background.
The depth of the trade seems to be infinite, so the question ‘Where to start?’ raised by beginners seems legit. There are other questions like
  • ‘What skills do I need to learn JavaScript?’,
  • ‘How to get a job?’,
  • ‘How to prepare for interviews?’.
In this series, I’ll attempt to answer these questions.
One thing to mention: this is not a specific JavaScript tutorial. You will not learn how to code from this post.
Instead, it is an overview/roadmap of the path ahead of you to become a developer on your own.

About My JavaScript Path
To give some context, my relationship with development started in my teenage years. I’ve learned HTML and CSS just for fun and curiosity. After that, I built websites with content management systems like Wordpress, and that was it. I didn’t take it seriously: it was a hobby and nothing more.
After graduation, I went to law school, worked for law offices, but after 5-6 years, I realized this is not the kind of career I imagined for myself. In retrospect, it was a useful experience, but I didn’t want to do it anymore. I needed something more creative. So I started learning JavaScript.
Taking part in a programming school wasn’t an option: the basics are freely available on the internet, and I didn’t want someone to charge me for the same thing I can find in tutorials. I knew it wouldn’t be easy though, but I can say it was fun for me.
I practiced at least 6-7 hours a day.
I worked on hobby projects with React, but after three months, I started to feel the limitations of self-learning. There was nobody to tell me the best coding practices:
  • “How do I structure an app?”
  • “Which packages should I use?”
  • “What makes sense learning and what is merely some glorified sugar coating?”
Maybe I could have figured it out somehow by myself, but I realized that I need to work with people who already have many years of experience, so that I can soak up the knowledge from them. The best way to be around people like that was to get hired, so I started sending my CV to companies. Many of them. Even for positions I was sure I wouldn’t be hired. Why not? If you can get through and be called in for an interview you can already learn from the questions you cannot answer or the coding challenges you cannot complete.
After several attempts, my efforts paid off: I got hired by RisingStack as a junior developer which allowed me to develop my skills a lot faster compared to the time I spent with self-learning. During my first month - like every new recruit - I had to finish the internal bootcamp, which prepared me to work on client projects.
But this series is about what to do before you get hired, so you can get hired.

Acquiring the Engineering Mindset
In this section, I’ll cover the skills necessary to start learning JavaScript.
At least you should have a basic interest in web technologies, programming or IT. It will be cumbersome without that, and anyway, why start learning something that you are not passionate about? Learning how to write code just for the money isn’t a good idea either.
Basic interest is enough for learning the fundamentals and maybe even for getting hired, but if you want to make progress especially from an entry level, it requires extra dedication and effort. This is perhaps the most crucial point about it.
Try to set reachable goals for yourself. Learn something new every day.
Beyond the efforts, the necessary mindset to be a successful developer is also worth mentioning.
Source: 7pace
These are skills you will have to pick up as the time passes.
One of the other most crucial must-have skill is to know how to Google, a.k.a find solutions to a problem. I’ve seen a lot of people struggling to search for an obstacle that is so obvious to solve with a bit of inspection. There is an answer for the 99% of the problems that a beginner is going to face.
You just have to find the solution and apply it. It’s that simple (at the beginning). If you didn’t find the answer, probably you didn’t search the right way. So start getting to know how to Google correctly, and make a ‘friendship’ with StackOverflow and MDN.
Do not fear making mistakes. It’s part of the learning process.
Let’s move on to the next section.

Learn the JavaScript Fundamentals for Free!
  • Getting started with the web
Before you start to learn JavaScript, it is highly advised to get familiar with HTML, CSS and how the web works.
HTML and CSS can be picked up really fast. Build a simple static website, experiment a little bit. Once you are comfortable with the concepts of these technologies, you can move on..
  • Intro to Programming Basics
As HTML and CSS are not programming languages, so it is time to get some theoretical knowledge about programming. There are some books that I recommend:
  • You Don't Know JS: Up & Going. (begin here)
YDKJS is a series of books diving deep into the core mechanisms of the JavaScript language. I recommend the other parts of it as well.
  • Speaking JavaScript
  • Eloquent JavaScript
  • MDN JS Guide
These books and tutorials should give you a basic understanding of the language.
  • Learn using the Command line
Getting to know the command line is necessary. Learn the basic commands like how to enter/leave a directory, and edit/copy/move/remove files.
You will use them a lot - so why not save time for yourself by learning them at the beginning?

Start with vanilla JS, learn the frameworks and advanced concepts later.
Forget these cool words like React, Vue, Angular, Node.js, OOP, Webpack, functional programming, etc. In my experience, until you don’t know the basics, it is utterly unwanted to confuse your mind with these advanced concepts and frameworks. Be patient. You will get there soon.
Get the basics right first, and start coding ASAP with Vanilla JS.
  • Setup IDE
Setting up an IDE with a decent config will make your life easier. My personal favorite is VSCode, but there are other amazing IDE’s like Atom, WebStorm, Brackets or Sublime.
  • Choose a project to build
Your project can be a todo-app, a calculator or basically anything. Don’t choose very complex projects, it’s good to have a sense of achievement in the beginning. As you develop your project, you’ll have a lot of questions. Use MDN, StackOverflow and Google. As I said above, there is an answer almost for all questions a beginner going to face.
In case you have no idea what kind of project to build, I provide some links below which maybe help with the decision.
  • 40 side project ideas for software engineers
  • Projects you can do with JavaScript
  • 5 projects to complete when starting to learn front-end development
Learn from your mistakes!
Learning from mistakes is also an essential part of the process. Don’t be afraid to break the code.
A failure is an opportunity to prevent future failures, and it makes you curious how to solve the problem.

Moving Forward
I think you can get familiar with these things I outlined within 1-2 months if you do some exercise every day. Once you feel you are confident with this knowledge and made some hobby projects, you can do a level up, and choose a framework and set Node.js in motion as well.
In the meantime, you should explore more stuff about JavaScript like articles, newsletters, podcasts, YouTube channels, and a lot of tutorials.
If you have accomplished all of the above, you can start getting to know NPM, the package manager of JavaScript and Node.js.

Summary and Next Up
In the next chapter, I’ll continue with a roadmap of frontend development (React, Vue.js, etc.), a backend roadmap for Node, and with some tips to get hired.