IIRF Online > Development > Web Development > JavaScript > Modern JavaScript (Complete guide, from Novice to Ninja)
Modern JavaScript (Complete guide, from Novice to Ninja) by Udemy
Learn Modern JavaScript from the very start to ninja-level & build awesome JavaScript applications.
Course Highlights
- Learn how to program with modern JavaScript, from the very beginning to more advanced topics
- Learn all about OOP (object-oriented programming) with JavaScript, working with prototypes & classes
- Learn how to create real-world front-end applications with JavaScript (quizes, weather apps, chat rooms etc)
- Learn how to make useful JavaScript driven UI components like popups, drop-downs, tabs, tool-tips & more.
- Learn how to use modern, cutting-edge JavaScript features today by using a modern workflow (Babel & Webpack)
- Learn how to use real-time databases to store, retrieve and update application data
- Explore API's to make the most of third-party data (such as weather information)
Skills you will learn!
Overview
Who This Course is for?
- New or junior developer who wants to learn about JavaScript.
- Front-end developers who wish to use cutting-edge, modern techniques to increase their knowledge of JavaScript.
- Front-end developers that are interested in learning JavaScript as a programming language.
More About Course
Modern JavaScript is a course that helps you become a Ninja. You will be able to learn Java language from the start to create dynamic and interactive web experiences. The course will cover the basics quickly so you can dive into some really fun stuff, such as web page manipulation, which creates popups, interactive forms, and other cool effects.
You will also be able to use the latest additions to the JavaScript specifications (ES6,7 and beyond) and maintain good coding standards to keep the code effective and clean. Once you learn the basics of the course, you can dive into real-life projects of JavaScript, including a weather app, an interactive quiz, and a real-time chat app that you can use in future projects.
You will learn Modern JavaScript from the very start to ninja-level & build awesome JavaScript applications.
What You Will Gain from the Course?
- Learn how to use cutting-edge and modern JavaScript features today with a modern workflow (Webpack & Babel).
- You can learn modern JavaScript from beginning to advanced.
- Learn to use a real-time database to store, update, and retrieve application data.
- Learn everything about object-oriented programming (OOP) with JavaScript, working with classes and prototypes.
- Learn about useful JavaScript-driven UI components such as drop-downs, popups, tooltips, and tabs.
Curriculum
4 Topics
Why You Should Take This Course
Why JavaScript is Amazing
Setting up Your Environment
Course Files
13 Topics
Adding JavaScript to a Web Page
The Browser Console
Variables Constants & Comments
Data Types at a Glance
Strings
Common String Methods
Numbers
Template Strings
Arrays
Null & Undefined
Booleans & Comparisons
Loose vs Strict Comparison
Type Conversion
11 Topics
What is Control Flow?
For Loops
While Loops
Do While Loops
If Statements
Else & Else If
Logical Operators
Logical NOT
Break & Continue
Switch Statements
Variables & Block Scope
8 Topics
What are Functions?
Function Declarations & Expressions
Arguments & Parameters
Returning Values
Arrow Functions
Functions vs Methods
Foreach Method & Callbacks
Callback Functions in Action
7 Topics
Objects at a Glance
Creating an Object Literal
Adding Methods
'this' Keyword
Objects in Arrays
Math Object
Primitive vs Reference Types
14 Topics
Interacting with the Browser
The DOM Explained
The Query Selector
Other Ways to Query the DOM
Adding & Changing Page Content
Getting & Setting Attributes
Changing CSS Styles
Adding & Removing Classes
Parents Children & Siblings
Event Basics (click events)
Creating & Removing Elements
Event Bubbling (and delegation)
More DOM Events
Building a Popup
6 Topics
Events Inside Forms
Submit Events
Regular Expressions
Testing RegEx Patterns
Basic Form Validation
Keyboard Events
7 Topics
Project Preview & Setup
Bootstrap Basics
HTML Template
Checking Answers
Showing the Score
The Window Object
Intervals & Animating the Score
6 Topics
Filter Method
Map Method
Reduce Method
Find Method
Sort Method
Chaining Array Methods
5 Topics
Project Preview and Setup
HTML & CSS Template
Adding Todos
Deleting Todos
Searching & Filtering Todos
4 Topics
Dates & Times in JavaScript
Timestamps & Comparisons
Building a Digital Clock
Date-fns Library
13 Topics
What is Asynchronous JavaScript?
Async Code in Action
What are HTTP Requests?
Making HTTP Requests (XHR)
Response Status
Callback Functions
JSON Data
Callback Hell
Promise Basics
Chaining Promises
The Fetch API
Async & Await
Throwing & Catching Errors
11 Topics
Project Preview & Setup
HTML & CSS Template
AccuWeather API
Get City API Call
Get Weather API Call
Updating the Location
Object Shorthand Notation
Updating the UI
Destructuring
Weather Icons & images
Ternary Operator
5 Topics
What is Local Storage?
Storing & Getting Data
Deleting Storage Data
Stringifying & Parsing Data
Updating the Weather App
12 Topics
What is OOP?
Object Literal Recap
Classes
Class Constructors
Class Methods & Method Chaining
Class Inheritance (subclasses)
Super( )
Constructors (under the hood)
Prototype Model
Prototypal Inheritance
Built-in Objects
Making a Forecast Class (weather app)
8 Topics
NoSQL Databases
Firebase & Firestore
Connecting to Firestore
Getting Collections
Saving Documents
Deleting Documents
Real-time Listeners
Unsubscribing
13 Topics
Project Preview & Setup
HTML Template
Connecting to Firebase
Chatroom Class & Adding Chats
Setting up a Real-time Listener
Complex Queries
Updating the Room & Username
Creating a ChatUI Class
Formatting the Dates
Sending New Chats
Changing Username & Local Storage
Updating the Room
Testing the App
3 Topics
Spread & Rest
Sets
Symbols
15 Topics
Modern Feature Support
An Introduction to Babel
Installing Node.js & Babel
Using the Babel CLI
NPM Scripts & Watching Files
What is Webpack?
Setting up a Webpack File
Webpack CLI
Introduction to Modules
Default Exports
Watching for Changes
The Webpack Dev Server
Production & Development Modes
Babel & Webpack Together
Webpack Boilerplate
7 Topics
Project Preview & Setup
CSS & Style Loaders (webpack)
Tooltips
Dropdowns
Tabbed Content
Snackbars
Extending the Library
15 Topics
What's New in Firebase 9?
Webpack Setup
Creating a Firebase Project
Firestore Setup & Fetching Data
Adding & Deleting Documents
Real Time Collection Data
Firestore Queries
Timestamps & Ordering Data
Fetching Single Documents
Updating Documents
Firebase Auth Setup
Signing Users Up
Logging In & Logging Out
Listening to Auth Changes
Unsubscribing from Changes
1 Topic
Bonus Lecture: Next Steps
Modern JavaScript (Complete guide, from Novice to Ninja)
Related JavaScript Courses
Frequently Asked Questions
New or junior developers will be able to learn JavaScript.
Modern JavaScript is a strong server-side language. It is a multi-paradigm language that facilitates procedural and object-oriented programming.
It will take about 20 hours to learn modern JavaScript from this course.
Yes, it is the most powerful tool a web developer can have.
Several new features and syntax improvements were added to JavaScript by ES6, including modules, template literals, let and const declarations, arrow functions, class syntax, and spread and rest operators.
Thank You!
Your review has been submitted successfully.