*NEW* DOM 2021 Build Dynamic Websites with JavaScript Part 2 (Udemy.com)

Advanced Document Object Model (DOM) Coding. Events, bubbling, hierarchy. Become a PRO in easy steps. Course 2 of 2

Created by: Clyde Matthew

Produced in 2021

icon
What you will learn

  • Master front end web development
  • Master the Document Object Model
  • *Download lectures (for offline viewing)
  • Learn how your website can come alive with actions, like zitsy changes on click, color wheels, drop-downs, response on form submissions and much more
  • Listen for different events (like click events, input events, focus events, and more!!!)
  • Practical - build awesome dynamic front-end applications with me
  • I am here to support you, step-by-step
  • What is a DOM event and why its so important to understand
  • Become a pro at listening for events that are fired
  • What a callback function is
  • The different types of events (such as keyup, mousemove, touch, etc.)
  • JavaScript objects vs DOM objects
  • Host objects vs native objects
  • Object hierarchy
  • What are DOM extensions
  • Event Capturing vs Event Bubbling
  • Master the skill of listening for events at various stages (capt

icon
Quality Score

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 98 / 100

icon
Course Description

Let me share my new front-end web development secrets with youMastering the DOM will equip you to become an awesome front-end web programmer. Learn how to implement your creative, different and dynamic ideas into your website. Master front-end development and youre half way to becoming a full stack web developer. Take control through understanding. Delivering an interactive web experience is challenging. In this advanced course, we take a deep-dive into DOM events. What are they? Why are they important? The different types of events we can listen to? Where do they come from? What is event bubbling and event capturing, and how does it help? By understanding these questions, and more, you'll be able to access the DOM and better yet, manipulate it! In other words, you will be able to create dynamic apps that improve user engagement and experience.
What this course covers?
This course is Course 2 of 2This course is the second and final course of a 2-part program. The reason I have done this is that Course 1 provides everything you need to start coding dynamic sites by yourself. It gives you the sound fundamentals and practicals regarding the DOM. It can be taken alone (you dont have to do both courses) to achieve your goals. You will emerge from Course 2 with a solid understanding and practical experience of working with events in the DOM. Course 2 provides a whole different world of fun with amazing practical examples that will captivate you and catapult you to the next level and set you well on your way to becoming a true Grandmaster in front-end web development. In this course youll learn more about front-end web development, by working with events in the Document Object Model.
Why this course?
Why do you need to know about events in the DOM?
If you've ever wondered how you can add animation (and life) to a page, then you need to understand how events work in the DOM. We use the DOM to allow users to interact with our app. It doesnt have to be annoying interaction either simple things like giving the user the ability to ADD/EDIT/DELETE/UPDATE contents on your page, for example, requires interaction with the DOM.
This course starts off with understanding what an event is. What are the 2 most important things when it comes to events? What is the difference between an event listener and an event handler? From there, youll start exploring the different ways you can add events to your code. Youll learn simple, yet very powerful strategies to listen for events on your web page and then interact with the page when those events happen. We dont stop here, but get into more advanced things like learning about how an event travels in the DOM (capturing vs bubbling), which leads us to an even more important topic of ... wait for it ... event delegation. And this is only the tip of the iceberg. We go into many other things like DOM extensions, object hierarchy and a bunch of other stuff.
Knowledge of the DOM is incredibly useful for understanding how your webpage can be improved.
By the end of this course, you'll be able to speak and walk DOM by gaining an understanding of how you can manipulate it in meaningful and practical ways. We dig deeper in every lecture, and this course has many bonus lectures which extend your knowledge base and test your skills.
Through practical examples, this course helps you understand the DOM piece by piece. And we use the latest and best features of JavaScript and browsers (like the new classList API) along the way so you can stay ahead of the pack.*** The most important Web Development course on Udemy ***Successful programmers know more than rote learning a few lines of code. They also know the fundamentals of how events work on your website behind the scenes. If youre wanting to become a full stack developer, you need to know how to work with various events in the DOM. You need to know what an event is, how to listen for it, and more importantly, how to react to events when they happen.
I want you to become a successful front-end programming Grandmaster.
I want you to be able to apply what your learn in this course to your webpage.
This course is perfect for you.
DescriptionHi there, my name is Clyde and together were going to learn how successful web developers can create whizbang websites that are dynamic and engaging!
The root to understanding how to be a professional front-end web developer is understanding the Document Object Model and applying it to practical situations. We're going to practice and learn and emerge confident to tackle any challenges modern programs and websites throw at us.
After completing a few university degrees, and post graduate studies, I developed a fascination for web design and software languages. For several years I have immersed myself in this. I spent a fair bit on top courses and went on to apply the knowledge practically. I recognized gaps in some of the courses Ive taken and hence my course teaches what I wish I was taught. My intention is to share the knowledge with you in an easy to follow manner, so that we can benefit together. You benefit form learning, and I from sharing in your success.
This course is for beginners and for intermediates.
A unique viewUnderstanding the DOM is a vast topic. To get you up to speed, Ive spent months thinking about where to focus content and how to deliver it to you in the best possible way.
You will learn "why" things work and not just "how". Understanding advanced topics within the DOM (like event types, capturing, bubbling, delegation, host vs native objects, etc.) is important as it will give you infinite possibilities. Armed with this knowledge, youll be able to create applications that update the data of the page without needing a refresh. You will be able to create apps that are customizable by the user. You can even allow the user to drag, move, and delete elements. Can you begin to see how important the DOM is?
How is this course different?
There are lots of great courses that focus on web development. Pity they never get into the detail about how the Document Object Model works behind the scenes a skill that every full-stack developer needs to master.
In this Part 2 course, I focus on the more advanced topics of true web development in the front end. This includes understanding what events are, looking at object hierarchy, understanding the different event types, what capturing and bubbling is, and how you can use the concept of event bubbling to streamline your code and make your job of creating dynamic websites easier.
Practice makes perfectTheory is theory but theres nothing like getting behind your computer and typing in code. Thats why we will be coding, laughing and pulling out our hair together as we code real life websites and exercises during this course.
I love practical examples, which is why we build simple pages and analyze the DOM together.
This course is FULLof practical examples, challenges, and we even build an entire project website from start-to-f

icon
Instructor Details

Clyde Matthew

Ideas are a dime a dozen. The hard part is execution. Unfortunately, most people never carry tasks to completion.

I've worn many hats in my career As a result, I have an ability to view all sides of a coin, something that is becoming crucial in our tech-savvy world.

My experience and a few words:

Ive had to learn things the hard way (aka: hard slog).
I want to teach people what Ive learnt, with the hope of making a meaningful impact (clich, but true).
No one is a master of everything. But at the same time, you need to be better thanmasterofone.
Credit is not the main objective.
I dont care about titles.
I care about results.
Understanding means less mistakes later, and mistakes cost a fortune (both money and time).
Everything should be assimpleas it can be, but notsimpler (not from me, from Einstein)

Oh, and one last piece of advice dreams remain dreams until you take action. So with all the skills you learn (whether from me, or other great people all over the web), remember to take these talents and do something with them. Remember what the Bible taught us about the rich man who gave talents to 3 of his workers? The first 2 servants used the talents to trade and gain profit. The third servant was fearful and hid the talent. Dont be like this third guy. Build websites and apps (which I think we can all agree on, is the way of the future), build businesses, and build your brand.

icon
More javascript courses

Introduction to HTML5

Free

Functional Programming Principles in Scala

Free

Introduction to CSS3

Free

Front-End Web UI Frameworks and Tools

Free

Learn and Understand AngularJS

$11.99

Programming with JavaScript

$11.99

icon
Reviews

4.9

39 total reviews

5 star 4 star 3 star 2 star 1 star
% Complete
% Complete
% Complete
% Complete
% Complete

By Pramod Shivane on 12/20/2020

it was amazing

By Bozhidar Savov on 11/20/2020

The best DOM course on udemy!!! Watch, learn and have fun!!!

By Sam Carpenter on 11/7/2020

Hmm

By Xenos on 10/20/2020

I can say that it was a good course in general. In the beginning the examples were good and you had some hints what to do as the theory was previous explained. After the half of the course that changed and most of the exercise was explained in the solution. The same happened for the final website project. It would be better if he could explain the theory before and then try on our own to code it.

By Samir Tal on 10/14/2020

very good course

By Richard Magnor Stenbro on 10/10/2020

Still awsome, but my cats are not amused by the comment "Skin a cat, mjau"

By Andrew Armachuelo on 9/26/2020

Very engaging.

By Katya Sorok on 9/20/2020

This is a really amazing course. I seriously have not found any other courses that would manage to explain DOM organization and structure, the overview, and some advanced subjects. I am really grateful to the teacher for deeply caring that those things would be known and understood. These Fundamentals are so important. Everything else is starting to make so much more sense. The course is also very fun, the quizzes, the projects, the little summary articles. Thank you.

By NTWALI Benjamin on 9/19/2020

more details about the course. excellent course

By Jessica den Hollander on 9/16/2020

So happy i found this course. I've 'studied' JS before but never ever did someone explain so well how to manipulate the DOM. I started with part I, which was a good choice for me.
Clyde is fun to listen to, You hear the joy in his voice. He answered my questions very fast. I recommand this course!!

By Rakan Douli on 9/4/2020

Easy and fun lectures.... well organised and efficient.

By Buraklacinel on 9/3/2020

Highly recommended!!