Day six: poly leaderboard

October 1, 2015

Poly leaderboard is an experimental application with Polymer on the front and python(Flask) on the backend. My goal was to create the Meteor leaderboard application using Polymer, Python and PostgreSQL.

live demo

Wiring up the server with the client was made simple using the mediator pattern. Basically, I created an element that handles the interactions between the two environments. This element only exists of two iron-ajax elements.

<iron-ajax
    auto
    id="scoresGetRequest"
    url="/api/get"
    handle-as="json"
    on-response="handleResponse"
    debounce-duration="300"></iron-ajax>

    <iron-ajax
      id="scoreUpdateRequest"
      url="/api/add-points"
      handle-as="json"
      on-response="getScores"
      debounce-duration="300"></iron-ajax>

The first request is automatically send and populates the view with scores. The second iron-ajax element is used to add or remove points.

change score preview

A simple iron-form element was enough to handle the creation of new users.

<form is="iron-form" id="form" method="post" action="/api/insert">
    <paper-input label="name" name="name" id="name" required></paper-input>
  </form>

create user preview

Getting up and running with Polymer is awesome! It is a lot more simple than I expected it to be.

Please leave a star on the repo and tell me what you think!

Comments