Master JavaScript

and its friends once and for all

About This Course

This course is for anyone—be it a novice or an expert—who wants to take their JavaScript knowledge to the next level.

We will start with the very basics but don’t be surprised if you find yourself writing an AWS Lambda function to stream data to a DynamoDB, and then resolve a Promise to assign an awaited variable later on the course 😉.

Yes, you’ll start with baby steps, but don’t be misled:

You’ll quickly get all our bases covered not only about JavaScript but also for related technologies too.

I want you to be happy and learn enough kung-fu to be dangerous at least.

enroll today

register for free and get an early access discount

What You’ll Learn

  • Develop robust, lean, and error-free apps.
  • Create reusable, modular, and modern codebases that stand the test of time.
  • Build, scale, diagnose, and monitor a full-stack production application.

You will become a JS Jedi

Is It Worth It?

Trust me when I say this is the most advanced beginner’s course that you will ever get your hands on!

I am passionate about this course: I’m putting a lot of time and energy into it.

If you want to get better at JavaScript and related technologies and learn from both theory and practice, you are in the right place.

What If I Don’t Like It?

I have been in the industry since 2003, and I’ve been writing JavaScript since then. From Blackberry Bold’s JavaScript quirks to Netscape Navigator 4 layout problems, to Node.js’s event loop delays and memory leaks, to rendering inconsistencies of various user agents…

I’ve seen a lot, and I’m reflecting my experience into this course. So I highly trust that you’ll like it 😉.

For any reason if you are not happy with the course, I will issue you a 100% refund—No questions asked💰.

Haven’t Decided Yet?

Check out the course outline below.

Course Outline

