Find me:

Welcome to the JavaScript Programming Course! This course is designed to provide you with a comprehensive understanding of JavaScript, one of the most widely-used programming languages in web development today.

Course Overview

JavaScript is a versatile language that powers the interactive elements of websites, making it an essential skill for front-end developers. In this course, you will learn the fundamentals of JavaScript programming, including:

• Basic Syntax: Understand the syntax and structure of JavaScript code.
• Data Types and Variables: Explore different data types such as strings, numbers, arrays, and objects, and learn how to declare and manipulate variables.
• Control Flow: Master control flow structures including if statements, loops, and switch statements to control the execution of your code.
• Functions: Learn how to define and invoke functions, pass parameters, and return values.
• DOM Manipulation: Discover how to manipulate the Document Object Model (DOM) to create dynamic and interactive web pages.
• Events: Handle user interactions and respond to events such as clicks, mouse movements, and keyboard inputs.
• Asynchronous JavaScript: Understand asynchronous programming concepts using callbacks, promises, and async/await to work with asynchronous tasks effectively.

Prerequisites

This course is designed for beginners with no prior programming experience. However, a basic understanding of HTML and CSS will be beneficial.

Course Structure

The course is divided into several modules, each covering specific topics with hands-on exercises and coding challenges to reinforce your learning. Whether you're a beginner looking to start your journey into web development or an experienced programmer aiming to enhance your JavaScript skills, this course offers something for everyone.

Getting Started

To get started with the course, simply clone or download the repository and follow the instructions provided in each module's README file. You can also join our community forums to connect with fellow learners, ask questions, and share your experiences.

---

Feel free to customize the introduction to suit your course's specific goals and target audience. Good luck with your JavaScript course!

Course Content

Section 1: Welcome

1. Course Structure and Projects
2. Watch Before You Start!
3. Setting Up Code Editor

Section 2: JavaScript Fundamental - Part 1

5. Section Intro
6. Hello World!
7. A Brief Introduction to JavaScript
8. Linking a JavaScript File
9. Value and Variables
10. Data Types
11. let, const and var
12. Basic Operators
13. Operator Precedence
14. String and Template Literals
15. Taking Decision: if and else Statements
16. Truthy and Falsy Values
17. Equality Operators: == & ===
18. Boolean Logic
19. Logical Operators
20. The Switch Statement
21. Statements And Expressions
22. The Conditional (Ternary) Operator
23. JavaScript Releases: ES6, ES6+ and ESNext

Section 3: JavaScript Fundamental - Part 2

24. Section Intro
25. Activate Stric Mode ('use strict')
26. Functions
27. Function Declaration vs. Expressions
28. Arrow Functions
29. Functions Calling other Functions
30. Reviewing Functions
31. Introduction to Arrays
32. Basic Operations (Methods)
33. Introduction to Objects
34. Dot . vs. Bracket {} Notation
35. Object Methods
36. Iteration: for loop
37. Looping Arrays, Bracking and Continuing
38. Looping Backword and Loops in Loops
39. The while loop

Section 4: Developer Skills & Editor Setup

40. Section Intro
41. Setting up Prettier and VS Code
42. Installing Node.js and Setting Up Dev Environment
43. Learning How to Code?
44. How to Think Like a Developer: Become a Problem Solver!
45. Using Google, StackOverflow and MDN
46. Dubbing (Fixing Errors)
47. Debugging with the Console and Breakpoints

Section 5: JavaScript in the Browser: DOM and Events Fundamentals

48. Section Intro and Roadmap
49. PROJECT #1
50. What's the DOM and DOM Manipulation
51. Selecting and Manipulating Elements
52. Handling Click Events
53. PROJECT #2
54. Manipulating CSS Style
55. PROJECT #3
56. Working with Classes
57. Handling and Esc Keypress Even
58. PROJECT #4

Section 6: How JavaScript Works Behind the Scenes

59. Section Intro
60. An High-Level Overview of JavaScript
61. The JavaScript Engine and Runtime
62. The JavaScript Context and The Call Stack
63. Scope and The Scope Chain
64. Scoping in Practice
65. Variable Environment: Hoisting and TDZ
66. Hoisting and TDZ in Practice
67. The this Keyword
68. The this Keyword Practice
69. Regular Function vs. Arrow Functions
70. Premetive vs. Objects ( Premitive vs. Reference Type )
71. Premitives vs. Objects in Practice

Section 7: Data Structure, Modern Operators and Strings

72. Section Intro
73. Destructuring Arrays
74. Destructuring Objects
75. The Spread Operator ...
76. Rest Pattern and Parameters
77. Short Circutting && and ||
78. The Nullish Coalescing Operator ??
79. Logical Assignment Operators
80. Looping Arrays: The for-of loop
81. Enhanced Object Literals
82. Operational Chaining ?.
83. Looping Objects: Objects Keys, Values and Entries
84. Sets
85. Maps: Fundamental
86. Maps: Iteration
87. Summary: Which Data Structure to Use?
88. Working with Strings - Part 1
89. Working with Strings - Part 2
90. Working With Strings - Part 3
91. String Methods Practice

Section 8: A Closer Look at Functions

