YOU MATE ARE A LEGEND !!!!!! PERFECT PACE!!! PERFECT TEACHING STYLE!!!! PERFECT EXAMPLES !!!!! and talking about your pace they should keep rewinding till they understand and practice at the same time no point just watching and not practicing it
Crystal clear and complete DOM/JavaScript tutorial, got much more from this in a few minutes than hours of other tutorials which left unanswered questions - the best of British!
It would be great if you can share the html and css files as templates so it would be easier to follow your code. The content is super useful, thank you!
the matrix star wars harry potter lord of the rings maervel
and this is CSS code: *{ padding: 0; margin: 0; box-sizing: border-box; } body{ background-color: rgb(49, 49, 94); height: 100vh; display: flex; justify-content: center; align-items: center; height: 100vh; } .container{ border: 2px solid white; border-radius: 4px; padding: 15px; } .list-items{ font-size: 22px; margin: 3px; background-color: aliceblue; display: flex; justify-content: center; } i tried abit to make exact background color but i could but still it looks same the edition on css.
It goes very well... They give me a project in which i have to manage events (i.e. marriage, birthday) and show it in the dom in a sorted manner with respect to time ... The hard part was to show the overlapping of two events .... Thats all .... And i did it very well .... And i got the job. All thanks to you Sir😍
wow I've never commented on a tutorial video and I never comment on anything, but 6:24 into the video I had to rush down here to add a comment, wow where have you been all this while I'm just coming across your channel. This video is by far the greatest DOM manipulation tutorial I've come across thanks for this and you've earned my subscription and advocacy, would make sure I convince everyone I meet to subscribe to your channel. please how can I get you to be my mentor, what must I have to do to have you mentor me, please? that would actually be one of my great achievements for the year 😇. Thanks once more for the great content
1:07:05 I dont really understand, why you do target.matches('li')... I have to admit that I never properly learned JS, so dynamically typed languages are new grounds for me... Is it for the reason that you can only securly access the properties of this thing you dont know of if it's an element or something else, so you have to check and if the condition is true (target === ) you can accesss its properties..?
Thank you very much. This is brilliant! I am yet to finish this tutorial but I've enjoyed every bit so far. But there is something I have been trying to figure out- around minute 45, the part where you used event listerners to reveal the dummy text. Looking at the HTML you wrote, the classes and ids you selected in the CSS, and the JS you wrote, I'm wondering how you made the border of the button go away anytime the dummy text is not displayed?I have been coding along with the tutorial but I could not do that😪
? Y in my console I can’t see when I reassign a variable I have to select the name of my JavaScript in the console. That’s where it shows me. Thanks for time and help.
It would be extremely helpful to have the code you had in the beginning of the tutorial available, rather than the code you had at the end of the tutorial, so we don't have to reverse engineer the style etc
Why don't you give people source code? Javascript always accompanies with HTML and CSS, without these, it is very difficult to get what you are doing. Anyway, thanks for your tutorial.
hey plz help me at starting point of course const a=document.getElementById("someid"); //it is id of header tag console.log(a); actually it is printing null in console I searched answer but I cant find answer or I cant understand explain me
Thank you so much for sharing your experience and thoughts, Can you please clarify that ruclips.net/video/P7NgFfIaWgU/видео.html is DOM Tree or Render Tree (CSSOM Tree + DOM Tree), please correct me if I am misunderstanding, as per my understanding DOM tree is not having CSS rules applied as shown in the diagram.
@@CodeLab98 the source code in github is different from what is shown in the video. Hope you could upload the same code. awesome stuff though. Thank you very much!
you know what? you were a lot fast while tutoring. could you be a little bit slow on the next video please? it was hard to keep up most times. thank you.
@@CodeLab98 I disagree the speed is right, Ogu needs to listen with more attention. If you you slow it then you will not keep the attention in the viewer.
Bro i swear to god this is BY FAR the best DOM explanation. Please dont stop with these Videos...
Thank you very much! I’m glad you liked it!
this is the first video i can follow and it doesn't make me sleepy, i finally understand DOM manipulation, thank you!
Thank you friend! I really appreciate that! I’m glad it helped!
YOU MATE ARE A LEGEND !!!!!! PERFECT PACE!!! PERFECT TEACHING STYLE!!!! PERFECT EXAMPLES !!!!! and talking about your pace they should keep rewinding till they understand and practice at the same time no point just watching and not practicing it
Thank you friend! these are the comments i hope my videos can achieve.. i hope it helped!
RUclips really be hiding the best channels your tutorials are just what I needed thanks man
haha i appreciate it!
Crystal clear and complete DOM/JavaScript tutorial, got much more from this in a few minutes than hours of other tutorials which left unanswered questions - the best of British!
Perfect tutorial.
Clear, simply, and very very easy to apply! even for a begginer like me, from a foreign country and language!
Glad it was helpful!
No BS straight explaination thankyou!!
It would be great if you can share the html and css files as templates so it would be easier to follow your code. The content is super useful, thank you!
Make your own, since you're trying to learn it, it shouldn't be a problem.
@Windows Enthusiast yeah :( those files would help
tis is HTMl code:
Favourite Movie franchise
the matrix
star wars
harry potter
lord of the rings
maervel
and this is CSS code:
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
background-color: rgb(49, 49, 94);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container{
border: 2px solid white;
border-radius: 4px;
padding: 15px;
}
.list-items{
font-size: 22px;
margin: 3px;
background-color: aliceblue;
display: flex;
justify-content: center;
}
i tried abit to make exact background color but i could but still it looks same the edition on css.
It's a waste of time, we want to practice JS not html and css @@Valdekist
i finally prepared dom for my interview .........thank you so much CodeLab
That's really good to hear! good luck in the job interview! let me know how it goes!
It goes very well... They give me a project in which i have to manage events (i.e. marriage, birthday) and show it in the dom in a sorted manner with respect to time ... The hard part was to show the overlapping of two events .... Thats all .... And i did it very well .... And i got the job. All thanks to you Sir😍
I appreciate your work.
I appreciate that!
The best on the net. Trust me
Thanks for your kind words!
@@CodeLab98 amen
Man This Is Great .
Love it♥.
If You Can Please Provide Link To That Ppt So We Can Constantly Memorize It.
Amazing! Definitely deserve more subs
Appreciate it!
wow I've never commented on a tutorial video and I never comment on anything, but 6:24 into the video I had to rush down here to add a comment, wow where have you been all this while I'm just coming across your channel. This video is by far the greatest DOM manipulation tutorial I've come across thanks for this and you've earned my subscription and advocacy, would make sure I convince everyone I meet to subscribe to your channel. please how can I get you to be my mentor, what must I have to do to have you mentor me, please? that would actually be one of my great achievements for the year 😇. Thanks once more for the great content
Thank you for your comments!
Dude! Where's Part 2! This tought me so much. I'm so grateful!
Will be out soon! in the process of editing
Waiting for the other parts.... thanks a lot
coming soon!
Great content with clarity and a smooth pace. Many thanks.
Glad it was helpful!
you sir are a phenomenal teacher
Thank you very much! :)
What a great introduction! Crisp and clear.... and dummy friendly (me) ;-)
You're a good teacher!
Is there a link or a copy of the stylesheet?
Excellent tutorial, many thanks. Will stayed tuned for part 2
Awesome, thank you!
I love this tutorial,thanks so much
Good job😊
Part 2 pls
Thank you for this video.
1:07:05 I dont really understand, why you do target.matches('li')... I have to admit that I never properly learned JS, so dynamically typed languages are new grounds for me...
Is it for the reason that you can only securly access the properties of this thing you dont know of if it's an element or something else, so you have to check and if the condition is true (target === ) you can accesss its properties..?
Thank you for this. It is well done and very helpful.
Very good video, Thank you
Glad you liked it!
Thank you ole sport
Hi Guys, the source code for this video is now in the description, with a few minor tweaks, the concept is still the same. Enjoy 😎
Great content ! keep going bro
Thank you bro!
mega cool!!!
Thank you very much. This is brilliant! I am yet to finish this tutorial but I've enjoyed every bit so far. But there is something I have been trying to figure out- around minute 45, the part where you used event listerners to reveal the dummy text.
Looking at the HTML you wrote, the classes and ids you selected in the CSS, and the JS you wrote, I'm wondering how you made the border of the button go away anytime the dummy text is not displayed?I have been coding along with the tutorial but I could not do that😪
Love this
Thank you so much! :)
I'd LIKE to request for the css file of this video. Great job by the way
Dear Sir, can we get the source code for HTML and CSS.
awesome tutorial
Thank you! Cheers!
thank you very much for such a great learning experience ;)
You're very welcome!
This content is really helpful, thanks a lot.
Where's the link to part 2?
Will be out soon! in the process of editing!
Hello Team codelab, could you please leave a link to the html and css files
? Y in my console I can’t see when I reassign a variable I have to select the name of my JavaScript in the console. That’s where it shows me. Thanks for time and help.
Thank you for a good tutorial :)
You are welcome!
I want to ask if dom is it important? Specially in frontend?
It would be extremely helpful to have the code you had in the beginning of the tutorial available, rather than the code you had at the end of the tutorial, so we don't have to reverse engineer the style etc
Files from the source are different from the ones we see in the video.
thanks for this
You're welcome
Can I move to React after clearing DOM manipulation concepts ??????????????????????????????
Why don't you give people source code? Javascript always accompanies with HTML and CSS, without these, it is very difficult to get what you are doing. Anyway, thanks for your tutorial.
Great stuff! I don't understand.. only 750 views???
Glad it helped! Haha hopefully more views soon! 👍
can we get the css part of the Movie Franchise?
50:30 one minor spelling mistake: It's propagation", not "probagation".
:-)
How was the index.html already Styled? From the get go
I wanted to follow along, but it seems that the repo is not synced with the video. Please update if possible.
please, I can't find the link to the second part of the tutorial
Part 2 will be out soon! stay tuned!
on the chapter of reveal more, mine is not working please can you send me the css styles you use in the reveal more or hidden content project
bro please provide starter files brooo how can we practice ????
Tutorial is pretty good, but github files are not full. In that way it was good training for remembering html and css too. Thank you bro!
Where are the files?
I noticed something odd in JS. Why is the document object not capitalized, like Document. Other built in Objects such as Math., Num. are capitalized.
that's a very good point! let me know what you find out!
@@CodeLab98 someone told me its because document is from the browser, and built in Objects like Math is from javaScript
the whole course content is cool however event delegation, event listeners and event propagation were cool topics.
How long did it take you to learn web development javascript?
It is crucial to learn the fundamentals. Everyone is different, but learning the fundamentals should take you 3-6 months.
Do you have that project on github so that I can easily follow along?
is it from beginner to advanced level?
i checked the source code but it doesnt have the code from earlier in the video with the other examples, which is a bummer
hey plz help me
at starting point of course
const a=document.getElementById("someid"); //it is id of header tag
console.log(a);
actually it is printing null in console I searched answer but I cant find answer or I cant understand explain me
Is the code available somewhere?
i think Github file does not match the video file in the content.
link to Part 2 please?
Currently in the process of editing...will be out soon!
Can u provide all the files??
I will post them in the description 😊
@@CodeLab98 thanks mate waiting for it.
I love you
I love you too! haha
Thank you so much for sharing your experience and thoughts, Can you please clarify that ruclips.net/video/P7NgFfIaWgU/видео.html is DOM Tree or Render Tree (CSSOM Tree + DOM Tree), please correct me if I am misunderstanding, as per my understanding DOM tree is not having CSS rules applied as shown in the diagram.
Hi, Its a DOM Tree :)
Where are the html files/ source code
i love you
Why do you not show the style code for each example? It's kind of necessary for these examples.
I have included a link to source code in the description
@@CodeLab98 the source code in github is different from what is shown in the video. Hope you could upload the same code. awesome stuff though. Thank you very much!
where is the source code bro. without source code how can we watch it and practice along with you. just leaving
I have added the source code in the description
What accent the guy talks in?
British :)
ok but the code on github is a bit different and quite confusing... am I the only one who does not praise the video before watching it?
you know what? you were a lot fast while tutoring. could you be a little bit slow on the next video please? it was hard to keep up most times. thank you.
Thanks for the feedback..i will look to slow down in future :)
@@CodeLab98 I disagree the speed is right, Ogu needs to listen with more attention. If you you slow it then you will not keep the attention in the viewer.
If he is fast slow the speed of video from playback speed
Your video is good, but it is really hard to listen to. Maybe you need to improve it