The curriculum is highly in flux. I try to keep the outline below in sync with what I’m doing to my best ability.
Follow me on twitter if you want more frequent updates about the course’s overall progress.


  • This lesson is ready for your learning pleasure.
    (the lesson’s video, its English subtitles, and its transcript is ready;
    however, its lesson notes and other assets might still need some work
  • This lesson is not ready yet.
    (it is a “work in progress;
    anything about it can change)

1: Introduction

This section is more about the “non-code-related” parts of being a developer. It is both related to learning JavaScript in particular and being a better, well-rounded developer in general.

2: Let the Fun Begin

In this section, we’ll go over the fundamental concepts real quick so that we can jump into more advanced constructs later.

  • A Blitz Introduction to Data Types (free preview)
  • Creating a Utility Function
  • Type Checking (free preview)
  • Type Checking Enhanced
  • Introducing the Prototype Chain
  • Following the Prototype Chain
  • Zorg and His Inheritance Cycle
  • A Mild Introduction to Classes
  • Constructors and Superconstructors
  • An Overview of the Object-Oriented Programming Paradigms
  • Prototypal Inheritance: A Wrap-Up
  • Primitive Types
  • Reference Types
  • A Gentle Introduction to Collections
  • Mastering Dates and Times
  • A Gentle Introduction to Functions
  • A Gentle Introduction to Inheritance
  • Use Case: Searching For Your Favorite Book

3: Diving Deeper Into Functions

Learning how to think functionally can take a while. But when you are in the functional realm, there’s no going back.

4: Diving Deeper Into Task Queues

Knowing how task queues work in depth can change your understanding of how a browser works. So that you won’t have to do setTimeout(fn, 100) all the time.

  • MicroTasks and MacroTasks
  • The Curious Case of the requestAnimationFrame
  • Use Case: Debouncing a Scroll Event

5: Diving Deeper Into AJAX

This section is all about APIs, remote requests, sockets and connections.

  • XMLHttpRequest
  • CORS
  • fetch
  • Using Websockets
  • Use Case: Mini Chat Using
  • Why Not Use for Production
  • Use Case: Mini Chat Using PubNub

6: The Web

We’ll dive into how web-related technologies work, and how fun with modern front-end APIs. We will start our journey without using any frameworks, and we might even pick a few frameworks and use them on the go—Who knows 😃.

  • The Document Object Model (DOM)
  • Browser Events and Event Listeners
  • Cookies
  • Local Storage and Session Storage
  • Indexed DB
  • WIP: several use cases

7: Practice Time

This section is full of practical use cases. While we create various tools, utilities, and applications, we will put more emphasis on practice, while highlighting how development works in in real life. So it is more shared experience, more practice, and less theory.

8: Dogfooding

This section is as “real life” as it can get: We will start from a blank slate and implement the 🦄 learning portal from scratch. Since it is a production application, we will cover all production-related issues, such as CI/CD pipelines, staging, monitoring, log aggregation, diagnostics and alarms, scalability… and more—It will be a lot of fun 🙂.

  • Tabula Rasa
  • Configuring Prettier for Visual Studio Code
  • Configuring FlowType for Visual Studio Code
  • Stripping FlowType Annotations
  • Configuring the Deployment Pipeline
  • Creating a Buddy Pipeline
  • Creating an AWS Lambda Function
  • Configuring AWS Lambda
  • Publishers and Subscribers
  • Creating the Deployment Script
  • Deployment: Simplified (free preview)
  • The Deployment Architecture Overview
  • Defining the Subnets and Creating an Internet Gateway
  • Defining the Network Access Control List
  • Defining the Security Groups
  • Creating an Application Load Balancer
  • Creating an EC2 Instance
  • Setting Up the EC2 Instance to Serve Node.js
  • Creating an Amazon Machine Image
  • Registering Targets to the Load Balancer
  • Routing Traffic to the EC2 Cluster
  • Creating a Logger with Winston
  • Validating the Origin and the Referrer
  • Using CORS Tokens
  • Moving the App Creation to Its Own Module
  • Defining Routes
  • Modifying the Response Using Middlewares
  • Further Configuring the App
  • Using a Mustache View
  • Reusing Mustache Templates
  • Processing and Inlining Sass
  • Protecting Paths
  • The Login and Signup Flows
  • Theming the Login Page
  • Fetching User Data from DynamoDB
  • Detailing Out the Login Flow
  • Creating the Post-Login Flow
  • Configuring the Mailer
  • Comparing the Hashed Passwords
  • Designing the Password Entry Form
  • Debugging the Login Flow
  • Sending the Verification Email
  • Quickie: The Similarity Between the Login and Register Routes
  • Laying Out the Activation Flow
  • Activating the User on the DB
  • Finishing the Activation Flow Views
  • Designing the Signup Form
  • Outlining the Activation Flow
  • Saving the Activated User to the DB
  • Creating a Dashboard View
  • Generating the Dashboard Styles
  • Factoring Out Common Webpack Configurations
  • Posting the Payment Data to the Store
  • Outlining the Course Purchase Flow
  • Registering the User to the Course in the DB
  • Charging the User
  • Creating the Forgot Password Form
  • Sending the Password Reset Email
  • Displaying the Password Reset Form
  • Updating the Password in the DB
  • Adding the Origin Validation Middleware
  • Implementing the Log Out Flow
  • Moving the Environment Configuration Elsewhere
  • Rendering a Simple React Component
  • An Overview of the Dashboard
  • Configuring the Path Aliases in Webpack
  • Creating the Layout Components
  • Creating the Header View
  • Providing the Initial State to the Application
  • Using the State Data in a Component
  • Fetching the Video Meta Data
  • Hydrating the Store with the Video Data
  • Fixing the Footer to the Bottom
  • Outlining the Main Application Body
  • Outlining the Side Navigation
  • Adding the Navigation Section Headings
  • Completing the Side Navigation Design
  • Passing the Route Info from the Links
  • Adding Side Effects to Smoothly Scroll into View
  • Adding the Video Player
  • Final Touches

9: Where to Go From Here

Since Front-End Development is a broad discipline, there still will be things that we haven’t touched by the end of this course: There will be a dedicated section at the end of the class to guide you through how you can build upon the knowledge you have accrued already.

  • Thank You
  • Coming Up Next on “Zero to Hero”
  • What’s Next: Where to Go From Here

About Volkan Özçelik

Hi, it’s me, Volkan: Your instructor for
JavaScript: From Zero to Hero.

I am a JavaScript enthusiast, speaker, writer, performance engineer, and I work on all over the stack, from infrastructure automation to progressive web app development.

In particular, I love working with anything and everything that involves JavaScript: Be it server-side, client-side, or somewhere in between 😉.

I have been professionally coding JavaScript since 2003, and I’m actively programming since 1991—and still haven’t lost the passion for learning and sharing my experiences. You can learn more about me, watch the talks I’ve given and the open source projects I’m working on by visiting

Early Access Registration

Register for free and get an early access discount!

enroll today