Awesome JavaScript Resources

JavaScript is an object-oriented computer programming language commonly used to create interactive effects within web browsers. JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm. It has curly-bracket syntax, dynamic typing, prototype-based object-orientation, and first-class functions.

List inspired by the?awesome JamStack

A curated list of JavaScript resources for beginners. Please note that for each section, there will be so many links to both videos and articles, so You get to use anyone you prefer, as they almost convey the same message. I decided to add so many links, so you get to understand these topics from different angles written/taught by different writers/creators.

Table of Contents

• JavaScript Crash Courses
• Basic JavaScript
• Introduction to JavaScript
• Comments in JavaScript
• Variable Declaration
• Data Types
• Operators in JavaScript
• Strings
• Concatenation
• Arrays
• Function
• Objects
• Conditional Statement
• Loops
• ES6
• Introduction to ECMAScript 6(ES6)
• Generators
• Promises
• Arrow Functions
• New String & Number Methods
• Classes and Inheritance
• Let and Const Declaration
• Map, Weakset & WeakMap
• Template Literals
• JavaScript projects for beginners

JavaScript Crash Courses

Here are some complete JavaScript videos and guides to help you understand JavaScript as a whole. After you’ve taken the time to watch these videos or read through these guides, you can now move on to understanding individual concepts for a broader understanding.

Articles

• Learn JavaScript — Free JS Courses for Beginners — Freecodecamp

Videos

• JavaScript Crash Course For Beginners?— by Traversy Media
• JavaScript Programming — Full course?— by Freecodecamp.org
• JavaScript Tutorial for Beginners — Full Course in 8 Hours [2020]?— by Clever Programmer

Basic JavaScript

As a beginner it is very mandatory you understand JavaScript’s basics before proceeding to ES6.

Introduction to JavaScript

Things you need to know to get started with JavaScript.

Articles

• JavaScript Introduction — W3Schools
• An Introduction to JavaScript — Javascript.info
• What is JavaScript? Complete Introduction
• Introduction — JavaScript | MDN
• A re-introduction to JavaScript (JS tutorial) — JavaScript | MDN
• Introduction to JavaScript — GeeksforGeeks

Videos

• Introduction to JavaScript?— By freeCodeCamp
• JavaScript Tutorial for Beginners?— By Mosh
• Javascript beginner tutorial 1 — Introduction to JavaScript?— By Quentin Watt Tutorials

Comments in JavaScript

Writing comments in JavaScript.

Articles

• JavaScript Comments — W3Schools
• Comments — JavaScript.info
• JavaScript comment — javatpoint
• How to Write Comments in JavaScript — Tutorial Republic

Videos

• How to Comment Code — JavaScript Tutorial?— By Easy Learn Tutorial
• How To Write Comments In JavaScript?— by JavaScript Tutorials
• JavaScript Comments

Variable Declaration

Declaring variables in Javascript.

Articles

• JavaScript Variables — TutorialsTeacher
• JavaScript Variables — W3Schools
• Declaring JavaScript Variables: var, let and const ― Scotch.io
• Variables — JavaScript.info
• Variables and Datatypes in JavaScript — GeeksforGeeks
• The Ultimate Guide to JavaScript Variables: var, let, and const …
• Global and Local variables in JavaScript — GeeksforGeeks
• Understanding Local and Global Variables in JavaScript
• What is the difference between global and local Variables in JavaScript

Videos

• JavaScript how to properly declare a variable?— by techsith
• Variables in JavaScript?— by Kirupa Chinnathambi
• Variables — JavaScript Tutorial for Beginners?— by Easy Learn Tutorial
• Javascript Variables Explained?— by Clever Techie
• Local and global variables in javascript?— by kudvenkat
• Javascript Variables & Data Types?— by Dev Ed
• How to Create Variables in JavaScript?— by mmtuts
• JavaScript Variables?— by The Net Ninja

Data Types

Understanding the various Data types in JavaScript.

Articles

• Data types — JavaScript.info
• JavaScript Data Types — W3Schools
• JavaScript data types and data structures — JavaScript | MDN
• JavaScript Data Types — Tutorial Republic
• JavaScript data types — javatpoint
• Variables and Datatypes in JavaScript — GeeksforGeeks

Videos

• JavaScript: Introduction to Data Types?— by Renaissance Coders
• Intro to Data Types | JavaScript 101 Tutorials?— by Devmountain | Lehi
• Common Datatypes In JavaScript?— by mmtuts
• Different Data Types in JavaScript?— by mmtuts
• JavaScript Tutorial | Variables & Data Types?— by Telusko

Operators in JavaScript

Various Operators in JavaScript.

Articles

