WingNews logo WingNews GitHub [2]
top | item 19829235

Ask HN: Best way to learn JavaScript in 2019?

53 points| Calist0 | 6 years ago | reply

I'm a frontend developer and I know enough JS (with JQuery) to get by to create simple web interactivity. It's time for me to learn the fundamentals, so I can then learn libraries like React.

What's the best way to learn? I've completed some beginner level courses on codecademy and others, but forgot much of what I learned within a month or two. I searched here to find books that are recommended, but it seems that many are outdated (without ES6), for instance: Professional JavaScript for Web Developers, which has great reviews, but no ES6. What I know about JS has been learned through doing it and researching the solution and learning bits at a time-- not a great way to learn.

I'm thinking of trying a course on udemy. Along with finding a book to read on the side. Suggestions?

22 comments

order
[+] BGthaOG|6 years ago|reply
There is also the "You Don't Know JS" series, which is free online. I have heard positive things about it, the last installment includes ES6.

From the linked README:

"This is a series of books diving deep into the core mechanisms of the JavaScript language. The first edition of the series is now complete.

[...]

These books are being released here as drafts, free to read, but are also being edited, produced, and published through O'Reilly."

https://github.com/getify/You-Dont-Know-JS/blob/master/READM...

[+] IneffablePigeon|6 years ago|reply
I'm a big fan of this one for getting to grips with the nitty gritty basics of JavaScript - in particular it's my go to when I forget how prototype inheritance and `this` work exactly for the umpteenth time.
[+] sammad|6 years ago|reply
I suggest you really practice the fundamentals, especially es6. You're gonna use a lot of es6 concepts in React. Really learn the fundamentals and you'll be fine.

Most importantly, practice everyday. Take 10 - 30 mins to create a small react app. Spaced repetition is a very powerful concept in mastering any skill. Finally, try building a small project with React. Anything you like. Just build something, here's why:

1. You'll learn more by building a small project yourself than watching those videos/tutorial of any kind, because you'll get to a point where you'll have issues with your code, things won't work, (trust me, this happens alot to beginners), then you'll research online. This'll give more understanding about how React works, than just watching tutorial.

2. You'll have a small project in your portfolio, which can be useful later on.

Good luck.

[+] FishAngular12|6 years ago|reply
When you mean small project, do you mean try building a CRUD app?

If someone were to dive in to this to learn React as part of a Full Stack, what are some ideas where you'd use React, but also all of the back end tools to make it a full stack application?

[+] wa1987|6 years ago|reply
> It's time for me to learn the fundamentals, so I can then learn libraries like React.

There are more effective ways to learn. Instead of learning "bottom-up", start with your end-goal, e.g. creating apps with React.

This is a good start:

https://reactjs.org/tutorial/tutorial.html

You'll find out what you need, and, more importantly, what you don't need to know along the way.

[+] yura|6 years ago|reply
This is good advice. Learning something of a higher level of abstraction (e.g. React) without knowing how JS works sounds bad in theory, but it appears OP knows enough JS that it'd be better to just dive into React.

A pure, fundamentalist "bottom-up" approach will make you drown in boredom really fast, because you'll be learning very specific syntax details and language gotchas that you don't even know what they're useful for. But when you've been coding in React for a while, and you've had quite a few problems with the "this" expression, then going back to really understand how "this" works will be much more enlightening.

So my recommendation would also be this: Dive into React, or whatever is your end goal, and create stuff. Once you get stuck or feel like your knowledge of JS is inappropriate or you're falling for the same language gotchas without really understanding them, then read "You Don't Know JS".

[+] CyberFonic|6 years ago|reply
I find that learning "pure JS" is the key. The various frameworks are great for productivity but it is easy overlook the principles and learn the framework specific way of doing things. ES6 introduces features that were missing in earlier versions and needed polyfills, external tools and frameworks.

The two resources that I found to be most useful are:

http://eloquentjavascript.net

and

