Modern JavaScript Bootcamp – Beginner To Advanced

About Course

Learn Modern JavaScript from the beginning to Advanced concepts. Build several real world JavaScript projects/apps.

Welcome to The Modern Javascript Bootcamp Course.

This is the most simplified JavaScript course.
People say JavaScript is hard, I created this course to make it seem easy.

In this course, I would start by walking you through the fundamentals of JavaScript in an easy-to-understand manner.
After which we would build several JavaScript projects to help you solidify your understanding. We would then delve into some advanced concepts in JavaScript with which we can create truly dynamic web applications.

After we learn the basics of JavaScript, including DOM Manipulation, we would build several apps including
– A counter App

– A Random color generator

– A Random number generator

We would then learn about the window object and some of its properties and methods, following which we would build a
– Responsive Landing page with countdown

– Body Mass Index calculator, a tool used by medical professionals.

Subsequently, we would start learning the concepts of Object-Oriented Programming with clear explanations and examples.
After this section, we would build a

– Task Tracker App
The Task Tracker app is a robust JavaScript app that would enable us apply most of the concepts we have learned up to that section.
In the Task tracker app, we would use the following concepts
– variable declaration

– Date object

– Functions

– Callback functions

– Arrays

– Local storage

– Object-oriented programming

We would then start learning about Asynchronous JavaScript and how to work with APIs. We would also cover Modules, Imports and Exports which would enable us separate our code into different sections.

After this section, we would build a
– Joke generator app
– GitHub profile app

Next, we would learn how to debug our code and handle errors which is a very important skill you should have as a developer.

After which we would take a focused look into ES6 features.

By the end of this course, you would be reasonably comfortable working with JavaScript and would be ready to learn a JavaScript framework like React, Vue or Angular.

Let’s dive in…

Course Content

Introduction

1. Introduction

02:37
— Resources —

00:00

Environment Setup

JavaScript Fundamentals – Part 1

4. Intro To JavaScript

01:48
5. Linking a JavaScript file

08:10
6. Running JavaScript in the browser

10:15
7. Variables – Var, Let and Const

10:14
8. Rules for naming Variables

04:35
9. Data types

12:31
10. Data type conversion

05:19
11. String methods

15:23
12. String concatenation and template literals

07:15
13. Number, Math and Arithmetic operators

12:37
14. Arithmetic operator shorthand, increment and decrement operator

03:26
15. Array

20:52
16. Conditionals, if else statement, Ternary operator

10:26
17. Switch Statement

05:30
18. Comparison Operator

08:20
19. Logical operator

05:34
20. Date and Time

11:14
21. Functions

14:45
22. Functions – Part 2 – Mini Project – Temp Converter

05:51
23. Loops

23:32
24. Scope

11:20

DOM – Document Object Model

25. Intro to DOM

03:42
26. DOM Properties

04:32
27. DOM Selectors – single element

11:04
28. DOM Selectors – Multiple elements

15:39
29. Traversing the DOM

10:21
30. Manipulating Elements

05:44
31. Creating Elements

09:44
32. Removing Elements

02:27
33. Event Listeners

10:56
34. Hoisting

08:10
35. Events list

05:38
36. Form Events

13:49
37. Event Bubbling and Delegation

16:14

Project – Counter App

Project – Random Number Generator

Project – Random Color Generator

JavaScript Fundamentals – Part 2

45. The Window Object

04:18
46. Window object properties

06:39
47. Alert Confirm and Prompt popup

10:28
48. SetTimeout

07:08
49. SetInterval

10:36
50. Callback Function

09:52
51. Array Methods – forEach, Map and Filter

08:43
52. Arrow Functions

11:15
53. Local Storage Theory – 1

04:51
54. Local Strage Practical – 2

17:19
55. Use Strict Mode

04:52

Project – Coming Soon Landing Page

Project – BMI Calculator

Object Oriented Programming

65. Intro to OOP

08:50
66. Object Literals

04:02
67.THIS Keyword

04:03
68. Object Constructors and this keyord

11:23
69. THIS keyword in functions

04:18
70. Prototype

06:53
71. Prototypal Inheritance

08:32
72. Classes

06:39
73. Static Methods

03:25
74. Subclasses and Inheritance

05:13

Project – Task Tracker

75. Task Tracker – Project Demo

06:11
76. Task Tracker – Markup 1

08:08
77.Task Tracker – Markup 2

