remarkablegames/button-clicker

🔘 Button clicker

button-clicker

button-clicker is a template for creating incremental games. It's built with HTML, CSS, and JavaScript.

Play the demo.

The template is built with:

• GitHub Pages
• Vite

Games

Games that use this template:

• Button Clicker
• Replit Clicker

Prerequisites

• nvm

Install

Clone the repository:

git clone https://github.com/remarkablegames/button-clicker.git
cd button-clicker

Rename the project:

git grep -l button-clicker | xargs sed -i '' -e 's/button-clicker/my-clicker/g'
git grep -l 'Button Clicker' | xargs sed -i '' -e 's/Button Clicker/My Clicker/g'

Update the files:

• README.md
• index.html
• package.json
• public/manifest.json

Install the dependencies:

npm install

Initialize a new repository:

rm -rf .git
git init

Make your first commit:

git add .
git commit -m 'feat: initialize game from button-clicker'

Commit messages follow the Conventional Commits format, which is used during release.

Once you're ready, push the local repository to GitHub (or another remote repository):

git remote add origin <remote-repository-url>
git push origin -u origin master

Environment Variables

Set the environment variables:

less .env

Update the Secrets in the repository Settings.

Available Scripts

In the project directory, you can run:

npm start

Runs the game in the development mode.

Open http://localhost:5173 to view it in the browser.

The page will reload if you make edits.

You will also see any errors in the console.

npm run build

Builds the game for production to the dist folder.

It correctly bundles in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.

Your game is ready to be deployed!

Sources

Articles and diagrams that clarify idle game mechanics:

• The Math of Idle Games
• Numbers Getting Bigger: The Design and Math of Incremental Games
• Cookies Calculator

License

MIT