Giter Site home page Giter Site logo

aydinsakar / social-buttons-server Goto Github PK

View Code? Open in Web Editor NEW

This project forked from tfrce/social-buttons-server

0.0 2.0 0.0 154 KB

Host your own social counters servers while pulling live data from Facebook, Twitter and Google Plus

License: The Unlicense

social-buttons-server's Introduction

Social Buttons Server

Install social share counters on your website with your own hosted solution which only makes 1 API request and loads minimal or zero assets to display the counters.

This is an open source and self-hosted alternative to services such as AddThis and ShareThis.

Because you run the middle man server your self, you are also defending your users privacy against the social networks. (Users only opt into the tracking once they decide to share and not just because they visited your page)

Built by the RRITF for the recent 1984Day campaign

Features

  • Heroku enabled, create an app and deploy instantly
  • Has cache control variable(default 4 mins) so you can throw CloudFront in front with ease which result in faster API calls and less chance of getting rate limited

Getting started

  1. Clone(or fork) the repository
  2. Install dependencies npm install
  3. Run the server node social-buttons-server.js
  4. Access your stats at http://localhost:5000/?networks=facebook,twitter,googleplus&url=http://1984day.com
  5. Optionally push to a heroku app to automatically deploy

Options

Options are passed through query parameters in the url

Networks

Currently only Twitter, Facebook and Google Plus are supported

You use the networks query parameter to specify which ones you want to use as a common separated list e.g.

networks=facebook,twitter,googleplus or networks=facebook

Url

You use the url parameter to specify the address which you want to count the total number of shares for e.g. url=http://1984day.com

If you don't specify a url then the server will try to get the referring urls total share count. So if you make the API call on your homepage without the url parameter, the API server will return the numbe rof shares for your homepage url.

CloudFront

You don't want to be hitting the social networks API's constantly so it would be wise to throw up a cache in front such as CloudFront.

In CloudFront just make sure you to inherit cache control directives from the server and enable query string forwarding.

Eithr use your CloudFront url to access the API server or cname it with a custom domain of your choice.

Cross domain

The server as it is has CORS enabled which means any website can call the API SERVER. You can easily white list if this becomes a problem.

HTML Widgets

We would love to start collecting widgets that people design and want to share, please submit them in a pull request to the gh-pages branch and we will create a new section to list them

You can do anything you want to display your share totals when using the API. There are the examples linked at the top of the README and some short code below. Notice that we are using a CloudFront distribution in the examples.

<html>
	<head>
	</head>
	<body>
		<h3>Twitter</h3>
    <span id="twitter"></span>
    <h3>Facebook</h3>
    <span id="facebook"></span>
    <h3>Google Plus</h3>
    <span id="googleplus"></span>

  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  <script type="text/javascript">
    $.ajax('http://d28jjwuneuxo3n.cloudfront.net/?networks=facebook,twitter,googleplus&url=http://1984day.com', {
      success: function (res, err) {
        $.each(res, function(network, value){
          $('#'+network).text(value);
        })      
      }
    })
  </script>
	</body>
</html>

social-buttons-server's People

Contributors

thomasdavis avatar

Watchers

Aydin Sakar avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.