Building Bootstrap Table using Google Polymer with Visualforce

Component driven development is the hottest trend in the market and many company are approaching towards it to take an early lead. Lightening is launched today at Dreamforce , while Google have Polymer,  Twitter opened up Flight Framework, Facebook with React and Firefox with Brick. So clearly web-components are the future.

To understand how the framework better, I wrote couple of blog post about playing with Polymer framework by creating video component while other on using Salesforce Polymer Pack.

After writing post, I worked +Akhilesh Gupta  +Lauren Grau +Martin Meyer  in our team on an internal project for developing analytical charts. Developing charts, involves understanding charts libraries writing code to process data and therefore, I wrote a official post about using Google Polymer with Salesforce to built fascinating charts

+Avinava Maiti author of amazing bootstrap driven visualforce component library called VisualStrap have teamed up and we wrote another components while playing with components. We decided to use Bootstrap with Google Polymer in Visualforce and wrote another table component that let you change the attributes easily and plugin salesforce data with it.

Using Google Polymer with Salesforce to generate Bootstrap Table Component

In order to generate bootstrap tables, just link this table components to a custom/standard object to pull data. In the code below, I am trying to pull fourteen (14) contact record and listing selected fields and marking them as success (which turn the table green in bootstrap).

You only need a line of code to do all this magic

Implementation :
To implement table components on page, refer the PolyForce library for instructions. After install the package listed on library, add the datable components on any to show up on the page

Source Code :  Source code for this component can be downloaded from here