Recreating Seth Godin's tap-based "likes" counter

I was wondering if anyone has an idea of how to build a simple counter like the one Seth Godin has on his blog here: https://seths.blog

The functionality is very basic. A reader can tap a “star” symbol and the number next to it increases by one. If you tap again, the counter goes up again. This is obviously not ideal, but I don’t mind that for my purposes if it makes the implementation significantly easier.

Any ideas on how to approach this?

Thanks in advance! Hopefully it’s a cool concept that others can benefit from.

Unfortunately you need a database to store the value so that it persists across page visits. The site you referenced is built with Wordpress and is using a plugin for the ‘Likes Counter’.

If you dont care about maintaining the value, then the most barebones dependency-free version would be as follows:

HTML:
< input disabled type=“text” id=“likes” value=“1” />
< button id=“up” onclick=“up(‘10’)”>

JS:
function up() {
document.getElementById(“likes”).value =
parseInt(document.getElementById(“likes”).value) + 1;
}

2 Likes

Thanks @Cjh for the quick response!

I can see a use case for the dependency-free version, too. I’ll consider applying it, and let you know if what the final product looks like if/when I do.

Thank you!