http://exploringjs.com/es6/

[+] jimmahoney|6 years ago|reply
I second "Eloquent Javascript" - it's excellent.
[+] algodaily|6 years ago|reply
Go through around 100 exercises on https://freecodecamp.com for the fundamentals, and then maybe 50 or so on https://algodaily.com/challenges for more advanced techniques.

This should take you roughly 100 hours, but afterwards you'll be extremely well suited to start tackling JS libraries and building your own projects.

[+] codingdave|6 years ago|reply
> What I know about JS has been learned through doing it and researching the solution and learning bits at a time

I don't think there is anything wrong with this approach. Most developers learn this way. And many React developers don't know the fundamentals of JS all that well, because you can go a long way in React just by following conventions. So if React is your goal, just go find some tutorials and start doing it.

[+] rl3|6 years ago|reply
>... but it seems that many are outdated (without ES6), for instance: Professional JavaScript for Web Developers, which has great reviews, but no ES6.

Professional JavaScript for Web Developers was the text I used to deep dive on the language in 2012, and it was fantastic. The chapters that dealt with prototype inheritance, scope chains, and execution context provided for a very solid command of the language at the time. Nicholas C. Zakas is an excellent author.

Understanding ECMAScript 6: The Definitive Guide for JavaScript Developers 1st Edition was also written by Zakas, although I have not read it. Unfortunately since it was released in 2016, it likely lacks some of the later revisions to ECMAScript that have been ratified since.

Honorable mention includes Secrets of the JavaScript Ninja, but it's also an old book. Despite its campy name, it provided some of the best visual explanations of advanced JavaScript topics I've ever seen. Granted, I just read a few of the chapters.

I recently had to skill up and take the leap from my pre-ES6 knowledge into the bleeding edge, and the way I did that was to just read MDN (Mozilla Developer Network) pages where necessary, maybe the occasional blog post assuming it seemed of sufficient caliber.

Of course, the hardcore way to deep dive is simply read the latest ECMA spec directly, but I wouldn't recommend that route for where you're at right now unless you're really curious about a particular mechanic.

Based on a cursory search and taking a gander at its index, Eloquent JavaScript, 3rd Edition: A Modern Introduction to Programming (December 4, 2018) looks pretty good.

Some other commenters are saying the "learn as you go" approach is sufficient, and it certainly is initially, but at some point I highly recommend deep diving into how more advanced features of the language work so that you have a solid command of the language.

Either way, best of luck and happy learning!

[+] amolo|6 years ago|reply
If you already know jQuery then you understand what all these frameworks and libraries are trying to solve.So....

Tip 1 So find some introduction videos just to get a hang on the concepts. Avoid those "Airbnb in one hour" type of videos. Just the basics. I suggest thenewboston.

Tip 2 Go to Medium and Github, then find some well written code and read it try to understand what is happening and why.

Tip 3 Break down a few of those projects. Especially the simple ones. Simple CRUD, todo lists etc.

Tip 4 Try to reconstruct some of the projects from the ground up.

Tip 5... You are already there. Explore.

[+] quickthrower2|6 years ago|reply
There is a lot to be said for reading Mozilla Developer Network articles and playing in the chrome console. The fast feedback of a REPL makes you learn fast
[+] tmm84|6 years ago|reply
Is your knowledge of basic vanilla JS good? If that is the case then I recommend looking at https://babeljs.io/docs/en/learn for a simple overview of the new features in ES6. There are more in depth sites for ES6 but I think the above link covers what you probably are going to use.
[+] tones411|6 years ago|reply
I think a good way is to pick a framework or library and start building something that you would use for yourself. If you choose react then just start building and as you hit things you don't know how to do, refer back to the course or search the Internet for the solution. Just start building something.
[+] julienreszka|6 years ago|reply
Try messing with the DOM In the browser console (I use Chrome). It feels close to playing a music instrument because it is reacting fast and you can preview what your code does. I find this most enjoyable.