Every project / Games

🪐 Space Miner Clicker

Click the asteroid, buy drills and robots, and watch the crystals pile up.

Space Miner Clicker running
Language
HTML, CSS & JavaScript
Level
Beginner
Category
Games
▶ Try it & remix

What you'll learn

  • Buttons & click events
  • Updating the page with JS
  • setInterval
  • Arrays of objects
  • Saving progress

How it works

  • Every upgrade in UPGRADES has a price and a number of crystals it mines per second.
  • Ten times a second, a timer adds a tenth of your per-second total, so the number ticks up smoothly.
  • Prices go up 15% every time you buy one (price × 1.15 ^ owned). That curve is the classic idle-game trick.
  • Your progress is saved to localStorage every 2 seconds, so it's still there when you come back.

Files

FileLines
index.html25the page: what shows up
game.js101Each upgrade mines some crystals per second. Price goes up 15% each time you buy one
style.css102how it looks

Challenges

Each one is a bit harder than the last. Teachers: these make good assignment instructions.

  1. Rename the upgrades and change their prices.
  2. Add a new upgrade that costs 5,000 and mines 100 per second.
  3. Show a little "+1" that floats up every time you click.
  4. Add achievements, like "Mined 1,000 crystals".
  5. Add a golden asteroid that appears for 5 seconds and gives 10× crystals.