Ask HN: Best way to learn JavaScript in 2019?
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? 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... 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. 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. 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? By small project i mean, something not so complicated. It can be any size you want. For example, think about building an e-commerce website's front end with React, or a calculator app front end, anything you can do. You can't really build a CRUD App with React. It's a JS lib for building front end user interfaces. For the backend is when you'll need a CRUD app, not front end, backend can be built with Node, and understanding React makes it much easier for you to understand Node. Your React app will connect to an API endpoint for communication and for the app to work, you may be able to find free public API to use and connect to. If you can't find an API or a backend to use, use arrays or read from a local file, use that as a replacement for connecting to the API or database. For full stack:
Front can be: React, or Angular, e.t.c.
Backend: Node, Python, PHP, Java, C++, e.t.c. You'll use React pretty much for the whole of the front end. From user login, to admin dashboard, to JS animations, e.t.c. Hope this helps. > 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. 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". 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: and I second "Eloquent Javascript" - it's excellent. 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. > 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. >... 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! My book may work for you (free to read online): “JavaScript for impatient programmers”. http://exploringjs.com/impatient-js/toc.html 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. 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 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. 33 javascript concepts is a great repository for learning js especially if you already proficient in one language. It contains material for every topic in forms of blogs and video links. Do a trello list on the topics of this video and follow 'em religiously, Is working wonders for me: 10 Steps to Master Javascript within 15 Months | Is it possible? - WhatsDev:
https://www.youtube.com/watch?v=7JVNjwilPMU 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. You could take Vue.js course at Laracasts.com. It is really well done. Most of the course is free. 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. read code and practice