English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 40 Hours | 17.3 GB
Basic Introduction to Javascript by Building Many Interesting Projects
Three fundamental languages of the web are HTML, CSS and Javascript.
Html is used for structure, CSS is used for styling and Javascript is used for functionality.
Reasons to learn Javascript
Number One – Javascript is the most popular programming language in the world.
Number Two – Javascript is de facto language of the web
Number Three – Javascript is Easy to learn
Number Four – Knowing Javascript provides great opportunity to get a job
Number Five – Javascript is Everywhere.Javascript is not web-exclusive anymore. Its on the servers (NODE.JS), cross-platform desktop-apps etc…
This step by step course is intended for everyone who wants to start working with Javascript.
We will cover what is Javascript, how to add Javascript to our projects, how to start working with Javascript and at the end we will make few simple projects. A basic knowledge of HTML, CSS would be preferred.
What you’ll learn
- students will know what is Javascript
- students will know how to add Javascript to their projects
- students will know the basics of working with Javascript
- students will build few simple projects using Javascript
Table of Contents
Introduction
1 Intro
2 Goals
3 Structure
4 Video Blur Fix
5 Course Review
Visual Studio Code and Course Setup
6 Dev Setup Intro
7 VS-Code and Chrome
8 Extensions
9 Emmet
Javascript Basics
10 Basics Intro
11 Basic Project
12 Inline Javascript
13 Internal Javascript
14 External Javascript
15 Cleanup Workspace
16 Helper Methods
17 Statements and Comments
18 Variables
19 Assign Variable Value Later
20 Variable Naming Rules
21 const, let, var
22 Quotation Marks
23 String Concatenation
24 Numbers Basics
25 Numbers – Additional Features
26 Implicit Type Conversion
27 Data Types
28 Arrays
29 Functions – Declare, Invoke
30 Functions – Parameters, Arguments
31 Functions – Return
32 Function Expressions
33 Objects
34 Conditional Statements – Basics
35 Conditional Statements Continued
36 Equality
37 Logical Operators
38 Switch Statement
39 while Loops
40 do while loops
41 for loop
Javascript Tutorial Continued
42 Connecting The Dots
43 String Properties and Methods
44 Template Literals
45 Array Properties and Methods
46 Exercise – Full Name
47 Exercise – Calculate Total
48 Value vs Reference
49 Null and Undefined
50 Truthy and Falsy
51 Ternary Operator
52 Global Scope
53 Local Scope
54 Variable Lookup
55 Callback Functions, Higher Order Functions
56 Array Iterators
57 forEach
58 map
59 filter
60 find
61 reduce
62 Math Object
63 Date Object
DOM
64 DOM – Intro
65 DOM – General Concepts
66 Window and Document Overview
67 Get Element By ID
68 Get Elements By Tag Name
69 Get Element By Class Name
70 Query Selector and Query Selector ALL
71 Navigate the DOM – Children
72 Navigate the DOM – parentElement
73 Navigate the DOM – nextSibling, previousSibling
74 Navigate the DOM – nextElementSibling, previousElementSibling
75 textContent nodeValue
76 getAttribute() setAttribute()
77 classList and className
78 createElement – createTextNode – appendChild
79 insertBefore
80 replaceChild
81 prepend innerText
82 remove removeChild
83 innerHTML and textContent
84 Change CSS with style property
85 Events Overview
86 Click Event
87 Function Reference
88 Mouse Events
89 Key Events
90 Event Object
91 CurrentTarget vs Target
92 Event Propogation – Bubbling- Capturing
93 Event Propogation Example
94 Forms
95 Local Storage
96 Local Storage With Multiple Values
DOM Projects
97 Intro
98 Starter Project
99 Setup
100 Color Flipper – Simple HTML
101 Color Flipper – Simple Javascript
102 Color Flipper – Hex
103 Counter HTML
104 Counter JS
105 Reviews HTML
106 Reviews JS
107 Navbar HTML
108 Navbar General Concepts
109 Navbar JS
110 Sidebar HTML
111 Sidebar Manual Setup
112 Sidebar JS
113 Modal HTML
114 Modal Challange
115 Modal JS
116 Questions HTML
117 Questions General Concept
118 Questions JS – Traversing the DOM
119 Questions JS – Using Selectors Inside the Element
120 Menu HTML
121 Display Items When Page Loads
122 Refactor
123 Filter Buttons HTML
124 Filter Buttons JS
125 Dynamic Filter Buttons
126 Unique Categories
127 Dynamic Filter Buttons Complete
128 Video Intro
129 Video HTML
130 Video Overlay Setup
131 Video JS
132 Video Preloader
133 Scroll Intro
134 Scroll HTML
135 Scroll – Setup Date
136 Scroll – Toggle Simple Setup
137 Scroll – Toggle Dynamic
138 Scroll – Fixed Navbar
139 Smooth Scroll Setup
140 Smooth Scroll Complete
141 Tabs HTML
142 Tabs JS
143 Countdown HTML
144 Set Date
145 Calculate Remaining Time
146 Time From Now
147 Lorem Ipsum HTML
148 Lorem Ipsum JS
149 GroceryBud – Intro
150 GroceryBud – HTML
151 GroceryBud – Select Elements
152 GroceryBud – addItem Setup
153 GroceryBud – truthy shortcut
154 GroceryBud – display alert
155 GroceryBud – addItem
156 GroceryBud – setBackToDefault
157 GroceryBud – clear items
158 GroceryBud – select edit and delete buttons
159 GroceryBud – delete item
160 GroceryBud – edit item
161 GroceryBud – localStorage info
162 GroceryBud – addToLocalStorage
163 GroceryBud – removeFromLocalStorage
164 GroceryBud – editLocalStorage
165 GroceryBud – load items from localStorage
166 Slider Intro
167 Slider HTML
168 Slider General Concepts
169 Slider JS Setup
170 Slider JS – Slides Approach
171 Slider JS – Button Approach
Objects
172 Intro
173 Object Basics
174 Nested Objects, Bracket Notation
175 ‘this’ – Keyword Basics
176 this – Keyword Advanced
177 Factory Functions
178 Constructor Functions
179 Constructor Property
180 Prototype Property
181 Property Lookup
182 ES6 Class Syntax
183 Call
184 Apply, Arguements
185 Bind
186 Button Example
OOP Projects
187 Intro
188 Starter
189 Counter – HTML
190 Counter Setup
191 Counter – Select Elements
192 Counter – Functions
193 Counter – Complete
194 Counter – Class Refactor
195 Gallery Intro
196 Gallery – HTML
197 Gallery – Select Elements
198 Gallery – Open Modal Setup
199 Gallery – Open Modal Complete
200 Gallery – Close Modal
201 Gallery – Prev and Next
202 Gallery – Select Images
203 Gallery – Class Refactor
Functions
204 Intro
205 IFFE
206 Hoisting
207 Closure
208 Closure – Basic Example
209 Closure – Complete Example
ES6
210 ES6 Module Intro
211 VAR, LET, CONST
212 Function Scope and Block Scope
213 Template Strings
214 Template Strings – HTML
215 Tagged Template Literals
216 Arrow Functions – Basics
217 Arrow Functions – Objects and this
218 Arrow Functions – Select Elements and this
219 Default Parameters and Hoisting Gotchas
220 Array Destructuring
221 Swap Variables
222 Object Destructuring
223 Destructuring Function Parameters
224 New String Methods
225 For of – Loop
226 Spread Operator – Basics
227 Spread Operator – Objects
228 Spread Operator – DOM Elements
229 Spread Operator – Functions Arguments
230 Rest Operator
231 Array.of
232 Array.from – Strings and Arguments Object
233 Array.from – DOM Elements(NodeList)
234 find, findIndex,every,some
Modules
235 Intro
236 Setup
237 Named Export
238 Default Export
239 Get Element
Async Javascript
240 Intro
241 Synchronous
242 Recipe Example
243 Asynchronous
244 Callback Hell
245 Callback Hell – Dom Example
246 Promises
247 Important Unsplash API update !!!!
248 Reject Example
249 Promises – Dom Example
250 AsyncAwait
AJAX
251 Intro
252 AJAX, HTTP, API
253 Simple Text
254 Add Button
255 JSON
256 Basic Projects Intro
257 Project Setup Link
258 Starter Project Overview
259 Random Joke – Intro
260 Random Joke – HTML
261 Random Joke – Api Docs
262 Random Joke – XHR Object
263 Random Joke – Shake Chuck
264 Random Joke – Promisify
265 Random Joke – Fetch
266 Random Joke – AsyncAwait
267 Random User – Intro
268 Random User – HTML
269 Random User – API
270 Random User – Select Elements
271 Random User – Fetch User
272 Random User – Display User
273 Cocktails – Intro
274 Cocktails – Setup
275 Cocktails – HTML
276 Cocktails – API
277 Cocktails – Present Drinks
278 Cocktails – Fetch Drinks
279 Cocktails – Display Drinks
280 Cocktails – Search Form
281 Cocktails – Loading
282 Cocktails – Set Drink
283 Cocktails – Single Drink HTML
284 Cocktails – Single Drink
285 Cocktails – Display Single Drink
ES6 Slider
286 Intro
287 Starter Project
288 HTML Setup
289 Display People
290 Apply CSS
291 Next Slide
292 Next Slide – End of Array
293 Prev Slide
294 OPTIONAL – HTML&CSS
ES6 – Stripe Submenus
295 Intro
296 Starter Project
297 HTML
298 Sidebar Toggle
299 Sidebar Complete
300 Submenu Setup
301 Submenu Links
302 Submenu – Hide and Column Layout
ES6 – Pagination
303 Intro
304 Starter Project
305 Setup
306 Fetch Followers
307 Display Followers
308 Paginate – Create Pages
309 Display Buttons
310 Button Functionality
Comfy Store
311 Intro
312 About
313 Starter Project
314 Setup
315 Starter Overview
316 Navbar, Hero – HTML
317 Sidebar HTML
318 Sidebar Toggle
319 Cart HTML
320 Cart Toggle
321 About Page
322 API Overview
323 Featured Products – HTML
324 Fetch Products
325 Setup Store
326 Exports – Alternative Syntax
327 LocalStorage
328 Featured Products
329 Display Products
330 Format Price
331 AddToCart Setup
332 Product HTML
333 Display All Products
334 Page Loading
335 Filters HTML
336 Search Filter
337 Companies Filter
338 Price Filter
339 Single Product – Overview
340 Single Product – HTML
341 Single Product – Initial JS
342 Single Product – Fetch Product
343 Single Product – Fetch Error
344 Single Product – Complete
345 setupCart – Initial Setup
346 addToCart – Setup
347 addToCartDOM
348 addToCart – Totals
349 setupCart – init
350 Cart – Update Items
351 Cart – Remove Item
352 Cart – Increase Amount
353 Cart – Decrease Amount
354 Tiny Bug
355 Finished Project
Resolve the captcha to access the links!