Modern Javascript From The Beginning

Learn and build projects with pure JavaScript (No frameworks or libraries)

Last updated 2022-01-10 | 4.7

- Modular learning sections & 10 real world projects with pure JavaScript
- Master the DOM (document object model) WITHOUT jQuery
- Asynchronous programming with Ajax
- Fetch API
- Promises & Async / Await

What you'll learn

Modular learning sections & 10 real world projects with pure JavaScript
Master the DOM (document object model) WITHOUT jQuery
Asynchronous programming with Ajax
Fetch API
Promises & Async / Await
OOP including ES5 prototypes & ES2015 classes
Learn JavaScript Patterns
Regular expressions
error handling
localStorage & more

* Requirements

* Basic HTML / CSS knowledge

Description

This is a front to back JavaScript course for absolutely everybody. We start with the basic fundamentals and work our way to advanced programming WITHOUT relying on frameworks or libraries at all. You will learn a ton of pure JavaScript, whether you are a beginner or an established JS programmer. There is something for everyone...


#### WHATS INCLUDED? ####

  • Basics & Fundamentals: Data types, let & const variables, functions, conditionals, loops, object literals, arrays, etc
  • DOM Manipulation: Selectors, traversing the DOM, show/hide, creating & removing elements, event listeners
  • OOP: ES5 prototypes, inheritance, ES2015 classes & sub-classes, constructors
  • Async JS: Ajax & XHR, Fetch API, callbacks, promises, async / await
  • ES2015+: Arrow functions, template strings, generators, iterators, maps & sets, symbols & more
  • JavaScript Patterns: Module, Factory, State, Observer, Mediator, Singleton
  • Other: Local & session storage, regular expressions, try/catch error handling
  • 10 Projects of all kinds



    #### PROJECTS ####

    1. Task List With Local Storage
    2. Loan Calculator
    3. Number Guess Game
    4. OOP Book Listing App (ES5 Prototype & ES2015 Classes Version)
    5. Chuck Norris Joke Generator
    6. EasyHTTP - Custom HTTP Library (3 Versions - Callbacks / Promises / Async & Await)
    7. Github Finder
    8. WeatherJS App
    9. Calorie Tracker (Module Pattern)
    10. Microposts - Frontend CRUD for REST API (Webpack & Babel)


    Who this course is for:

    • People that want to learn modern JavaScript from beginner to advanced without libraries and frameworks

    Course content

    14 sections • 122 lectures

    Welcome To The Course Preview 05:41

    Project Files & Questions Preview 03:06

    Projects Github Repo Preview 00:09

    Visual Studio Code Setup Preview 10:04

    Section Intro & File Setup Preview 04:21

    Using The Console Preview 09:01

    Variables - var, let & const Preview 12:45

    Data Types in JavaScript Preview 10:19

    Type Conversion Preview 11:43

    Numbers & The Math Object Preview 07:18

    String Methods & Concatenation Preview 14:20

    Template Literals Preview 10:07

    Arrays & Array Methods Preview 15:59

    Object Literals Preview 07:49

    Dates & Times Preview 09:13

    If Statements & Comparison Operators Preview 19:02

    Switches Preview 04:49

    Function Declarations & Expressions Preview 11:44

    General Loops Preview 16:41

    A Look At The Window Object Preview 20:51

    Block Scope With let & const Preview 06:31

    What Is The DOM? Preview 03:16

    Examining The Document Object Preview 15:19

    DOM Selectors For Single Elements Preview 14:12

    DOM Selectors For Multiple Elements Preview 14:25

    Traversing The DOM Preview 15:48

    Creating Elements Preview 06:47

    Removing & Replacing Elements Preview 10:56

    Event Listeners & The Event Object Preview 10:12

    Mouse Events Preview 11:03

    Keyboard & Input Events Preview 12:42

    Event Bubbling & Delegation Preview 13:45

    Local & Session Storage Preview 15:14

    Task List [Part 1] - UI & Add Task Items Preview 15:52

    Task List [Part 2] - Delete & Filter Tasks Preview 14:04

    Task List [Part 3] - Persist To Local Storage Preview 11:03

    Loan Calculator [Part 1] - Build The UI Preview 15:07

    Loan Calculator [Part 2] - Calculate & Error Preview 16:47

    Loan Calculator [Part 3] - Loader & User Experience Preview 06:18

    Number Guesser [Part 1] - Build The UI Preview 07:00

    Number Guesser [Part 2] - Validation & Winning Case Preview 16:30

    Number Guesser [Part 3] - Lose Case & Game Over Preview 10:14

    Number Guesser [Part 4] - Play Again Preview 10:53

    Constructors & the 'this' Keyword Preview 11:56

    Built In Constructors Preview 12:16

    Prototypes Explained Preview 09:54

    Prototypal Inheritance Preview 08:23

    Using Object.create Preview 05:28

    ES6 Classes Preview 08:35

    Sub Classes Preview 05:46

    Build The Book List UI Preview 08:20

    Add Book To List Preview 12:32

    Validation & Alert Preview 08:28

    Delete Book From List Preview 06:29

    Convert to ES6 Classes Preview 06:06

    Bonus - Add Local Storage Preview 14:43

    What Is Asynchronous Programming? Preview 03:41

    Ajax & XHR Introduction Preview 06:00

    XHR Object Methods & Working With Text Preview 12:50

    Working With Ajax & JSON Preview 14:23

    Data From an External API - Chuck Norris Project Preview 14:56

    REST APIs & HTTP Requests Preview 06:33

    Callback Functions Preview 08:27

    Custom HTTP Library (Ajax With Callbacks) - Part 1 Preview 15:26

    Custom HTTP Library (Ajax With Callbacks) - Part 2 Preview 12:12

    ES6 Promises Preview 05:39

    The Fetch API Preview 12:40

    Error Handling With Fetch Preview 00:22

    Arrow Functions Preview 12:09

    Custom HTTP Library (Fetch With Promises) - Part 3 Preview 12:55

    Async & Await Preview 08:05

    Custom HTTP Library (Fetch With Async Await) - Part 4 Preview 05:33

    Github Finder [Part 1] - Intro & UI Preview 13:44

    Github Finder [Part 2] - Fetching Profile Data Preview 12:04

    Github Finder [Part 3] - Display The Profile Preview 10:43

    Github Finder [Part 4] - Show Alert Message Preview 10:06

    Github Finder [Part 5] - Fetch & Display Repos Preview 09:43

    WeatherJS [Part 1] - Intro & UI Preview 13:13

    WeatherJS [Part 2] - Fetch Weather From API Preview 08:02

    WeatherJS [Part 3] - Display The Weather Preview 08:47

    WeatherJS [Part 4] - Save Location To Local Storage Preview 11:12

    Error Handling with Try...Catch Preview 09:50

    Regular Expressions [Part 1] - Evaluation Functions Preview 13:33

    Regular Expressions [Part 2] - Metacharacter Symbols Preview 12:35

    Regular Expressions [Part 3] - Character Sets & Quantifiers Preview 12:41

    Regular Expressions [Part 4] - Shorthand Character Classes Preview 09:43

    Regular Expressions - Form Validation Project Preview 21:56

    Iterators & Generators Preview 09:46

    Profile Scroller - Iterator Mini Project Preview 15:06

    Symbols Preview 08:52

    Destructuring Preview 09:28

    ES6 Maps Preview 08:59

    ES6 Sets Preview 09:02

    What Are Patterns? Preview 02:29

    Module & Revealing Module Pattern Preview 12:53

    Singleton Pattern Preview 04:57

    Factory Pattern Preview 08:18

    Observer Pattern Preview 16:01

    Mediator Pattern Preview 10:14

    State Pattern - Small Project Preview 10:53

    Project Introduction Preview 03:14

    Creating The UI With Materialize CSS Preview 16:38

    Controllers & Data Structure Preview 11:02

    Get & Populate Items Preview 10:04

    Add Item To Data Structure Preview 16:34

    Add Item To The UI Preview 12:38

    Add Total Calories Preview 07:42

    Working With The Edit State Preview 20:26

    Updating Items & Total Calories Preview 18:57

    Delete & Clear Items Preview 15:46

    Add & Get From Local Storage Preview 12:34

    Delete & Clear From Local Storage Preview 10:10

    Babel & Webpack Environment Setup Preview 08:55

    Intro To ES2015 Modules Preview 09:21

    Create The UI Preview 07:07

    Create a fake REST API Using JSON Server Preview 07:14

    Get & Display Posts Preview 13:02

    Add Posts & Show Alert Preview 11:59

    Removing Posts Preview 06:09

    Post Edit State & Update [1] Preview 08:29

    Post Edit State & Update [2] Preview 18:06

    Wrap Up & Where To Go From Here Preview 02:11