Pong game is a two-player table tennis-themed video game. The game involves two paddles and a moving ball. The players have to move paddles in an upwards or downwards direction and save the ball from getting hit onto the wall. If the ball hits the wall then it's a score for another player.

  • Create an HTML file with the name index.html
  • Create a CSS file with the name styles.css and link it in the index.html file using the link tag
  • Create a JS file with the name index.js and link it in the index.html file using the script tag.
  • Create a div for the game board, ball, and 2 divs for paddles, i.e. player-1 and player-2.
  • Give some style to your game in the CSS file
  • Get a reference to paddles, balls, and game boards in JS.
  • Create a function in the index.js file with the name move ball.
  • Give the ball a random direction and a random speed by changing the x and y coordinates of the ball.
  • Apply collision with ball and game board's top/bottom side, i.e. if the ball touches the top/bottom of the board then multiply -1 * y velocity of the ball.
  • Apply collision with ball and game left and right side of the game board i.e increase the score and change game state to serve the state.
  • Apply collision with balls and paddles. i.e. multiply -1 * X velocity of the ball.