Add content for JavaScript variables

content/roadmaps/106-javascript/content/101-javascript-variables/100-variable-declarations/100-var.md

@@ -1 +1,13 @@
-# Var
+# [var] keyword
+
+The var statement declares a function-scoped or globally-scoped variable, optionally initializing it to a value.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var'>var keyword - MDN</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://javascript.info/variables'>JavaScript Variables</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/js/js_variables.asp'>JavaScript Variables - W3Schools</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.youtube.com/watch?v=6UAKBYpUC-Y'>Declaring Variables without Var, Let, Const - What Would Happen?</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/'>How to declare variables in different ways in JavaScript?</BadgeLink>
+
+
+

content/roadmaps/106-javascript/content/101-javascript-variables/100-variable-declarations/101-let.md

@@ -1 +1,8 @@
-# Let
+# [let] keyword
+
+The `let` declaration declares a block-scoped local variable, optionally initializing it to a value.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let'>let keyword - MDN Docs</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://javascript.info/variables'>JavaScript Variables</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/'>How to declare variables in different ways in JavaScript?</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/100-variable-declarations/102-const.md

@@ -1 +1,8 @@
-# Const
+# [const] keyword
+
+Constants are block-scoped, much like variables declared using the `let` keyword. The value of a constant can't be changed through reassignment (i.e. by using the assignment operator), and it can't be redeclared (i.e. through a variable declaration). However, if a constant is an object or array its properties or items can be updated or removed.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const'>const keyword - MDN Docs</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://javascript.info/variables'>JavaScript Variables</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/how-to-declare-variables-in-different-ways-in-javascript/'>How to declare variables in different ways in JavaScript?</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/100-variable-declarations/readme.md

@@ -1 +1,6 @@
-# Variable declarations
+# Variable Declarations
+
+To use variables in JavaScript, we first need to create it i.e. declare a variable. To declare variables, we use one of the `var`, `let` or `const` keywords.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables'>Storing the information you need — Variables</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/101-hoisting.md

@@ -1 +1,8 @@
-# Hoisting
+# Hoisting
+
+JavaScript Hoisting refers to the process whereby the interpreter appears to move the declaration of functions, variables or classes to the top of their scope, prior to execution of the code.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Glossary/Hoisting'>What is Hoisting - MDN Docs</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/javascript-hoisting/'>JavaScritp Hoisting</BadgeLink>
+

content/roadmaps/106-javascript/content/101-javascript-variables/102-naming-rules.md

@@ -1 +1,10 @@
-# Naming rules
+# Naming Rules
+
+A variable name should accurately identify your variable. When you create good variable names, your JavaScript code becomes easier to understand and easier to work with. Properly naming variables is really important. JavaScript also has some rules when it comes to naming variables; read about these rules through the links below. 
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.informit.com/articles/article.aspx?p=131025&seqNum=3'>Understanding Variables in JavaScript</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.dummies.com/article/technology/programming-web-design/javascript/naming-javascript-variables-142522/'>Naming JavaScript Variables</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.robinwieruch.de/javascript-naming-conventions/'>JavaScript Naming Conventions</BadgeLink>
+
+

content/roadmaps/106-javascript/content/101-javascript-variables/103-scopes/100-block.md

@@ -1 +1,7 @@
-# Block
+# Block Scope
+
+This scope restricts the variable that is declared inside a specific block, from access by the outside of the block. The let & const keyword facilitates the variables to be block scoped. In order to access the variables of that specific block, we need to create an object for it. Variables declared with the var keyword, do not have block scope.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/js/js_scope.asp'>JavaScript Scope</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/javascript-es2015-block-scoping'>Block Scoping in JavaScript</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/103-scopes/101-function.md

@@ -1 +1,8 @@
-# Function
+# Function Scope
+
+When a variable is declared inside a function, it is only accessible within that function and cannot be used outside that function.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/js/js_scope.asp'>JavaScript Scope</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://medium.com/nerd-for-tech/function-scope-block-scope-in-js-d29c8e7cd216'>Function Scope & Block Scope in JS</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.geeksforgeeks.org/all-about-functions-and-scopes-in-javascript/'>All about Functions and Scopes in JavaScript</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/103-scopes/102-global.md

@@ -1 +1,8 @@
-# Global
+# Global Scope
+
+Variables declared Globally (outside any function) have Global Scope. Global variables can be accessed from anywhere in a JavaScript program. Variables declared with `var`, `let` and `const` are quite similar when declared outside a block.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/js/js_scope.asp'>JavaScript Scope</BadgeLink>
+
+

content/roadmaps/106-javascript/content/101-javascript-variables/103-scopes/readme.md

@@ -1 +1,6 @@
-# Scopes
+# Scopes
+
+Before ES6 (2015), JavaScript had only Global Scope and Function Scope. ES6 introduced two important new JavaScript keywords: `let` and `const`. These two keywords provide Block Scope in JavaScript.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.w3schools.com/js/js_scope.asp'>JavaScript Scope</BadgeLink>

content/roadmaps/106-javascript/content/101-javascript-variables/readme.md

@@ -1 +1,7 @@
-# Javascript variables
+# Javascript Variables
+
+Most of the time, a JavaScript application needs to work with information. To store and represent this information in JavaScript codebase, we use variables. A variable is a container for a value.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://javascript.info/variables'>JavaScript Variables</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables'>Storing the information you need — Variables</BadgeLink>