Can we make Pong in less than a 100 lines of Javascript?

The original Pong took Atari over 3 months to complete back in 1972. The classic arcade game was one of the first commercially successful games that paved the way for the game development industry.

Additionally, its simplicity makes it one of the first projects that any programmer takes on.

As a showcase of how much easier programming has become in the past 50 years, were going to be attempting to make Pong in less than 100 lines of Javascript!

You can play the finished project deployed on Codesphere here.

Lets get started!

Our Different Components

Theres going to be four parts that we need to build for our pong game:

1. Graphics
2. Paddle Movement
3. Bouncing Ball
4. Score Keeping

Graphics

Im going to cheat a little bit and use a graphics library to save us some menial work so we can strictly focus on the game logic.

Paddle Movement

Next up, lets create two paddles and draw them onto the screen. Additionally, lets allow the player to move them(Ill use the built in keyDown function from P5.JS)

Bouncing Ball

Now lets add in a ball. When the ball hits the top or bottom border, we want its y velocity to switch directions.

When the ball hits one of the paddles, we want its x velocity to switch direction and increase slightly(To hit harder). Additionally, to make the game more fun well randomize the y velocity so it is harder to anticipate the ball.

Score Keeping

Finally, lets start tracking the score. When the ball hits the left or right border well change the score and reset the position of the ball. Well then display the score at the top of the screen!

And there you have it! Weve created Pong in less than 100 lines of code!

If youre looking to show off a game you make, the easiest place to deploy it is Codesphere. Codesphere is the only cloud provider that makes cloud deployment as easy as local deployment!

Happy Coding and Merry Christmas!