mikkelhegn / like-button

A simple and persistent like button for your blog

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Like Button

This is a simple and persistent like button for your blog built with Spin.

Using it on your blog

  1. To start make sure you have Spin installed on your machine. Installation instructions can be found here.

  2. Then clone this repository and build the Spin app.

    git clone git@github.com:calebschoepp/like-button.git
    cd like-button
    spin build
  3. To locally test the like button we can run the Spin app on our machine by running spin up.

  4. Next add the following HTML to your blog wherever you want the like button.

    <iframe
      style="width: 72px; height: 40px; margin: 0; padding: 0; border: none"
      src="{BASE_URL}/static/likebutton.html?key={YOUR_KEY}"
      title="Like Button"
    ></iframe>

    You'll need to replace {BASE_URL} with http://localhost:3000 if you're running your Spin app locally. If you've deployed your Spin app then you'll need to use the url provided by Fermyon Cloud.

    {YOUR_KEY} should be replaced with a unique key for that instance of the like button. For example if you place a like button on each of your blog posts then you could make the key the url of that blog post. This will make sure that each blog post has its own like count. Alternatively, you could use the same key for each like button on your blog and they would all be tracking the same count.

  5. When you've confirmed that the like button is working you can deploy the Spin app to the Fermyon cloud which will allow you to run the like button in production. You can deploy by running spin deploy.

Security

Local storage is used to prevent users from easily liking a post more than once. However, note that there is nothing preventing a user from getting around this and liking a post as much as they want since the API is not authenticated.

How is it built?

Coming soon!

About

A simple and persistent like button for your blog

License:MIT License


Languages

Language:JavaScript 45.8%Language:TypeScript 37.2%Language:HTML 17.0%