Thanks Kyle! Awesome project. If you play in a narrow window for a while, you may notice there's a little bug when the ball touches the player paddle from the top or bottom, rather than from the front. It kind of slides through the paddle on the y axis, changing the x direction constantly and exiting randomly to the right or left (making the player lose a point). To try and solve this I created a boolean variable ballisColliding, and set it to true when a collision is detected on a collision test and it was previously false. And set it again to false, when it's value is true and a collision test returns false. Also, I set it to false on the reset function. It still looks funky because the ball changes direction from inside the paddle, but at least this solves the major issue. Next step, i guess it would be to detect if the ball collides with the top or bottom of the paddle, and if so, also change the y direction of the ball.
Hi Kyle, thank you very much for this great tutorial. I've had great fun in following the video and watched in awe how things progressed. And that in a about 39 minutes. You're speed is amazing. Sometimes I could use a tad more explanation, but that's just me. Thank you for all your hard work!
Hi Kyle I’m new to your channel I have come to your channel from learn json in 10 minutes and I was thinking can you also maybe make a 20-45 minute JavaScript crash course that covers the basics of JavaScript I find your content easy to understand and simple to follow. hence I have subscribed to your channel I really like the 30 minute crash courses that you have made thanks a lot
Because your css variables are only updated by the update function, you can optimize your game loop a bit by using x and y local JavaScript variables then update CSS variables afterwards. This trick will make your game less cpu intensive on low-end devices.
@@daveperry7179 i don't have any channel, I am doing full stack development for more than 10 years (mainly Java stack, but I also do HTML/CSS/JavaScript quite often). As a result I learned some optimisation and accessibility tricks along my career ;-)
I dont understand how you guys enjoy such tutorials. We have no idea how the logic is going to be until right before the line of code is written. I can't focus nor expect what is coming and what we need to add next since I don't know what are the steps coming. Is it just a me problem? If so, how can I benefit from such tutorial?
It was awesome to see and follow but at one point the speed was brutal...this definitely is not a beginner project but still worth doing. Honestly, at times, the difficulty and speed just killed me as I didn't understand what was going on but in many parts I did.
Nah, this is a beginner project. It's the pure basics of a game. Doesn't get much easier. Doesn't necessarily mean it's intuitive however. Well... it is for me, but I've also made many games before. It wasn't when I was new to making games.
No, Kyle, I'm old. I'll be 60 very soon. We played pong on my grandma's TV (the old 19 incher built into a fake wood cabinet). The ball is a square block, not round.
I followed the video verbatim and had no problems for 18 minutes. then i tried to do the reset loop thing and my code just doesn't work. won't console log anything. i literally copy pasted your code from github for that section and still doesn't work. watched 18-24 min part probably 10 times... it's like 8 lines of code i've fine combed through it 100 times... what is the problem?
You went a little too fast in some parts of you coding. and too slow in others. Find the middle ground. Otherwise, you are very good at explaining and you have a new subscriber. Keep those javascript project videos coming. Thanks for the Github link that help alot. You are one of the few who actually shares his github project link. In my book you have one of the best channels on javascript here on youtube.
I really like your tutorials but there are 2 things I think are just confusing: 1. you almost never use semicolons. This can make debugging a mess. 2. I am sure you are well familiar with js-types and type-coercion, but the way you use it is inconsistent i think. A declared, but uninitialized variable like "lastTime" is not "null", but "undefined". But you compare it to =! null which uses type-coercion and only works, because undefined and null are falsy. A better way in my opinion would be either to check if it is !== undefined OR just use if(lastTime). This would coerce lastTime to truthy when it is initializes the first time. This would be less confusing imo.
Your suggestion of preferring `if (varname)` over `if (varname != null)` unfortunately doesn’t provide a sufficient alternative. The expression `varname != null` does _not_ check if varname is falsy. It checks if varname is null or undefined, and this works because null is abstractly equal to undefined. If you replace `varname != null` with `varname` in an if statement, you would incorrectly be excluding certain falsy values like 0 and the empty string. So in general, the only equivalent alternative to `varname != null` is either `varname !== null && varname !== undefined` OR, if you’re absolutely sure you’re only gonna get `undefined` and never `null`, `varname !== undefined`. The expression `varname != null` is way more concise than the strict-equality alternative of checking against both null and undefined. Additionally, in most situations you are using this as a guard to protect code from erroring out, and the vast majority of the time if you want to ignore undefined, you also want to ignore null (or vice versa). Thus I strongly thing it is perfectly good to write `!= null` and even to get into the habit of writing it in places it isn’t strictly necessary, like in the video. You don’t need to ignore a feature of JavaScript STRICTLY because it utilises type coercion. You should generally only ignore a feature if it leads to confusion, is greatly unintuitive, and/or can not be figured out with a really quick Google search immediately after seeing it. Now granted, most of the time JS features that use type coercion do indeed fall into one of those categories. But I don’t think this is one of those times. You only need to learn `!= null` once, and when you do you’ll never forget it. It makes the code more concise, it covers a very common use case, and it will very rarely lead to confusion (which cannot be said of all JS’s feature). Those things combine to give the expression my personal endorsement. Sorry for the long response to a 2-month old comment. I was a little passionate 😬
you can use the event listener keydown and keypress instead of mousemove. Check this out for in-depth tutorial: ruclips.net/video/kX18GQurDQg/видео.html
Nice video! A better approach of reset function instead of the loop can be picking a random number for the heading between, let's say, -pi/4 and pi/4, and then another random boolean for left and right direction (adding pi/2 or adding nothing). That way you don't have a loop that has infinite complexity because of the randomness (we all know that won't be infinite though haha)
Hi, im trying to follow all the steps but i think there's something stucking my browser. in a certain stage i cannot see the same as you do, even writing the same code as you do, for example when you define background-color and foreground color by a variabe. Do you think there is some extention missing or can be another issue? i see all black, just the player result i can see in a darker black...
Oh man at first I thought you were mistaken because I thought that delta was printing out time in seconds. Quite impressive even for a computer to both track the time and print it out in hundredths of a millisecond.
why am I not seeing the time variable that is used in the update function? I have the exact same code as in time 12:47 and the console.log function does not print out the time like in your example. Here is my code: import Ball from "./Ball.js"; const ball = new Ball(document.getElementById("ball")); function update(time){
Wow you’re more than beginner ! So complicated to me and my 2011 laptop doesn ‘t like var etc.. in css..thx for all your knowledge anyway, guess it will take me years to get JS to understand!
Hi, When would we use this vs when we should use canvas?it’s interesting that you can do similar things with both this css heavy approach and the html canvas. What are the pros and cons of this vs that method
Supposedly this is supposed to be easier just because of the ability to use things like click event handlers but if you are making a big project and you need maximum efficiency you may wish to consider canvas or webgl.
Hello so I caught a bug/feature ;) in the project: if you collide your paddle with the ball vertically the ball changes the x-direction but if it's still colliding with the paddle after the direction changed then it's gonna change the direction again and you get this weird effect where the ball is stuck inside the paddle for half a second
hey! so, I tried to do this on my own and it worked until the very end. I did something and my game is not working as it should. when the ball hits the wall, it should reset and score +1, but instead the ball gets stuck at the wall and it doesn't change the score or even reset the game. I copied your code (script, ball and paddle) to see if I really messed it up but it didn't corrected anything actually. any ideas? I really wanted this to work as it should. edit*: ok, turned out it was something in the css and html. I don't know what it really was (because I ctrl+c ctrl+v literally everything to see if it would do some good) but yeah I fixed it. great video, great tutorial, very educational and I understood even the hard things. +1 sub!
I experienced the same and after I read your comment I searched for the difference. Turned out that instead of "id=player-score" and "id=computer-score" I wrote "class=player-score" So the id was never found! Hope this helps someone
Loving this tutorial, I'm just running into one issue.. I am at 24:14 and when I type in: this.x += this.direction.x * this.velocity * delta I get a typeerror: 'Uncaught TypeError: Cannot read properties of undefined (reading 'x')' I'm following along exactly, and I can not for the life of me figure out what is wrong. I thought maybe it was because the import ball.js at the top of the scripts is labeled with a capital B instead of what the file's name actually is (lower case b). But that didn't work. Any help is greatly appreciated!
Absolutely amazing, would like to than my tutors for pushing me to do this, would also like to thank my family and friends for helping me watch this video and giving up 5 minutes in!!!
I get the coding part, but the math with sin and cos is just the thing you need to know math. Or how to get position on x or y... Not that easy if you don't know something.
2 года назад
Great stuff. What about a card decks or domino one?
at 13:10, shouldn't it be undefined not null? Since we didn't set a value to lastTime, it's undefined. I tried it with undefined if (perviousTime !== undefined){ const detlaTime = passedTime - perviousTime; } and it worked. and it worked with null as well?? Also, can't we just use the previousTime (which is lastTime) alone? since the first value will always be undefined, by default the first run of if is False,, but all other instances we'll have a number value, thus if will be true
Hi, I got this message in console: Uncaught TypeError: Cannot read properties of undefined (reading 'x') at Ball.update (Ball.js:44:34) at update (script.js:16:12) Does somebody help me on this to fix it? I'd appreciate it.
I guess this means that at line 44 in ball.js somehow you have an x variable which isn't properly defined but it's hard to say without seeing the code.
This tutorial was too problematic for me I'm at 10:16 and it's taken me two hours. And I'm following everything. I've checked my code several times and the 'root' thing wasn't working neither was the padding and you speak way too fast even on. 75x playback
Thanks for cool presentation. Could you clarify one thing please or suggest where I can read about it. I didn't understand how you made this function work? function update(time){ window.requestAnimationFrame(update) console.log(time) } window.requestAnimationFrame(update) I tried to console.log(time) outside the function and received the error that "time is not defined", however it perfectly works inside the function. if I replace "time" on another variable, it works as good as with time. So my question is: how does computer understand that he should console.log the time
Because time is defined locally inside the function and you could only access it inside the function. The way the function works is looped. Notice how requestAnimationFrame has window object it to be accessed globally "Window.requestAnimationFrame(update)" will call the function which inside of it has the same " window.requestAnimationFrame(update)" which will run itself again, and again and again forever.
thanks for the video! there is something i`v been struggling about, as i open my live server , my ball starts to move on but gets distorted while moving. i`v double and triple checked my css and the delta update ball function. there seem to be nothing wrong. is there a reason why my ball gets distorted?
I cannot for the life of me figure out why the ball in my code doesn't start off at the same speed every time I start the program. It also disappears whenever I open a different tab. Is anyone else having this problem?
Quick question, can you set attributes in a class also with setters and getters? or how is the this.position attribute initialized in the Paddle class?
on the constructor (which is called once when the object is created), he's calling the reset function, which is setting (and initializing) position at 50. That set, is also setting the css property variable at the same value.
Good explanation and all but bro the speech the fast to comprehend. Please try to speak slow to understand the things that you are saying and also video length doesn't matter. Hoping to see this
At the point of defining reset() stops behave as on tutorial, unfortunately I can't continue follow...You definitely know a lot, but this was fast and not begginers friendly. Sorry
did you add the live server plug-in if you using visual code studio? if you not using visual code studio find the file the main one and open with the browser of your choosing.
I think my brain grew by 1inch! That was a lot of information to take in, but I'll replay it and keep on trying to understand! Thank you so much!
Lmao 😂
me struggling to center a div
Loool same, flex is always there to center you on your path though
But u sure not struggle in making a lame joke
@@utkarshagrawal3640 wow, you must be fun at parties :|
Underrated comment
Put-stuff: in-the-middle-please
If you leave out the please, it wont work. Manners
Thanks Kyle! Awesome project.
If you play in a narrow window for a while, you may notice there's a little bug when the ball touches the player paddle from the top or bottom, rather than from the front. It kind of slides through the paddle on the y axis, changing the x direction constantly and exiting randomly to the right or left (making the player lose a point).
To try and solve this I created a boolean variable ballisColliding, and set it to true when a collision is detected on a collision test and it was previously false. And set it again to false, when it's value is true and a collision test returns false.
Also, I set it to false on the reset function.
It still looks funky because the ball changes direction from inside the paddle, but at least this solves the major issue. Next step, i guess it would be to detect if the ball collides with the top or bottom of the paddle, and if so, also change the y direction of the ball.
Gotta love that moment where everything stops making sense and he's in full coding mode, forget explanations, just go Go GO!! 😂🤣🤣
Another great video Kyle, thanks. I am glad we can slow down playback lol
Thanks so much Kyle ❤️ This project is awesome and I've learnt a lot
Hi Kyle, thank you very much for this great tutorial. I've had great fun in following the video and watched in awe how things progressed. And that in a about 39 minutes. You're speed is amazing. Sometimes I could use a tad more explanation, but that's just me. Thank you for all your hard work!
Hi Kyle I’m new to your channel I have come to your channel from learn json in 10 minutes and I was thinking can you also maybe make a 20-45 minute JavaScript crash course that covers the basics of JavaScript
I find your content easy to understand and simple to follow. hence I have subscribed to your channel
I really like the 30 minute crash courses that you have made thanks a lot
Because your css variables are only updated by the update function, you can optimize your game loop a bit by using x and y local JavaScript variables then update CSS variables afterwards. This trick will make your game less cpu intensive on low-end devices.
can you send the link to your channel please?
@@daveperry7179 i don't have any channel, I am doing full stack development for more than 10 years (mainly Java stack, but I also do HTML/CSS/JavaScript quite often).
As a result I learned some optimisation and accessibility tricks along my career ;-)
I dont understand how you guys enjoy such tutorials. We have no idea how the logic is going to be until right before the line of code is written. I can't focus nor expect what is coming and what we need to add next since I don't know what are the steps coming. Is it just a me problem? If so, how can I benefit from such tutorial?
Watching your videos is kinda relaxing and fun haha people should try this instead of netflix sometimes
100% agree. Definitely more rewarding than a lot of what Netflix offers!
It was awesome to see and follow but at one point the speed was brutal...this definitely is not a beginner project but still worth doing. Honestly, at times, the difficulty and speed just killed me as I didn't understand what was going on but in many parts I did.
Nah, this is a beginner project. It's the pure basics of a game. Doesn't get much easier. Doesn't necessarily mean it's intuitive however. Well... it is for me, but I've also made many games before. It wasn't when I was new to making games.
I’m not getting random directions
No, Kyle, I'm old. I'll be 60 very soon. We played pong on my grandma's TV (the old 19 incher built into a fake wood cabinet). The ball is a square block, not round.
Thank you mate, it will definetly be one of my projects for searching job
Thankss Kyle ♥
Can you please also do some canvas games? I really want some canvas tutorials
I followed the video verbatim and had no problems for 18 minutes. then i tried to do the reset loop thing and my code just doesn't work. won't console log anything. i literally copy pasted your code from github for that section and still doesn't work. watched 18-24 min part probably 10 times... it's like 8 lines of code i've fine combed through it 100 times... what is the problem?
You went a little too fast in some parts of you coding. and too slow in others. Find the middle ground. Otherwise, you are very good at explaining and you have a new subscriber. Keep those javascript project videos coming. Thanks for the Github link that help alot. You are one of the few who actually shares his github project link. In my book you have one of the best channels on javascript here on youtube.
This is awesome!! Thank you so much I have learnt a lot from you!
I really like your tutorials but there are 2 things I think are just confusing:
1. you almost never use semicolons. This can make debugging a mess.
2. I am sure you are well familiar with js-types and type-coercion, but the way you use it is inconsistent i think. A declared, but uninitialized variable like "lastTime" is not "null", but "undefined". But you compare it to =! null which uses type-coercion and only works, because undefined and null are falsy. A better way in my opinion would be either to check if it is !== undefined OR just use if(lastTime). This would coerce lastTime to truthy when it is initializes the first time. This would be less confusing imo.
Your suggestion of preferring `if (varname)` over `if (varname != null)` unfortunately doesn’t provide a sufficient alternative. The expression `varname != null` does _not_ check if varname is falsy. It checks if varname is null or undefined, and this works because null is abstractly equal to undefined.
If you replace `varname != null` with `varname` in an if statement, you would incorrectly be excluding certain falsy values like 0 and the empty string. So in general, the only equivalent alternative to `varname != null` is either `varname !== null && varname !== undefined` OR, if you’re absolutely sure you’re only gonna get `undefined` and never `null`, `varname !== undefined`.
The expression `varname != null` is way more concise than the strict-equality alternative of checking against both null and undefined. Additionally, in most situations you are using this as a guard to protect code from erroring out, and the vast majority of the time if you want to ignore undefined, you also want to ignore null (or vice versa). Thus I strongly thing it is perfectly good to write `!= null` and even to get into the habit of writing it in places it isn’t strictly necessary, like in the video.
You don’t need to ignore a feature of JavaScript STRICTLY because it utilises type coercion. You should generally only ignore a feature if it leads to confusion, is greatly unintuitive, and/or can not be figured out with a really quick Google search immediately after seeing it. Now granted, most of the time JS features that use type coercion do indeed fall into one of those categories. But I don’t think this is one of those times. You only need to learn `!= null` once, and when you do you’ll never forget it. It makes the code more concise, it covers a very common use case, and it will very rarely lead to confusion (which cannot be said of all JS’s feature). Those things combine to give the expression my personal endorsement.
Sorry for the long response to a 2-month old comment. I was a little passionate 😬
So hard to understand what u do but I can learn a bit from this lol
Like all of your vids: love it!
But I am curious: how do you edit the code so that you control the paddles by up/down keys rather than the mouse?
you can use the event listener keydown and keypress instead of mousemove. Check this out for in-depth tutorial: ruclips.net/video/kX18GQurDQg/видео.html
Nice video! A better approach of reset function instead of the loop can be picking a random number for the heading between, let's say, -pi/4 and pi/4, and then another random boolean for left and right direction (adding pi/2 or adding nothing).
That way you don't have a loop that has infinite complexity because of the randomness (we all know that won't be infinite though haha)
That wouldn’t take different screen aspect ratios into account though
Hi, im trying to follow all the steps but i think there's something stucking my browser. in a certain stage i cannot see the same as you do, even writing the same code as you do, for example when you define background-color and foreground color by a variabe. Do you think there is some extention missing or can be another issue? i see all black, just the player result i can see in a darker black...
Kyle Plz Make a Hangman JavaScript Game Love ur Coding Style ❤❤❤
Awsome project! By the way I want to know what is the best way to add a pause function to this game?
this.velocity = 0
(of the Ball)
Amazing 😁.....where did you learn all this stuff?
You're the man! Thanks for the video
The paddles etc. are here but there's nothing moving and the colors are not changing, it's like freezed. can someone help me please
Can you make a sudoku solver using html+css+js🙆♂
Nope......... Web development is just a side learning 😉
Holy… Very Good!! 👍
I am not beginner, but I'll still watch it... (Or maybe I am, I cannot be the judge of that, but I know that there's always something to learn.)
Oh man at first I thought you were mistaken because I thought that delta was printing out time in seconds. Quite impressive even for a computer to both track the time and print it out in hundredths of a millisecond.
why am I not seeing the time variable that is used in the update function? I have the exact same code as in time 12:47 and the console.log function does not print out the time like in your example. Here is my code:
import Ball from "./Ball.js";
const ball = new Ball(document.getElementById("ball"));
function update(time){
console.log(time);
window.requestAnimationFrame(update);
}
window.requestAnimationFrame(update);
same here
Great tutorial, I learned a lot!
Wow you’re more than beginner ! So complicated to me and my 2011 laptop doesn ‘t like var etc.. in css..thx for all your knowledge anyway, guess it will take me years to get JS to understand!
If you still have that laptop, just put lubuntu in it and upgrade your ram to 16gb. Works wonders...
Hi, When would we use this vs when we should use canvas?it’s interesting that you can do similar things with both this css heavy approach and the html canvas. What are the pros and cons of this vs that method
Supposedly this is supposed to be easier just because of the ability to use things like click event handlers but if you are making a big project and you need maximum efficiency you may wish to consider canvas or webgl.
Thank you very much for sharing your knowledge. You are a very good programmer
Hello so I caught a bug/feature ;) in the project: if you collide your paddle with the ball vertically the ball changes the x-direction but if it's still colliding with the paddle after the direction changed then it's gonna change the direction again and you get this weird effect where the ball is stuck inside the paddle for half a second
What a mind 🤯🤯🤯 ... who says maths is not important in programming?🤑🤑🤑
hey! so, I tried to do this on my own and it worked until the very end. I did something and my game is not working as it should. when the ball hits the wall, it should reset and score +1, but instead the ball gets stuck at the wall and it doesn't change the score or even reset the game. I copied your code (script, ball and paddle) to see if I really messed it up but it didn't corrected anything actually. any ideas? I really wanted this to work as it should.
edit*: ok, turned out it was something in the css and html. I don't know what it really was (because I ctrl+c ctrl+v literally everything to see if it would do some good) but yeah I fixed it. great video, great tutorial, very educational and I understood even the hard things. +1 sub!
I experienced the same and after I read your comment I searched for the difference. Turned out that instead of "id=player-score" and "id=computer-score" I wrote "class=player-score" So the id was never found! Hope this helps someone
Thanks Kyle!!! Thanks WDS!!!
Loving this tutorial, I'm just running into one issue..
I am at 24:14 and when I type in:
this.x += this.direction.x * this.velocity * delta
I get a typeerror:
'Uncaught TypeError: Cannot read properties of undefined (reading 'x')'
I'm following along exactly, and I can not for the life of me figure out what is wrong. I thought maybe it was because the import ball.js at the top of the scripts is labeled with a capital B instead of what the file's name actually is (lower case b). But that didn't work.
Any help is greatly appreciated!
Same issue. I can't get this to work from here. I am stuck on the this.x +=. It gives me the same error
i'm stuck on this as well! Any updates? :/
@@leifjessop3612 any updates on this issue?
@@mikkodelosreyes12 nothing I found... they haven't responded
Bummer. I'm having the same issue.
Absolutely amazing, would like to than my tutors for pushing me to do this, would also like to thank my family and friends for helping me watch this video and giving up 5 minutes in!!!
I like how he misspells Rect for React 35:57
awesome dude, keep your good work, cheeeeers :)
I get the coding part, but the math with sin and cos is just the thing you need to know math. Or how to get position on x or y... Not that easy if you don't know something.
Great stuff. What about a card decks or domino one?
at 13:10, shouldn't it be undefined not null? Since we didn't set a value to lastTime, it's undefined.
I tried it with undefined
if (perviousTime !== undefined){
const detlaTime = passedTime - perviousTime;
}
and it worked. and it worked with null as well??
Also, can't we just use the previousTime (which is lastTime) alone? since the first value will always be undefined, by default the first run of if is False,, but all other instances we'll have a number value, thus if will be true
Excuse me but this is too cool!! :O
thanks men!
Hi, I got this message in console:
Uncaught TypeError: Cannot read properties of undefined (reading 'x')
at Ball.update (Ball.js:44:34)
at update (script.js:16:12)
Does somebody help me on this to fix it? I'd appreciate it.
I guess this means that at line 44 in ball.js somehow you have an x variable which isn't properly defined but it's hard to say without seeing the code.
me too
I'm currently experiencing this as well. We're you able to solve it??
Why are we building an update function instead of using the standard event loop of the browser?
This is a little hard than classic web development
I gotta say, very beginner unfriendly.
Thought I was following the code then the ball never moved after making the update function in the ball script. Absolutely no idea why.
This tutorial was too problematic for me I'm at 10:16 and it's taken me two hours. And I'm following everything. I've checked my code several times and the 'root' thing wasn't working neither was the padding and you speak way too fast even on. 75x playback
8:38 - oh no... Leave left left-aligned and right right-aligned, what you did looks confusing. ;(
It's a very nice project.
how to for mobile ?
Why use parseFloat instead of parseInt ?
parseInt removes the decimal digits
It's more accurate than parseInt
I just changed the background color to #333 but it wont update even when i save. What's going on?
Ty, supa usefull, working 1 year, still have no time to deeper understand game programming, hope this help)
But how do you make the ball circular and make it go to the center?
Thanks for cool presentation. Could you clarify one thing please or suggest where I can read about it. I didn't understand how you made this function work?
function update(time){
window.requestAnimationFrame(update)
console.log(time)
}
window.requestAnimationFrame(update)
I tried to console.log(time) outside the function and received the error that "time is not defined", however it perfectly works inside the function. if I replace "time" on another variable, it works as good as with time. So my question is: how does computer understand that he should console.log the time
Because time is defined locally inside the function and you could only access it inside the function. The way the function works is looped.
Notice how requestAnimationFrame has window object it to be accessed globally
"Window.requestAnimationFrame(update)" will call the function which inside of it has the same " window.requestAnimationFrame(update)" which will run itself again, and again and again forever.
Cant you do a video covering how to make an extension for firefox?
thanks for the video!
there is something i`v been struggling about, as i open my live server , my ball starts to move on but gets distorted while moving.
i`v double and triple checked my css and the delta update ball function. there seem to be nothing wrong.
is there a reason why my ball gets distorted?
But wouldn‘t it be better to use the canvas?
I copied the game and the AI never lose, how could I fix that?
I cannot for the life of me figure out why the ball in my code doesn't start off at the same speed every time I start the program. It also disappears whenever I open a different tab. Is anyone else having this problem?
Hello guys i am trying to make a pong game in angular , should i use this tutorial as base or to as inspiration ?
Quick question, can you set attributes in a class also with setters and getters? or how is the this.position attribute initialized in the Paddle class?
on the constructor (which is called once when the object is created), he's calling the reset function, which is setting (and initializing) position at 50.
That set, is also setting the css property variable at the same value.
Hmmm... Touch control?
i can't belive that css could be that complex!!!!!!!!!
i don't know if i'am stupid or this code is very hard for me to understand as newbie but very good explanation
My ball is not moving 😢
this isn't really for beginners, i had to look up half of the things and make notes using comments
i got an error if i use the second requestAnimationFrame why?
could u teach us how to make a pause button
Good explanation and all but bro the speech the fast to comprehend. Please try to speak slow to understand the things that you are saying and also video length doesn't matter.
Hoping to see this
Wait where is the ball? It is not appearing for me...
check your css code
I tried this out without using live server. It did not work xD
nah when bro started talking about trigonometry 😭😭
how can I do this ! and enter, should I download womething?
Please help me out, I want to know a best compiler for html, css and javascript for a android phone.
This dude is like a young jerry rig everything
When can you ever score?
dont start with me :(( im downloading your repositore and dont start too, i just dont understand whats happening
This project no longer works as module is depreciated
Bro could u please build more project with vanilla JS
The balls x and y coordinates show up as NaN while using inspect element. I need help
I spent too much time with javascripts demonic type coercion. Turns out lastime is undefined not null. != does type coercion, I used !== out of habit
please Construct 3 tutorial 🙏🙏
At the point of defining reset() stops behave as on tutorial, unfortunately I can't continue follow...You definitely know a lot, but this was fast and not begginers friendly. Sorry
Bro I need social mapper tool for get peoples names using a photo. Video please
Bro, I want to use A and D keys instead of Mouse
coding ninjas 😂😂😂
best thing to assign to a student bc my teacher assigned it to meeeeee :]
niceee
my ball is not moving!!!!!!
Why I don't have console?
Ctrl + Shift + J on Chrome. Or right click --> inspect, then change to the console tab
If I try the export and import it says parsing error the keyword export is reserved
did you set your tag to type="module"?
Hey i habe the problem that my browser dont wanna load my html document. Can someone help?
did you add the live server plug-in if you using visual code studio?
if you not using visual code studio find the file the main one and open with the browser of your choosing.