• Javascript Operators — TutorialsTeacher
• JavaScript Operators Reference — W3Schools
• JavaScript Operators — W3Schools
• JavaScript Comparison and Logical Operators — W3Schools
• Expressions and operators — JavaScript — MDN — Mozilla
• Basic operators, maths — JavaScript.info
• JavaScript — Operators — Tutorialspoint
• JavaScript operators — javatpoint
• JavaScript Operators — Tutorial Republic

Videos

• Different Types of Operators in JavaScript?— by mmtuts
• JavaScript Tutorial | Operators?— by Telusko
• Logical Operators?— by codedamn

Strings

Understanding Strings.

Articles

• String — JavaScript | MDN
• JavaScript Strings — W3Schools
• Strings — JavaScript.info
• JavaScript string — javatpoint
• 15 JavaScript String Functions — SitePoint
• JavaScript string methods & properties — TutorialsTeacher
• Strings — JavaScript.com
• JavaScript | Strings — GeeksforGeeks

Videos

• 20 String Methods in 7 Minutes?— by freeCodeCamp
• JavaScript Strings?— by Programming with Mosh
• String Operator in JavaScript Explained?— by mmtuts
• Working With Strings | JavaScript?— by Mike Dane
• Strings in JavaScript?— by kudvenkat

Concatenation

Various ways to concatenate.

Articles

• 3 Ways to Concatenate Strings in JavaScript — Mastering JS
• JavaScript | String concat() — GeeksforGeeks
• JavaScript String concat() Method — W3Schools
• Concatenating strings with the + operator — Scripting Master
• How to concatenate multiple string variables in JavaScript?

Videos

• Concatenation in Javascript?— by WebDevMentors
• Javascript String Concatenation?— by Dev Ed
• Strings and Concatenation in JavaScript?— by Kody Simpson
• JavaScript String Concatenation?— by Steve Griffith

Arrays

Understanding arrays and how to manipulate arrays.

Articles

• JavaScript Arrays — W3Schools
• Array — JavaScript | MDN
• Arrays — JavaScript.info
• Arrays | Codecademy
• Arrays in JavaScript — GeeksforGeeks
• Data Structures: Objects and Arrays :: Eloquent JavaScript
• JavaScript — The Arrays Object — Tutorialspoint
• JavaScript array — javatpoint
• Arrays — Learn JavaScript — Free Interactive JavaScript Tutorial
• Manipulating Arrays in JavaScript — Bolaji Ayodeji
• Hacks for Creating JavaScript Arrays — freeCodeCamp.org

Videos

• JavaScript Arrays?— by Programming with Mosh
• Javascript Arrays | Javascript Tutorial For Beginners?— by Dev Ed
• 8 Must Know JavaScript Array Methods?— by Web Dev Simplified
• Array in JavaScript | JavaScript Array Methods?— by edureka!
• JavaScript Tutorial | Introduction to Array?— by Telusko
• JavaScript Arrays?— by Chris Walker

Function

Understanding functions and how it can be used.

Articles

• Functions — JavaScript — MDN — Mozilla
• JavaScript Functions — W3Schools
• Functions — JavaScript.info
• JavaScript Functions — Understanding The Basics — codeburst
• JavaScript — Functions — Tutorialspoint
• Function in JavaScript — TutorialsTeacher
• Functions :: Eloquent JavaScript
• Functions in JavaScript — GeeksforGeeks
• JavaScript Define & Call Functions with Example — Guru99
• Functions — Learn JavaScript
• JavaScript function — javatpoint
• Functions | Codecademy

Videos

• JavaScript Functions?— by Programming with Mosh
• Functions — Beau teaches JavaScript?— by freeCodeCamp
• JavaScript Functions?— by edureka!
• JavaScript Functions Tutorial for Beginners?— by Clever Techie
• Functions in Javascript for beginners?— by Awais Mirza
• Javascript Functions?— by LearnCode.academy
• Introduction to functions in javascript?— by Hitesh Choudhary

Objects

Objects in JavaScript.

Articles

• JavaScript Objects — W3Schools
• Object — JavaScript | MDN
• Objects | Codecademy
• Objects — JavaScript.info
• Objects in Javascript — GeeksforGeeks
• Data Structures: Objects and Arrays :: Eloquent JavaScript
• JavaScript Object — TutorialsTeacher
• JavaScript Objects — javatpoint
• How to create objects in JavaScript — freeCodeCamp.org
• Working with Javascript Objects and Arrays | UniversalClass
• How To Use Object Methods in JavaScript | DigitalOcean
• A Deeper Look at Objects in JavaScript — Kirupa

Videos

• What Are Objects in JavaScript & How to create them?— by mmtuts
• JavaScript — Objects?— by Yusuf Shakeel
• What’s an Object in JavaScript??— by O’Reilly
• JavaScript OBJECTS in ONE Video?— by Code Explained
• Modern JavaScript Tutorial — Objects?— by The Net Ninja
• Different Ways of Creating Objects in JavaScript?— by Steve Griffith