05:35
78. Task Tracker – CSS 1

10:21
79. Task Tracker – CSS 2

07:14
80. Task Tracker – CSS 3

15:28
81. Task Tracker – CSS 4

13:43
82. Task Tracker – JS 1 – Date and Time

17:34
83. Task Tracker – JS 2 – Declaring Variables

09:03
84. Task Tracker – JS 3 – Handle Form Display

13:49
85. Task Tracker – JS 4 – Save Task in Local Storage

19:44
86. Task Tracker – JS 5 – Show Task on the Page

15:08
87. Task Tracker – JS 5 – Show Task on the Page – Part 2

19:28
88. Task Tracker – JS 5 – Show Task on the Page – Part 3

04:02
89. Task Tracker – JS 6 – Show Total Number of Tasks

12:34
90. Task Tracker – JS7 – Delete a Task

07:51
91. Task Tracker – JS8 – Delete all Task

03:20
92. Task Tracker – JS 9 – Edit a task

12:53
93. Task Tracker – JS 10 – set task to completed

14:59
94. Task Tracker – JS 10 – set task to completed – Part 2

10:47
95. Task Tracker – JS 11 – Testing the Application

02:11
96. Task Tracker – JS 12 – Custom confirm box – Markup

05:37
97. Task Tracker – JS 13 – Custom confirm box – CSS

16:55
98. Task Tracker – JS 14 – Custom confirm box – JS Part 1

20:19
99. Task Tracker – JS 15 – Custom confirm box – JS Part 2

14:22

Asynscronous JavaScript and Fetch API

API Project – Fetch VS Async Await

Modules, Imports and Exports

Project 8 – GitHub Profile App

Conclusion

Student Ratings & Reviews

5.0

Total 1 Rating

2 Ratings

0 Rating

Okpola Ugbolochi

1 year ago

This is a very good course for beginners and anyone looking to improve their JavaScript skills. What I liked about the course was that it was project-based, so you got to practice along the way and build projects with the skills you learned.

About Course

Course Content

Introduction

1. Introduction

— Resources —

Environment Setup

2. Environment setup – Installing necessary tools

3. VSCode Setup

JavaScript Fundamentals – Part 1

4. Intro To JavaScript

5. Linking a JavaScript file

6. Running JavaScript in the browser

7. Variables – Var, Let and Const

8. Rules for naming Variables

9. Data types

10. Data type conversion

11. String methods

12. String concatenation and template literals

13. Number, Math and Arithmetic operators

14. Arithmetic operator shorthand, increment and decrement operator

15. Array

16. Conditionals, if else statement, Ternary operator

17. Switch Statement

18. Comparison Operator

19. Logical operator

20. Date and Time

21. Functions

22. Functions – Part 2 – Mini Project – Temp Converter

23. Loops

24. Scope

DOM – Document Object Model

25. Intro to DOM

26. DOM Properties

27. DOM Selectors – single element

28. DOM Selectors – Multiple elements

29. Traversing the DOM

30. Manipulating Elements

31. Creating Elements

32. Removing Elements

33. Event Listeners

34. Hoisting

35. Events list

36. Form Events

37. Event Bubbling and Delegation

Project – Counter App

38. Template Folder

39. Counter App – Markup

40. Counter App – Markup

Project – Random Number Generator

41. Random Number Generator – Markup

42. Random Number Generator – JS

Project – Random Color Generator

43. Random Hex Color Generator – Markup

44. Random Hex Color Generator – JS

JavaScript Fundamentals – Part 2

45. The Window Object

46. Window object properties

47. Alert Confirm and Prompt popup

48. SetTimeout

49. SetInterval

50. Callback Function

51. Array Methods – forEach, Map and Filter

52. Arrow Functions

53. Local Storage Theory – 1

54. Local Strage Practical – 2

55. Use Strict Mode

Project – Coming Soon Landing Page

56. Coming Soon Landing Page – Markup

57. Coming Soon Landing Page – CSS

58. Coming Soon Landing Page – JS

Project – BMI Calculator

59. BMI Calculator – Markup

60. BMI Calculator – CSS

61. BMI Calculator – JS – Part 1 – Validate input

62. BMI Calculator – JS – Part 2 – Calculate BMI

63. BMI Calculator – JS – Part 3 – Show Result

64. BMI Calculator – JS – Part 4 – Reset Function and loader

Object Oriented Programming

65. Intro to OOP

66. Object Literals