TOIT Training

Facebook X-twitter Linkedin Instagram
Menu
Beginner
javascript

Modern JavaScript – From Novice to Ninja

Overview
Curriculum

 

JavaScript stands at the core of interactive and responsive web design, powering the behavior of websites across the globe. This powerful scripting language enables you to create rich user interfaces, handle events, and manipulate web content in real time. As the backbone of modern web frameworks and libraries such as React, Angular, and Vue, understanding JavaScript is essential for any aspiring web developer. In this course, we delve into the latest features introduced in ECMAScript 6 (ES6) and beyond, exploring new syntax, arrow functions, promises, async functions, and more, ensuring that by the end of this course, you’ll be well-equipped to craft sophisticated and modern web applications.

Curriculum

  • 21 Sections
  • 187 Lessons
  • 19h Duration
Expand All
Introduction
4 Lessons
  1. Why you should take this course
  2. Why JavaScript is awesome
  3. Setting up your environment
  4. Course files
 JavaScript Basics
13 Lessons
  1. Adding JavaScript to a web page
  2. The browser console
  3. Variables & constants
  4. Types
  5. Strings
  6. String methods
  7. Numbers
  8. Template strings
  9. Arrays
  10. Null & undefined
  11. Booleans & comparisons
  12. Loose vs strict comparison
  13. Type conversion
Control Flow Basics
11 Lessons
  1. What is control flow
  2. For loops
  3. While loops
  4. Do while loops
  5. If statements
  6. Else & else if
  7. Logical operators
  8. Logical not
  9. Break & continue
  10. Switch statement
  11. Block scope
Functions & Methods
8 Lessons
  1. What are functions
  2. Function declarations & expressions
  3. Arguments & parameters
  4. Returning values
  5. Arrow functions
  6. Functions vs methods
  7. Callback functions & foreach
  8. Callback functions in action
Object Literals
7 Lessons
  1. Objects at a glance
  2. Creating an object
  3. Adding methods
  4. This keyword
  5. Objects in arrays
  6. Math object
  7. Primitive vs reference types
The Document Object Model
14 Lessons
  1. Interacting with a web page
  2. The DOM explained
  3. The query selector
  4. Other ways to query the DOM
  5. Adding & changing page content
  6. Getting & setting attributes
  7. Adding & removing styles
  8. Adding & removing classes
  9. Parents, children & siblings
  10. Events & event listeners
  11. Creating & removing elements
  12. Event bubbling & delegation
  13. More events
  14. Making a popup
Forms & Form Events
6 Lessons
  1. Events inside forms
  2. Submit events
  3. REGEX
  4. Testing REGEX patterns
  5. Basic form validation
  6. Keyboard events
Project - Interactive Ninja Quiz
7 Lessons
  1. Project preview & setup
  2. Bootstrap introduction
  3. Making the HTML template
  4. Calculating scores
  5. Showing the score
  6. The window object
  7. Animating the score
Array Methods
6 Lessons
  1. Filter method
  2. Map method
  3. Reduce method
  4. Find method
  5. Sort method
  6. Chaining array methods
 Project - Todo List
5 Lessons
  1. Project preview & template
  2. HTML & CSS template
  3. Adding todos
  4. Deleting todos
  5. Filtering todos
Dates & Times
4 Lessons
  1. Times
  2. Timestamps
  3. Building a digital clock
  4. Date-fns
Async JavaScript
13 Lessons
  1. What Is Async JavaScript
  2. Async in Action
  3. What Are HTTP Requests?
  4. Making HTTP Requests
  5. Status Codes
  6. Async Code & Callbacks
  7. JSON Data
  8. Callback Hell
  9. Promise Basics
  10. Chaining Promises
  11. Fetch API
  12. Async & Await
  13. Throwing Custom Errors
Project - Weather App
11 Lessons
  1. Project Preview & Setup
  2. HTML & CSS Template
  3. Accuweather API
  4. Get City API Call
  5. Get Weather API Call
  6. Updating the Location
  7. Object Shorthand
  8. Updating the UI
  9. Destructuring
  10. Icons & Images
  11. Ternary Operator
Local Storage
5 Lessons
  1. What Is Local Storage
  2. Storing & Getting Data
  3. Deleting Storage Data
  4. Stringifying & Parsing Data
  5. Updating the Weather App
Object Oriented JavaScript
12 Lessons
  1. What Is OOP?
  2. Object Literal Recap
  3. Classes
  4. Constructor Functions
  5. Class Methods & Method Chaining
  6. Class Inheritance
  7. Super( )
  8. Constructors Under The Hood
  9. Prototype Model
  10. Prototypal Inheritance
  11. Built-In Objects
  12. Making A Forecast Class (Weather App)
 Databases (Firestore)
8 Lessons
  1. NoSQLS Databases
  2. Firebase & Firestore
  3. Connecting To Firestore
  4. Getting Documents
  5. Saving Documents
  6. Deleting Documents
  7. Real-Time Listeners
  8. Unsubscribing From Changes
Project - Real-Time Chatroom
13 Lessons
  1. Project Preview & Setup
  2. HTML Template
  3. Connecting To Firestore
  4. Chatroom Classes
  5. Realtime Listener Setup
  6. Complex
  7. Updating The Name & Room
  8. Chat UI Class
  9. Formatting The Date & Time
  10. Sending New Chats
  11. Changing Usernames
  12. Updating Rooms
  13. Testing The App
More ES6 Features
3 Lessons
  1. Rest & Spread
  2. Sets
  3. Symbols
 Modern Workflow With Babel & Webpack
15 Lessons
  1. Modern Feature Support
  2. Babel Basics
  3. Installing Node & Babel
  4. Using The Babel CLI
  5. NPM Scripts & Watching Files
  6. What Is Webpack
  7. Creating A Webpack File
  8. The Webpack CLI
  9. Intro To Modules
  10. Default Exports
  11. Watching For Changes
  12. Webpack Dev Server
  13. Production & Development Modes
  14. Babel & Webpack
  15. Webpack Boilerplate
Project - UI Library
7 Lessons
  1. Project Preview & Setup
  2. CSS & Style Loaders (Webpack)
  3. Tooltips
  4. Dropdowns
  5. Tabs
  6. Snackbars
  7. Extending The Library
Using Firebase 9 (Latest Version)
15 Lessons
  1. Introduction & What’s New
  2. Setting Up Webpack
  3. Setting Up Firebase
  4. Firestore Setup & Getting Data
  5. Adding & Deleting Documents
  6. Real Time Collection Data
  7. Firestore Queries
  8. Ordering Data & Timestamps
  9. Fetching A Single Document
  10. Updating Documents
  11. Setting Up Firebase Auth
  12. Signing Users Up
  13. Logging In & Out
  14. Subscribing To Auth Changes
  15. Unsubscribing From Changes

Deleting Course Review

Are you sure? You can't restore this back

Course Access

This course is password protected. To access it please enter your password below:

Buy for group

Modern JavaScript – From Novice to Ninja
No groups Found

You don't have any groups yet

Create a group and add group members. Sync Group(s)
Choose Group(s)
Sync Group(s)
    Create a new group Go to Checkout