Learn JavaScript in 2020: A curated and up-to-date list of resources

An acquaintance of mine wanted to add JavaScript to their engineering toolbox but they only learnt OOP with Java so far. I reviewed my JavaScript stash of links, discarded the outdated ones and ordered them:

---

Resources for learning JavaScript (and its ecosystem) in 2020

• Links are introduced in suggested order of reading
• Intended target: someone knowing to program but not in JavaScript
• all resources are free

Why?

1. Why investing in JavaScript? (blog post coming soon)

Fundamentals

1. A re-introduction to JavaScript (JS tutorial) https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript
2. Dan Abramov's "Just JavaScript" 1 to 9 https://offirmo-backups.github.io/my-time-machine/Dan%20Abramov%20-%20Just%20JavaScript/01.%20Mental%20Models.html
3. Mozilla's JavaScript Guide https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide
4. Promises https://web.dev/promises/
5. Eloquent JavaScript with an intro to the browser and node https://eloquentjavascript.net/
6. fetch intro: https://developers.google.com/web/updates/2015/03/introduction-to-fetch
7. async/await https://developers.google.com/web/fundamentals/primers/async-functions
8. 10 JavaScript concepts you need to know for interviews https://dev.to/arnavaggarwal/10-javascript-concepts-you-need-to-know-for-interviews

Advanced fundamentals

1. The Two Pillars of JavaScript Part 1: How to Escape the 7th Circle of Hell https://medium.com/javascript-scene/the-two-pillars-of-javascript-ee6f3281e7f3
2. The Two Pillars of JavaScript Part 2: Functional Programming, How to Stop Micromanaging Everything https://medium.com/javascript-scene/the-two-pillars-of-javascript-pt-2-functional-programming-a63aa53a41a4
3. Event Loop and the Big Picture (just the 1st one of the series for now) https://blog.insiderattack.net/event-loop-and-the-big-picture-nodejs-event-loop-part-1-1cb67a182810
4. 33 Concepts Every JavaScript Developer Should Know https://github.com/leonardomso/33-js-concepts
5. The Keys to JavaScript Mastery https://medium.com/javascript-scene/10-interview-questions-every-javascript-developer-should-know-6fa6bdf5ad95
6. JavaScript Garden = the most quirky parts of the JavaScript programming language how to avoid common mistakes and subtle bugs, as well as performance issues and bad practices http://bonsaiden.github.io/JavaScript-Garden/

Advanced ecosystem

Choose your path: frontend or backend. If you learn a bit of both, you can claim the legendary "fullstack" title.

Advanced: browser (frontend)

1. Roadmap https://roadmap.sh/frontend
2. Intro https://developer.mozilla.org/en-US/docs/Learn/Front-end_web_developer
3. DOM https://developer.mozilla.org/en-US/docs/Glossary/DOM
4. Web APIs https://developer.mozilla.org/en-US/docs/Web/API
5. Flux architecture https://facebook.github.io/flux/docs/in-depth-overview/
6. The core foundations of a delightful web experience https://developers.google.com/web/fundamentals
7. Security https://developers.google.com/web/fundamentals/security

Advanced: node (backend)

1. Roadmap https://roadmap.sh/backend
2. Setting up a JS environment https://medium.com/javascript-scene/setting-up-a-new-macbook-for-javascript-development-289df3f8f9
3. node basics http://nodejs.org/
4. express https://expressjs.com/
5. NodeJS Event Loop:
   1. Event Loop and the Big Picture https://blog.insiderattack.net/event-loop-and-the-big-picture-nodejs-event-loop-part-1-1cb67a182810
   2. Timers, Immediates and Process.nextTick https://blog.insiderattack.net/timers-immediates-and-process-nexttick-nodejs-event-loop-part-2-2c53fd511bb3
   3. Promises, Next-Ticks, and Immediates https://blog.insiderattack.net/promises-next-ticks-and-immediates-nodejs-event-loop-part-3-9226cbe7a6aa
   4. Handling IO https://blog.insiderattack.net/handling-io-nodejs-event-loop-part-4-418062f917d1
   5. Event Loop Best Practices https://blog.insiderattack.net/event-loop-best-practices-nodejs-event-loop-part-5-e29b2b50bfe2
   6. New Changes to the Timers and Microtasks in Node v11.0.0 https://blog.insiderattack.net/new-changes-to-timers-and-microtasks-from-node-v11-0-0-and-above-68d112743eb3
   7. JavaScript Event Loop vs Node JS Event Loop https://blog.insiderattack.net/javascript-event-loop-vs-node-js-event-loop-aea2b1b85f5c
6. Security TODO

Even more advanced

1. Jest, a delightful JavaScript Testing Framework https://jestjs.io/
2. TypeScript https://www.typescriptlang.org/
3. React:
   1. JavaScript fundamentals before learning React https://www.robinwieruch.de/javascript-fundamentals-react-requirements
   2. Roadmap https://roadmap.sh/react
   3. Official React documentation it's very good https://reactjs.org/
4. Progressive Web Apps https://web.dev/progressive-web-apps/
5. System design primer https://github.com/donnemartin/system-design-primer
6. GraphQL https://graphql.org/

---

Any other good resource I missed? Please share them in a comment.

Also published as a gist

Credits: https://dev.to/chrisachard/how-to-write-your-first-post-on-dev-c3k for the tips

Comments

[Ana Vela]

Thanks for putting this together!

[Offirmo]

Thanks @ana !

[veteranlogix11]

I have seen the post its very good content regarding java script but if you want to learn backend development then you just click the link below you will get good value and knowledge: veteranlogix.com/roadmap-of-back-e...

[Jana]

Precious !

[Offirmo]

Thanks @jana !

[Ravi Kasireddy]

Excellent stuff all at one place! Thanks

[Offirmo]

Thanks mate!