Build a Simple Clicker in less then half an hour
Simple Clicker Game
First things first, we’ll do the html. Start by created an image tag, this will be what the player clicks
Now, we’ll need to display the score, since it is important we’ll use an h1 header
Then we’ll add some upgrade buttons. They’ll just be simple, one will upgrade the amount of points you get per click, and the other will upgrade the amount of points you get per second.
There we go, the easy part is done.
Now we’ll go to the js. The first thing that we need to do is declare some variables
Now we need to add to the score when we click the picture, we’ll do that with this function
Then we’ll do the upgrade functions
Ok, now we can upgrade our points per click and our clicks per second. There’s only one issue, we are getting any more points per second. Right now, the cps upgrade does nothing.
We need to create a set interval function first, like so:
Every 1 second this function will update our score. Everything should be working. It’s time to make things look a bit better.
You can style your game however you want, this is how I styled mine:
So there you have it, a simple clicker game that can be made in under half an hour. If you want to get move complicated you can add more upgrades, or set the prices to slowly increase.