Recently for our local ruby meetup group we had a frontend Battle Royale. The idea was to make a simplistic rails app that could serve as a starting point and then implement a frontend in several different ways (ember, angular, etc) so that we can compare the costs and benefits of these different techniques.
Where to Start???
I wanted to start with implementing a small but interesting feature of the UI. In the application.html.erb layout there is a little sidebar that shows a list of comic books with a count of how many issues each comic book has. The initial erb looks like this:
```html sidebar erb template
This looked to me like a good chance to encapsulate some details. Wouldn't it be awesome if our layout just look like this? ```html <div class="row"> <div class="span9"><comics-book-list></comics-book-list></div> <div class="span3"><comcis-sidebar></comics-sidebar></div> </div>
Lets ignore the details of using a well class and li elements to represent this list. Let’s just think of it as a sidebar element. So what does the definition of a basic sidebar element look like?
```html comics-sidebar.html a polymer element