
Ask HN: What's the best path to learn JavaScript as a beginner? - applecrazy
Hello Hacker News. I come from the world of Java and I never took JS seriously. I had previously used it to create websites using jQuery, etc but times have changed. JavaScript is popping up everywhere, so I decided to learn it last year. Unfortunately, I was extremely unsuccessful, since I finished learning ES5 and immediately decided to jump into frameworks such as React and Angular. Both confused the crap out of me, and then I saw VueJS (supposedly framework of the year) and that was a little easier for me.<p>But I still have a feeling that I&#x27;m going at learning JS the wrong way. For instance, TypeScript, Babel, and Webpack are very alien to me, even though they seem to be indispensable tools for writing safe, cross-browser apps.<p>What order do you recommend for learning the various aspects of JavaScript, and as an extension, front end development?<p>Thanks for your time.
======
codegeek
I am learning JS myself and here is the order that seems to work for me:

1\. DO not start with ANY framework. None. Forget about react, vuejs or
whatever the flavor of the month is. Just don't pay attention to it.

1\. Start with plain ES5. One good resource:

[http://eloquentjavascript.net](http://eloquentjavascript.net)

2\. Once you have a good grasp of ES5, then learn ES6. Again, for ES6, don't
worry about Babel or shit like that. Just learn the syntax and new things
about ES6 and directly test in Chrome

3\. Learn how to compile ES6 into ES5 (Babel etc)

4\. Learn Typescript (the daddy of all). Typescript will convert to ES5 or ES6
both. So make sure your concepts of ES5/ES6/ES(n) are clear before you do
typescript so that it is not all magic for you.

5\. Then, start learning about the bundlers and compilers like webpack and
Babel etc. For bundlers, webpack is hot right now. Babel is good for ES6 to
ES5 conversion but then again, typescript could take care of that.

6\. Finally, time for frameworks. Start with one. React is good. Vuejs is
good. They are all good at something. By the time you are at this step and you
did all the steps before it, you will know what you are doing.

My 2 cents. This could change depending on which month/year are we talking
about :)

~~~
PeterisP
Can you elaborate why you recommend starting with ES5 instead of going
directly for ES6, which allows doing some things in a bit more sane way?

It's just as likely that OP won't ever write any ES5, if any ES5 code will be
needed, then it will be generated/compiled.

~~~
codegeek
Only reason is that ES5 is technically the supported version by all major
browser as of today. Yes, you can write ES6 and compile to ES5 but I feel like
there are lot of goodies in ES5 that you will miss if you do directly with
ES6. Just a preference. I probably won't be saying this in next 2-3 years once
ES6 is the norm.

------
devwastaken
When learning about ES6, I found some nice videos on it.
[https://youtu.be/yswb4SkDoj0](https://youtu.be/yswb4SkDoj0)

No facecam, gimmicks, or bad audio/voice. Simply just shows the code, its
output, and outlines the logic.

~~~
applecrazy
These tutorials look really helpful, thanks.

------
ggrochow
Im a huge fan of 'You Don't Know JS' by Kyle Simpson (getify)

[https://github.com/getify/You-Dont-Know-JS](https://github.com/getify/You-
Dont-Know-JS)

------
GrumpyOldDev
In alignment to codegeek's recommendation, and depending on your conditions /
preferences:

You can also pick up small gig building more (and better) websites for local
businesses. There's always a dumpy restaurant wanting a new website for few
hundred bucks. The time you would spend with a textbook / tutorial, you can
also consider synchronously apply them to real life commercial use. Also, you
know Java and probably a lot of backend / db stuffs... you can bundle the
whole stack together and build business solutions too instead of just
"websites". Like a simple restaurant POS UI, sends order to kitchen kind of
system... again, depending on how much free time you have and willingness to
code for little pay just to learn.

JS / Front End Dev is one of the best setup to pair up with small jobs like
that IMO.

I can also recommend Douglas Crockford's book JavaScript: The Good Parts
[http://shop.oreilly.com/product/9780596517748.do](http://shop.oreilly.com/product/9780596517748.do)

Disclaimer: Never an academia kind of person, I take forever to go through any
book. I found myself learn faster when I can go hands-on and fail within
reasonable comforts. Now 15+ years into front end, I consider myself doing
quite alright...

------
matbram
Personally, the best resources that were invaluable to me were the Jon Duckett
books called...

JavaScript and jQuery: Interactive Front-End Web Development

[http://javascriptbook.com/](http://javascriptbook.com/)

and..

HTML and CSS: Design and Build Websites

[http://www.htmlandcssbook.com/](http://www.htmlandcssbook.com/)

The Javascript one gives a really solid foundation for learning Javascript
from the ground up and front-end web development in general. Also there are
practical examples of many things the beginner/average developer usually is
tasked with building and doing.

There is also the companion book that he did a couple years earlier on HTML
and CSS.

They are pretty much both the first things that show up on Amazon when you
search for Javascript and jQuery as well as HTML and CSS, and best sellers in
their respective category.

In terms of what you should start with, I'd recommend basic front-end
development, but browser extensions are good too.

Hope that helps!

------
Maciej001
This is a very good starting point: [https://sivers.org/learn-
js](https://sivers.org/learn-js). You can also check Wes Bos's courses that
are well regarded (wesbos.com). Choose one path and stick to it. Once you
finish and decide to learn React.js you may consider joining React in Flip
Flops ([https://www.reactinflipflops.com](https://www.reactinflipflops.com))
[I am organising it]

------
adamnemecek
To add to what codegeek said, "Secrets of the JavaScript Ninja" by John Resig
(the creator of jQuery) is also very good

[https://www.amazon.com/Secrets-JavaScript-Ninja-John-
Resig/d...](https://www.amazon.com/Secrets-JavaScript-Ninja-John-
Resig/dp/1617292850/ref=as_li_ss_tl?sa-no-
redirect=1&linkCode=ll1&tag=adamnemecek03-20&linkId=0a0b18b990c8ab79a86e8ce1fa3008b7)

------
nkkollaw
I never got as much as with this: [https://www.udemy.com/understand-
javascript/](https://www.udemy.com/understand-javascript/).

It explains not only how things are,but why. This IMO is the key to
understanding.

------
LiamPa
[https://www.codecademy.com/](https://www.codecademy.com/)

~~~
applecrazy
I've tried Codecademy for Python, but their approach doesn't really teach you
the concepts very well or in enough detail. For example, their AngularJS
tutorial didn't explain how to set up tooling or how to structure an
application. It just jumps into directives (I think?) without giving you much
context.