92. Section Intro
93. Default Parameters
94. How Passing Arguments Works: Value vs. Reference
95. First-Class and Higher-Order Functions
96. Functions Accepting Callback Functions
97. Function Returning Functions
98. The Call and Apply Methods
99. The Bind Method
100. Immediately Invoke Function Expressions (IIFE)
101. Closures
102. More Closures Examples

Section 9: Working With Arrays

103. Section Intor
104. Simple Array Methods
105. The new at Method
106. Looping Arrays: forEach
107. forEach with Maps and Sets
108. PROJECT #5
109. Creating DOM Elements
110. Data Transfer: map, filter and reduce
111. The Map Methods
112. The filter method
113. The reduce method
114. The Magic of Chaining Methods
115. The find method
116. The findindex Method
117. some and every
118. Sorting Array
119. flat and flatMap
120. More Ways of Creating and Filling Arrays
121. Summary: Which Arry Method to use?
122. Array Method Practice

Section 10: Numbers, Dates, Intl and Timers

123. Section Into
124. Converting and Checking Numbers
125. Math and Rounding
126. The Remainder Operator
127. Numberic Separators
128. Working with BigInt
129. Creating Dates
130. Adding Dates to UI
131. Operatons With Dates
132. Internationalizing Dates(Intl)
133. Internationalizing Numbers (Intl)
134. Timers: setTimeout and setInterval
135. Implementing a Countdown Timer

Section 11: Advanced DOM and Events

136. Section Intro
137. PROJECT #6
138. How to DOM Really Works?
139. Selecting, Creating, and Deleting Elements
140. Styles, Attribures and Classes
141. Implementing Smooth Scrolling
142. Types of Events and Event Handlers
143. Event Propagantion: Bubbling and Capturing
144. Event Propagation in Practice
145. Event Delegation: Implementing Page Navigation
146. DOM Traversing
147. Building a Tabbed Component
148. Passing Arguments to Event Handlers
149. Implementing a Sticky Navigation: The Scroll Event
150. A Better Way: The Intersection Observer API
151. Revealing Elements on Scroll
152. Lazy Loading Images
153. Building a Slider Cmoponent: Part 1
154. Building a Slider Component: Part 2
155. Lifecycle DOM Events
156. Efficient Script Loading: defer and async

Section 12: Oject-Oriented Programming

157. Section Intro
158. What is object-oriented Programming?
159. OPP in JavaScript
160. Constructor Functions and the new Operator
161. Prototype
162. Prototypal Inheritance and The Prototype Chain
163. Prototypal Inheritance on Bult-In Objects
164. ES6 Classes
165. Setters and Getters
166. Static Mehtods
167. Object.create
168. Inheritance Between "Classes": Constructor Functions
169. Inheritance Between "Classes": ES6 Clesses
170. Inheritance Betwenn "Classes": Object.create
171. Another Class Example
172. Encapsulation: Protected Properties and Methods
173. Chaining Methods
174. ES6 Classes Summary

Section 13: Mapty App: OOP, Geolocation, External Libraries, and More!

175. Section Intro
176. Project #7 Overview
177. How to Plan a Web Project
178. Using the Geolocation API
179. Desplaying a Map Using Leaflet Library
180. Display a Map Maker
181. Rendering Workout Input Form
182. Project Archetecture
183. Refectoring for Project Archetecture
184. Managing Workout Data: Creating Classes
185. Creating a New Workout
186. Rendering Workouts
187. Move to Marker On Click
188. Workout with localStorage
189. Final Considerations

Section 14: Asynchronous JavaScript: Promises, Async/Await, and AJAX

190. Section Intro
191. Asynchronous JavaScript, AJAX and APIs
192. IMPORTANT: API URL change
193. Our First AJAX Call: XHTMLHttpRequest
194. [OPTIONAL]: How the Web Works: Request and Response
195. Welcome to Callback Hell
196. Promises and the Fetch API
197. Consuming Promises
198. Chainig Promises
199. Handeling Rejected Promises
200. Throwing Errors Manually
201. Asynchronous Behind the Scenes: The Event Loop
202. The Event Loop in Practice
203. Building a Simple Promise
204. Promisifying the Geolocation API
205. Consuming Promises with Async/Await
206. Error Handeling wiht try and catch
207. Returning Values from Async functions
208. Running Promises in Parallel
209. Other Promise Combinators: race, allSettled and any

Section 15: Modern JavaScript Development: Modules, Tooling and Functional

210. Section intro
211. An Overview of Modern JavaScript Development
212. An Overview of Modules in JavaScript
213. Exporting and Importing in ES6 Modules
214. Top-Level await (ES2022)
215. The Module Pattern
216. CommonJs Modules
217. A Brief Introduction to the Command Line
218. Introduction to NPM
219. Bundling with Parcel and NPM Scripts
220. Configuring Babel and Polyfiling
221. Review: Writing Clean and Modern JavaScript
222. Let's Fix Some Bad Code: Part 1
223. Declarative and Functional JavaScript Principles
224. Let's Fix Some Bad Code: Part 2

Section 16: COMPLETE PROJECT (Surprise)

Section 17: Setting Up Git and Deployement

225. Section Intro
226. Simple Deployement with Netlify
227. Setting Up Git and GitHub
228. Git Fundamentals
229. Pushing to GitHub
230. Setting Up Continuous Intregration with Netlify

Explore other resources :