Event Tracking and Attendance

This event tracking dashboard for roller derby is indicative of my daily front end work. As functionality is still in progress, the app is not fully polished. The webserver is built with node.js, express, and postgresql. The client utilizes a few different libraries, primarily bootstrap and jQuery.

Login

A simple login form that utilizes passport for authentication help.

Overview Chart

The overview page shows a chart of attendance over a selected date range. Utilizes chart.js.

Tables and Filtering

The tables are a custom implementation loaded via ajax. They make use of jQuery for ajax and delegated events, and handlebars for templating. The date range filtering is powered by bootstrap daterangepicker.

Forms

The forms are standard bootstrap markup and use parsley.js for validation. In the screenshot below is also a custom list pair widget I've written to easily manage adding users to an event.

Plans

The app is still receiving updates, so I'll post more here as things change.

As for the tables and custom list pair, I plan on putting the script up on github.