Clicker Game
By
@Nanos
- 1 Devlogs
- 2 Total hours
A simple Clicker game!
Ship #1
What did you make?
I made a browser clicker game using just raw HTML, CSS, and JS with zero frameworks. I took a ton of inspiration from Cookie Clicker. It has 15 different buildings, a synergy system where buying 10 of the same building doubles its output, random golden cookie bonuses, and a prestige system where you reset your progress to earn permanent diamond upgrades.
What was challenging?
The prestige system and the save/load logic. I didn't really plan the code architecture before I started writing so it got pretty messy. Trying to track all the different multipliers at the same time (base stats, normal upgrades, permanent prestige bonuses, and the x777 golden cookie frenzy) without them overriding each other was a huge headache.
What are you proud of?
Honestly, just how satisfying the UI feels to use. I spent way too long tweaking the CSS with frosted glass effects and a fake 3D button shadow that squishes when you click it. On the technical side, I'm glad I actually took the time to use requestAnimationFrame with delta time so your passive income still calculates correctly if you minimize the browser tab.
What should people know so they can test your project?
You just need to open the index.html file in any browser. You don't even need a local server. One thing to note is that the main script file is named scrpit.js instead of script. I made a typo when I first created the file and just never bothered renaming it.
2h 26m 52s logged
How I spent 3 hours making a clicker game and lost my mind
I sat down yesterday thinking, “A basic Cookie Clicker clone will take me 1 hour top.” Three hours later, I have 15 buildings, a full prestige system with a separate diamond shop, and a main JavaScript file named scrpit.js that I refuse to rename because I’ve accepted my typo as a feature.
What happened in those 3 hours?
Hour 1: Making it look shiny.
Before writing any actual game logic, I spent way too long tweaking CSS. I added glassmorphism to the menus, gave the main button a fake 3D shadow that squishes when you click it, and added a neon glow that pulses behind it. The game didn’t work yet, but clicking that empty button felt good.
Hour 2: Feature creep.
I started with 5 buildings, then thought, “let’s add synergies where buying 10 of the same building doubles its output.” Then I added Golden Cookies that spawn randomly to give you a x777 click frenzy (yes i got it from Cookie Clicker).
Hour 3: The Prestige System.
I decided to add a reset mechanic. Once you hit 1 million points, you can reset for Diamonds. But instead of a boring flat multiplier, I built a whole separate Diamond Shop where you spend your hard-earned gems on permanent upgrades that carry over into your next run. Getting the localStorage save function to remember both your normal run AND your permanent prestige upgrades was… chaotic.
The Code
It is absolute spaghetti, but it works.I used innerHTML += to render the building shop because I was too lazy to do proper DOM manipulation. I wrote manual for loops to search through arrays instead of using .find() because my brain was fried.
The only “clean” thing I did was implement a proper requestAnimationFrame game loop with Delta Time so your passive income doesn’t break if you minimize the browser tab. The game is completely unbalanced and the numbers get stupidly huge, but it was a fun 3 hours. Check out the repo if you want to look at scrpit.js and judge my variable names. Let me know what CPS you can hit!