Conditional Statements

Conditional statement in Javascript.

Articles

• JavaScript if else else if — W3Schools
• Making decisions in your code — conditionals
• Conditionals | Codecademy
• JavaScript Conditional Statements: IF, Else, Else IF
• Conditional Statements in JavaScript | Study.com
• JavaScript — if…else Statement — Tutorialspoint
• JavaScript Conditionals: The Basics with Examples
• Conditional operators: if — JavaScript.info
• Conditional Basics: Using If Statements in JavaScript
• if-else Statement in JavaScript — GeeksforGeeks

Videos

• How to Create Conditions in JavaScript?— by mmtuts
• How to use if/else conditions in JavaScript?— by Zenva
• Conditional statements in javascript?— by kudvenkat
• JavaScript if else (tutorial)?— by Programming with Mosh
• complex conditions?— by Quentin Watt Tutorials
• Conditionals (if statement)?— by sentdex

Loops & Iteration

Detailed resources to perfectly understand Loops.

Articles

• JavaScript for Loop — W3Schools
• JavaScript while Loop — W3Schools
• Loops and iteration — JavaScript | MDN
• Loops in JavaScript — GeeksforGeeks
• JavaScript Array Iteration — W3Schools
• JavaScript Loops — javatpoint
• JavaScript While, Do-While, For and For-In Loops — Tutorial Republic
• JavaScript — For Loop — Tutorialspoint
• JavaScript Loops Explained: For Loop, While Loop, Do…while — freecodecamp.org
• Exploring JavaScript Iteration — freeCodeCamp.org
• Ways of iterating over a array in JavaScript. — GeeksforGeeks
• Looping JavaScript Arrays Using for, forEach & More

Videos

• JavaScript Loops?— by Programming with Mosh
• JavaScript Loops Tutorial for Beginners?— by Clever Techie
• For Loops — Beau teaches JavaScript?— by freeCodeCamp.org
• JavaScript Loops?— by Coding Journey
• JavaScript Loops Made Easy?— by codeSTACKr
• JavaScript Tutorial | For Loop?— by Telusko
• Using JavaScript forEach to Loop over an Array?— by Love2Dev

ES6

Introduction to ECMAScript 6(ES6)

Articles

• ECMAScript 6 — W3Schools
• Introduction To Es6 — Learn.co
• Introduction to ES6 — GeeksforGeeks
• Introduction to ES6 modules — Bolaji Ayodeji
• ES6 Tutorial — JavaScript Tutorial
• ES6 Intro | LearnersBucket

Videos

• ES6 JavaScript Tutorial for Beginners — Getting Started?— by Academind
• ES6 Tutorial — #1 Intro?— by Code Realm
• ES6 Tutorial 1: Introduction?— by codedamn

Generators

Articles

• Understanding Generators in ES6 JavaScript with Examples
• Iterators and generators — JavaScript | MDN
• Introduction to Generators in ES6 — CodinGame
• Understanding Generators in ES6 Javascript — DEV
• JavaScript Generators

Videos

• JavaScript ES6 / ES2015 — Generators?— by Traversy Media
• JavaScript ES6 Tutorial — Generators?— by The Net Ninja
• Using Generators in JavaScript ES6?— by Paul Halliday
• Javascript Generators — THEY CHANGE EVERYTHING — ES6?— by LearnCode.academy
• JavaScript Generators?— by Kyle Robinson Young
• ES6 Iterator & Generator Fundamentals?— by Steve Griffith

Promises

Articles

• Promise — JavaScript | MDN
• ES6 — Promises — Tutorialspoint
• A Simple Guide to ES6 Promises — codeburst
• JavaScript Promises: An introduction — Web.dev
• Promises in JavaScript with ES6 / ES2015 ← Alligator.io
• ES6 | Promises — GeeksforGeeks
• The Definitive Guide to the JavaScript Promises
• ES6 Promises in Depth — Pony Foo
• JavaScript Promise Tutorial: Resolve, Reject, and Chaining explained
• Promises for asynchronous programming — Exploring JS
• Promise — JavaScript.info
• Promises chaining — JavaScript.info
• JavaScript Promises for Dummies ― Scotch.io

Videos

• JavaScript ES6 / ES2015 — Promises?— by Traversy Media
• JavaScript Promises In 10 Minutes?— by Web Dev Simplified
• ES6 Promises — JavaScript?— by Paul Halliday
• Promise In JavaScript ES6?— by Cheezy Code
• JavaScript promises explained tutorial?— by techsith
• ES6 Tutorial — Promises (then / catch)?— by Code Realm

Arrow Functions

Articles

