3 Pemimpin Dr, #06-04 (07), Singapore 576147
+65 8839 6772

Modern JavaScript From The Beginning

Modern JavaScript From The Beginning

Online Self-Paced

Play Video

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

Course 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…

  • 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
  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)
  • Basic HTML / CSS knowledge

This course includes:

21.5 hours on-demand video

Access on mobile and TV

2 articles

SkillsFuture Credit eligible *

111 downloadable resources

Certificate of completion

Full lifetime access

* More than 7hr of learning time required

Course content

  • Welcome To The Course
  • Project Files & Questions
  • Projects Github Repo
  • Visual Studio Code Setup

  • Section Intro & File Setup
  • Using The Console
  • Variables - var, let & const
  • Data Types in JavaScript
  • Type Conversion
  • Numbers & The Math Object
  • String Methods & Concatenation
  • Template Literals
  • Arrays & Array Methods
  • Object Literals
  • Dates & Times
  • If Statements & Comparison Operators
  • Switches
  • Function Declarations & Expressions
  • General Loops
  • A Look At The Window Object
  • Block Scope With let & const

  • What Is The DOM
  • Examining The Document Object
  • DOM Selectors For Single Elements
  • DOM Selectors For Multiple Elements
  • Traversing The DOM
  • Creating Elements
  • Removing & Replacing Elements
  • Event Listeners & The Event Object
  • Mouse Events
  • Keyboard & Input Events
  • Event Bubbling & Delegation
  • Local & Session Storage

  • Task List [Part 1] - UI & Add Task Items
  • Task List [Part 2] - Delete & Filter Tasks
  • Task List [Part 3] - Persist To Local Storage
  • Loan Calculator [Part 1] - Build The UI
  • Loan Calculator [Part 2] - Calculate & Error
  • Loan Calculator [Part 3] - Loader & User Experience
  • Number Guesser [Part 1] - Build The UI
  • Number Guesser [Part 2] - Validation & Winning Case
  • Number Guesser [Part 3] - Lose Case & Game Over
  • Number Guesser [Part 4] - Play Again

  • Constructors & the 'this' Keyword
  • Built In Constructors
  • Prototypes Explained
  • Prototypal Inheritance
  • Using Object.create
  • ES6 Classes
  • Sub Classes

  • Build The Book List UI
  • Add Book To List
  • Validation & Alert
  • Delete Book From List
  • Convert to ES6 Classes
  • Bonus - Add Local Storage

  • What Is Asynchronous Programming?
  • Ajax & XHR Introduction
  • XHR Object Methods & Working With Text
  • Working With Ajax & JSON
  • Data From an External API - Chuck Norris Project
  • REST APIs & HTTP Requests
  • Callback Functions
  • Custom HTTP Library (Ajax With Callbacks) - Part 1
  • Custom HTTP Library (Ajax With Callbacks) - Part 2
  • ES6 Promises
  • The Fetch API
  • Error Handling With Fetch
  • Arrow Functions
  • Custom HTTP Library (Fetch With Promises) - Part 3
  • Async & Await
  • Custom HTTP Library (Fetch With Async Await) - Part 4

  • Github Finder [Part 1] - Intro & UI
  • Github Finder [Part 2] - Fetching Profile Data
  • Github Finder [Part 3] - Display The Profile
  • Github Finder [Part 4] - Show Alert Message
  • Github Finder [Part 5] - Fetch & Display Repos
  • WeatherJS [Part 1] - Intro & UI
  • WeatherJS [Part 2] - Fetch Weather From API
  • WeatherJS [Part 3] - Display The Weather
  • WeatherJS [Part 4] - Save Location To Local Storage

Certificate of Completion

When you complete a paid Udemy course, you will receive a certificate of completion, which you can share with your friends, relatives, co-workers and potential employers. Certificates of completion help demonstrate your accomplishments, but please note Udemy is not an accredited institution, and as a result, the certificates cannot be used for formal accreditation.

Please note: free courses and courses that only include practice tests do not offer a certificate of completion.

What you'll learn

Student feedback

Client Logo
Sean Berry

Another great class from Brad Traversy. This is the second class of Brad's that I have taken and I have no doubts about taking another. Thanks.

Client Logo

Brad is a really great instructor. He explains everything so well. I loved this course. Thank you so much for taking time to make this course.

Client Logo
Ayush Sahu

It is very good course to learn modern javascript. If you don't know anything about js then you can definitely go with this course.

Client Logo
Lim You Jinq

Really worth to go through all of these, thought it is cumbersome when dealing the project with pure js. highly recommended to subscribe

Client Logo
Jacob Lepler

Excellent course. I appreciated the update made last (Last April '20 I think), which, wasn't there a few months earlier when I had started to go through the course. Thank you.

Who this course is for:

Transform your life through Udemy

Join millions of learners from around the world already learning on Udemy! Learn online at your own pace from highly rated instructors on any device. Learn at home, the office, waiting in line, or on the go.

Start today with a special discount and download to your phone. Lifetime access over 130,000 courses, courses in 60+ languages and expert instructors. 30-Day Money-back guarantee.

Related courses by other education partners

The Complete Web Design Course

In the 21st century, web design is one of the most influential aspects of your online presence. HTML 5, and CSS 3 are the primary foundations of the […]

The Complete JavaScript Course 2020: From Zero […]

The modern JavaScript course for everyone! Master JavaScript with projects, challenges and theory. Many courses in one! JavaScript is the […]

Apache Spark and Scala Certification Training

Designed to meet the industry benchmarks, Edureka’s Apache Spark and Scala certification is curated by top industry experts […]