The Modern JavaScript Bootcamp
4.0 /5- Offered byUDEMY
The Modern JavaScript Bootcamp at UDEMY Overview
Duration | 52 hours |
Total fee | ₹599 |
Mode of learning | Online |
Difficulty level | Intermediate |
Official Website | Go to Website  |
Credential | Certificate |
The Modern JavaScript Bootcamp at UDEMY Highlights
- Compatible on Mobile and TV
- Earn a Cerificate on successful completion
- Get Full Lifetime Access
- Learn from Colt Steele
The Modern JavaScript Bootcamp at UDEMY Course details
- Anyone looking to understand and master Javascript
- Learn everything there is to know about Javascript - from scratch!
- Build beautiful web apps to add to your portfolio
- Get job ready with a deep understanding of the internals of JS
- Work with Node JS and Express
- Create a full E-Commerce app complete with authentication
- Automate testing your code by creating your own custom testing framework!
- Build your own physics-based JavaScript game
- Understand how Javascript developers work on a day-to-day basis
- Master the latest JS features like async and arrow functions
- Always bet on Javascript! For years, top recruiters in industry have hired fresh engineers based solely on their knowledge of Javascript. If you want to get a programming job, this is the language to learn! But learning Javascript is complicated! There's fancy syntax, weird design patterns, and a billion resources online that might be giving you wrong - or even be out of date - information. We built this course to solve your problems. This is the best and most up-to-date resource online for becoming a Javascript professional as quickly as possible. Every minute of this course has been created with one goal in mind: teaching you how to become a great engineer. The Modern Javascript Bootcamp (2020) focuses on cutting through unnecessary information and giving you just the facts, plain and simple. You won't work with outdated frameworks, learn old styles of programming, or build boring apps. Instead, you'll only spend time writing practical code that can be used today and in the future on your own projects. You'll learn - from very early on in the course - how to write beautiful and reusable code that you'll be proud to show to a future employer. Two of Udemy's greatest instructors - Colt Steele and Stephen Grider - collaborated to create this course . Between the two of us, we have taught over one million engineers how to program. Rest assured, you will be learning from the best. We know how challenging it can be to understand a new programming from scratch, so we designed this course to offer you a step-by-step, guaranteed approach to becoming a Javascript master. ------ Course Structure ------ This course is divided into two parts. The first half of the course focuses on teaching you the basic syntax of Javascript. Colt will walk you through core topics effortlessly , imparting jewels of JS wisdom along the way. Included in the first half of the course are many programming exercises and small projects, so you can test your new-found knowledge out. Each of these videos can be easily referenced in the future, so you can always come back and brush up on some topic whenever needed. The second half of the course is focused on building some amazing projects. Stephen will show you how to build some production-ready Javascript applications, including a fully-featured E-Commerce web app! These projects are all styled to be absolutely beautiful , visually stunning apps that you will be proud to feature on your own personal portfolio. The main goal of these projects is to highlight design patterns , and show you the 'right' and 'wrong' ways of writing code. By the end, you'll be confident enough to work on your own personal projects with speed and finesse. ------ What You'll Learn ------ This is a long course, with just about every fact about Javascript you could ever hope to know. Here's a brief subset of the topics you'll cover: Master the basics of the language , easily understanding variables, objects, arrays, and functions Understand how to design the structure of the code you write, leading to beautiful and easy-to-read programs Leverage Javascript's built-in methods to increase your productivity regardless of what libraries or frameworks you use Develop practical skills around higher-order functions that you will utilize for years to come Observe how the Javascript and browser work together, and how to increase the performance of JS code Build awesome projects to fill your personal portfolio Build command line tools from scratch using Node JS Fetch and manage information from third-party API's Build a fully-featured E-Commerce application from scratch - including production-grade authentication! This is the ultimate Javascript course. There are many resources online for learning Javascript, but this is the only one that covers everything you need to know, from 'A' to 'Z', and a couple letters after that. Master the basics with Colt, then build awesome projects with Stephen. We've taught a million other engineers how to code, and now it is your turn!
The Modern JavaScript Bootcamp at UDEMY Curriculum
Introduction
How This Course Works
JS, ECMA, TC39: What Do They Mean??
The Tools You Need
Customizing VSCode & Extensions
A Quick Note About MDN
JS Values & Variables
Goals & Primitives
Running Code in the JS Console
Introducing Numbers
NaN & Infinity
Numbers Quiz
Variables & Let
Unary Operators
Introducing Const
The Legacy of Var
Variables Quiz
How to Model Data Efficiently
Booleans Intro
Strings
String Indices
String Methods
More String Methods
Strings Quiz
String Escape Characters
String Template Literals
Null & Undefined
The Math Object & Random Numbers
typeof operator
parseInt & parseFloat
Controlling Program Logic and Flow
Making Decisions in JS
Comparison Operators
Double Equals (==)
Triple Equals (===)
Running Code From a Script
If Statements
Else If
Else
Nesting Conditionals
Truthy & Falsy Values
Logical AND (&&)
Logical OR (
)
NOT Operator (!)
Operator Precedence
The Switch Statement
Ternary Operator
Capture Collections of Data with Arrays
Creating Arrays
Array Indices
Modifying Arrays
Push and Pop
Shift and Unshift
Concat
Includes and IndexOf
Reverse and Join
Slice
Splice
Sorting (Part 1)
Intro to Reference Types
Using Const with Arrays
Working with Nested Arrays
Objects - The Core of Javascript
Intro to Objects
Creating Object Literals
Accessing Object Properties
Adding and Updating Properties
Nested Arrays & Objects
Objects and Reference Types
Array/Object Equality
The World of Loops
Intro to Loops
For Loops
Infinite Loops!
For Loops & Arrays
Nested For Loops
Intro to While Loops
More While Loops
Break Keyword
For...Of Intro
Comparing For and For...Of
For...Of with Objects
For...In Loops
Writing Reusable Code with Functions
Our First Function!
Dice Roll Function
Introducing Arguments
Functions With Multiple Args
The Return Statement
More on Return Values
Function Challenge 1: passwordValidator
Function Challenge 2: Average
Function Challenge 3: Pangrams
Function Challenge 4: Get Playing Card
An Advanced Look at Functions
Function Scope
Block Scope
Lexical Scope
Function Expressions
Higher Order Functions
Functions as Arguments
Functions as Return Values
Callbacks
Hoisting
Apply Functions to Collections of Data
Intro to Array Callback Methods
forEach
Map
Arrow Functions Intro
Arrow Functions: Implicit Returns
Array.find
Filter
Some & Every
Revisiting Sort!
Reduce Intro
Reduce Pt. 2
Even More Reduce!
A Few Miscellaneous JS Features
New JS Features Intro
Default Parameters
Spread for Function Calls
Spread in Array Literals
Spread in Object Literals
The Arguments Object (not new)
Rest Parameters (new!)
Destructuring Arrays
Destructuring Objects
Nested Destructuring
Destructuring Parameters
Object Methods and the 'This' Keyword
Shorthand Object Properties
Computed Properties
Adding Methods to Objects
Method Shorthand Syntax
Intro to Keyword THIS
Using THIS in Methods
THIS: Invocation Context
Annoyomatic Demo
Putting It All Together: Deck Of Cards
Creating A Deck Factory
JS In the Browser - DOM Manipulation
Introduction to the DOM
IMPORTANT NOTE: HTML & CSS
Taste of the DOM
Another Fun DOM Example
The Document Object
getElementById
getElementsByTagName
getElementsByClassName
querySelector & querySelectorAll
Twisting the DOM to Our Will!
Working with innerText & textContent
innerHTML
value, src, href, and more
Getting & Setting Attributes
Finding Parent/Children/Siblings
Changing Multiple Elements
Altering Styles
getComputedStyle
Manipulating Classes
Creating Elements
Append, Prepend, & insertBefore
removeChild & remove
NBA Scores Chart Pt1.
NBA Scores Chart Refactor
Communicating with Events
Intro to DOM Events
2 Ways NOT to Add Events
addEventListener
The Impossible Button Demo
Events on Multiple Elements
The Event Object
Key Events: keypress, keyup, & keydown
Coin Game Demo
Form Events & PreventDefault
Input & Change Events
Asynchronous Code, Callbacks & Promises
The Call Stack
Call Stack Debugging w/ Dev Tools
JS is Single Threaded
How Asynchronous Callbacks Actually Work
Welcome to Callback Hell
Introducing Promises!
Returning Promises from Functions
Resolving/Rejecting w/ Values
The Delights of Promise Chaining
Refactoring w/ Promises
Making HTTP Requests
Intro to AJAX
JSON & XML
XMLHttpRequests: The Basics
XMLHttpRequests: Chaining Requests
A Better Way: Fetch!
Chaining Fetch Requests
Refactoring Fetch Chains
An Even Better Way: Axios
Sequential Axios Requests
Async & Await: JS Magic
A Quick Overview of Async Functions
The Async Keyword
The Await Keyword
Error Handling in Async Functions
Multiple Awaits
Parallel Vs. Sequential Requests
Refactoring with Promise.all
Prototypes, Classes, & The New Operator
What on Earth are Prototypes?
An Intro to OOP
Factory Functions
Constructor Functions
JS Classes - Syntactical Sugar
A Bit More Practice with Classes
Extends, Super, and Subclasses
Drawing Animations
Welcome to Part 2!
App Overview
Project Setup
Event-Based Architecture
Class-Based Implementation
Binding Events in a Class
Reminder on 'This'
Determining the Value of 'This'
Solving the 'This' Issue
Starting and Pausing the Timer
Where to Store Data?
DOM-Centric Approach
Getters and Setters
Stopping the Timer
Notifying the Outside World
OnTick and OnComplete
Extracting Timer Code
Introducing SVG's
Rules of SVG's
Advanced Circle Properties
The Secret to the Animation
First Pass on the Animation
Smoothing the Animation
Adjusting by an Even Interval
Using Icons
Styling and Wrapup
Application Design Patterns
Application Overview
Starter Kit Setup
Big Challenges
Fetching Movie Data
Fetching a Single Movie
AutoComplete Widget Design
Searching the API on Input Change
Delaying Search Input
Understanding Debounce
Implementing a Reusable Debounce
Extracting Utility Functions
Awaiting Async Functions
Rendering Movies
Handling Errored Responses
Opening a Menu
Style of Widget Creation
Moving HTML Generation
Quick Note
Repairing References
Handling Broken Images
Automatically Closing the Dropdown
Handling Empty Responses
Handling Movie Selection
Making a Followup Request
Rendering an Expanded Summary
Expanded Statistics
Issues with the Codebase
Making the Autocomplete Reusable
Displaying Multiple Autocompletes
Extracting Rendering Logic
Extracting Selection Logic
Removing Movie References
Consuming a Different Source of Data
Refreshed HTML Structure
Avoiding Duplication of Config
Hiding the Tutorial
Showing Two Summaries
When to Compare?
How to Compare?
Extracting Statistic Values
Parsing Number of Awards
Applying Parsed Properties
Updating Styles
Small Bug Fix
App Wrapup
Javascript with the Canvas API
Application Overview
Project Setup
Matter Terminology
Getting Content to Appear
Boilerplate Overview
Drawing Borders
Clicking and Dragging
Generating Random Shapes
Maze Generation Algorithm
More on Maze Generation
Configuration Variables
Grid Generation
Verticals and Horizontals
Abstracting Maze Dimensions
Guiding Comments
Neighbor Coordinates
Shuffling Neighbor Pairs
Determining Movement Direction
Updating Vertical Wall Values
Updating Horizontal Wall Values
Validating Wall Structure
Iterating Over Walls
Drawing Horizontal Segments
Drawing Vertical Segments
Drawing the Goal
Drawing the Playing Ball
Handling Keypresses
Adding Keyboard Controls
Disabling Gravity
Detecting a Win
Adding a Win Animation
Stretching the Canvas
Understanding the New Unit Variables
Refactoring for Rectangular Mazes
Adding Fill Colors
Displaying a Success Message
Make a Secret-Message Sharing App
Application Overview
Project Setup
Handling Form Submission
Base64 Encoding
Encoding the Entered String
Parts of a URL
Generating the URL
Toggling Element Visibility
Decoding the Message
Displaying the Message
App Deployment
Create Node JS Command Line Tools
JavaScript with Node vs the Browser
Executing JavaScript
Working with Modules
Invisible Node Functions
The Require Cache
Files Get Required Once!
Debugging with Node
App Overview
Accessing Standard Library Modules
The Callback Pattern in Node
The Process.cwd Function
Running a Node Program as an Executable
Linking a Project
Is it a File or a Folder?
A Buggy Initial Implementation
Optional Solution #1
A Callback-Based Solution
Callback-Based Functions Using Promises
Issues with Sequential Reads
Promise.all-Based Solution
Console Logs with Colors
Accepting Command Line Arguments
Joining Paths
App Wrapup
Create Your Own Project Runner
App Overview
Project Setup
Big Application Challenges
Watching Files with Chokidar
Issues with Add Event
Debouncing Add Events
Naming Require Statements
Handling CLI Tools with Caporal
Ensuring Files Exist
It Works!
More on StdIO
[Optional] More on Child_Process
App Wrapup
Project Start - E-Commerce App
App Overview
App Architecture
Package.json Scripts
Creating a Web Server
Behind the Scenes of Requests
Displaying Simple HTML
Understanding Form Submissions
Parsing Form Data
Middlewares in Express
Globally Applying Middleware
Design a Custom Database
Data Storage
Different Data Modeling Approaches
Implementing the Users Repository
Opening the Repo Data File
Small Refactor
Saving Records
Better JSON Formatting
Random ID Generation
Finding By Id
Deleting Records
Updating Records
Adding Filtering Logic
Exporting an Instance
Signup Validation Logic
Production-Grade Authentication
Cookie Based Authentication
Creating User Records
Fetching a Session
Signing Out a User
Signing In
Hashing Passwords
Salting Passwords
Salting + Hashing Passwords
Comparing Hashed Passwords
Testing the Full Flow
Structuring Javascript Projects
Project Structure
Structure Refactor
HTML Templating Functions
HTML Reuse with Layouts
Building a Layout File
Adding Better Form Validation
Validation vs Sanitization
Receiving Validation Output
Adding Custom Validators
Extracting Validation Chains
Displaying Error Messages
Validation Around Sign In
Password Validation
Template Helper Functions
Adding Some Styling
Exposing Public Directories
Next Steps
Product Routes
The Products Repository
Code Reuse with Classes
Creating the Products Repository
Building the Product Creation Form
Some Quick Validation
Image and File Upload
Exploring Image Upload
Understanding Mutli-Part Forms
Accessing the Uploaded File
[Optional] Different Methods of Image Storage
Saving the Image
A Subtle Middleware Bug
Better Styling
Reusable Error Handling Middleware
Products Listing
Redirect on Success Actions
Requiring Authentication
Template Update
Ids in URLs
Receiving URL Params
Displaying an Edit Form
Building a Shopping Cart
Editing a Product
Fixing the HandleErrors Middleware
Edit Form Template
Deleting Products
Starting with Seed Data
User-Facing Products
Products Index
Merging More Styling
Understanding a Shopping Cart
Solving Problem #1
Solving Problem #2
Shopping Cart Boilerplate
Submission Options
Creating a Cart, One Way or Another
Adding Items to a Cart
Displaying Cart Items
Rendering the List
Totaling Cart Items
Removing Cart Items
Redirect on Remove
The Basics of Testing
Testing Overview
A Simple Function to Test
A No-Frills Testing Implementation
Test Driven Development
Fixing Three Issues
The Assert Module
Using Mocha
App Setup
Reminder on This App
Why is Test Setup Difficult?
Mocha in the Browser
Displaying the Autocomplete
Verifying the Dropdown State
Writing Assertions
Fake DOM Events
Holding Up Assertions
Implementing WaitFor
Asserting Records Fetched
Building a Testing Framework From Scratch
Test Framework Requirements
Project Setup
Implementation Steps
Walking a Directory Structure
Implementing Breadth First Search
Collecting Test Files
Running Test Files
A Quick Test Harness
Implementing 'beforeEach' and 'it'
Adding Basic Reporting
Adding Colors
Better Formatting
Ignoring Directories
Running Browser-Based JS
A Sample Web App
Why JSDOM?
Building a Render Function
HTML Element Assertions
An Incorrectly Passing Test
Another Small Issue
Script Execution Delay
Implementing a Delay
Fixing a Test
Bonus!
Bonus!
Other courses offered by UDEMY
Student Forum
Anything you would want to ask experts?