• JavaScript Arrow Function — W3Schools
• Arrow function expressions — JavaScript | MDN
• Arrow functions, the basics — JavaScript.info
• Getting Started with ES6 Arrow Functions in JavaScript
• When (and why) you should use ES6 arrow functions
• A Gentle Introduction to JavaScript Arrow Function
• A tutorial to JavaScript Arrow Functions — Flavio Copes

Videos

• JavaScript ES6 Arrow Functions Tutorial?— by Web Dev Simplified
• Javascript ES6 — Arrow Functions?— by DoingITeasyChannel
• ES6 Arrow Function?— by The Coding Train
• Arrow functions in JavaScript — What, Why and How?— by Fun Fun Function
• Arrow Functions (short syntax)?— by dcode
• ES6 JavaScript Arrow Functions?— by Steve Griffith
• Arrow Functions — Beau teaches JavaScript?— by freeCodeCamp.org
• JavaScript ES6 / ES2015 — Arrow Functions?— by Traversy Media
• ES6 arrow functions?— by TempleCoding

String & Number Methods

Articles

• ES6 in Action: New Number Methods — SitePoint
• ES6 | New String Methods — GeeksforGeeks
• JavaScript Number Methods — W3Schools
• ES6 — Number — Tutorialspoint
• ES6 — Strings — Tutorialspoint

Videos

• JavaScript ES6 / ES2015 — New String & Number Methods?— by Traversy Media
• Learn Javascript ES6 String and Number methods?— by Code Marshal
• Learn Javascript- Number Methods in Javascript?— by Unacademy — Programming
• Number methods and math objects in JavaScript?— by mmtuts
• 20 String Methods in 7 Minutes?— freecodecamp.org

Classes and Inheritance

Articles

• Classes and Inheritance: JavaScript ES6 Feature Series
• Classes — JavaScript | MDN
• Class inheritance — JavaScript.info
• Understanding ECMAScript 6: Class and Inheritance — SitePoint
• JavaScript Inheritance Using extends And spper Keywords
• Inheritance in JavaScript — TutorialsTeacher

Videos

• JavaScript ES6 / ES2015 — Classes and Inheritance?— by Traversy Media
• Inheritance in JavaScript?— by The Coding Train
• ES6 Tutorial — Classes?— by Code Realm
• JavaScript ES6 — Classes?— by Nodecasts
• Object Oriented JavaScript Tutorial — Class Inheritance?— by The Net Ninja
• JavaScript Classes : Inheritance & Extends?— by dcode
• JavaScript ES6 : class , method and inheritance?— by Tutplus24

Let and Const Declaration

Articles

• const — JavaScript | MDN
• Let and Const in JavaScript with ES6 / ES2015 ← Alligator.io
• ES6 in Action: let and const — SitePoint
• Declaring JavaScript Variables: var, let and const ― Scotch.io
• Var, Let, and Const — What’s the Difference?
• JavaScript ES6 Variable Declarations with let and const
• Breaking Down ES6: let and const — DEV

Videos

• JavaScript ES6 / ES2015 — Let and Const Declaration?— by Traversy Media
• var, let and const — ES6 JavaScript Features?— by Fun Fun Function
• var, let and const in Javascript explained?— by Coding Blocks
• How to Code — JavaScript Const and Let?— by OpenCanvas
• JavaScript ES6 — var, let and const?— by Nodecasts

Map, Weakset & WeakMap

Articles

• ES6 Collections: Using Map, Set, WeakMap, WeakSet
• WeakMap — JavaScript | MDN
• Keyed Collections in JavaScript: Set vs Map vs WeakSet vs WeakMap
• ES6 — set, map, weak — ECMAScript 2015 — Medium
• Maps and Sets — Exploring JS

Videos

• JavaScript ES6 / ES2015 — [08] Set, Map, WeakSet?— by Traversy Media
• JavaScript ES6 : Set, Map, WeakSet , WeakMap?— by Tutplus24
• JavaScript Set vs Map vs WeakSet vs WeakMap?— by Typing Turtle
• ES6 Tutorial 15: Weakmaps?— by codedamn
• Map, Set, WeakMap & WeakSet in JavaScript?— by JS Helper

Template Literals

Articles

• Template literals (Template strings) — JavaScript | MDN
• JavaScript Template Literals
• JavaScript | template literals — GeeksforGeeks
• JavaScript — What are Template Literals — codeburst
• An Introduction to ES6 Template Literals — DEV
• All you need to know about Template literals in ES6: JavaScript
• What Are Template Literals In Javascript And Why You Should use them

Videos

• Template Literals (ES6) — Beau teaches JavaScript?— by freeCodeCamp.org
• JavaScript ES6 / ES2015 — Template Literals?— by Traversy Media
• JavaScript Template Literals?— by Programming with Mosh
• Template Literals in ES6?— by Paul Halliday

JavaScript projects for beginners

• Build 15 JavaScript Projects with Vanilla JavaScript?— by Freecodecamp.org