a brief wrapup about the ruby gem tabulatr2

1. tabulatr2
Index Pages for Lazy People…
Florian Thomas
ft@tickettoaster.de
@crunch09
Peter Horn
ph@tickettoaster.de
@n0dashes
Lightning Talk
Oct 3rd 2014

3. Classic Index Page
index.html.slim
simple ‘nuf
tr
th Firstname
th Lastname
th Balance
@customers.each do |customer|
tr
td= customer.firstname
td= customer.lastname
td= customer.balance
customer_controller.rb
def index
@customers = Customer.all
end

4. Classic Index Page
Lovely!
Just quickly add
• Pagination
• Filtering
• Sorting
• Searching
index.html.slim
simple ‘nuf
tr
th Firstname
th Lastname
th Balance
@customers.each do |customer|
tr
td= customer.firstname
td= customer.lastname
td= customer.balance
customer_controller.rb
def index
@customers = Customer.all
end
• Batch Actions
…and we’re done.

5. Classic Index Page
Lovely!
Just quickly add
• Pagination
• Filtering
• Sorting
• Searching
index.html.slim
simple ‘nuf
tr
th Firstname
th Lastname
th Balance
@customers.each do |customer|
tr
td= customer.firstname
td= customer.lastname
td= customer.balance
customer_controller.rb
def index
@customers = Customer.all
end
• Batch Actions
…and we’re done.

6. That can’t be!
• ActiveRecord is so simple (and even adequate)
• SimpleForm is so simple!
Why need tables to be such a hazzle?

7. That can’t be!
Because a friggin’ lot of stuff
is involved.
…but now
• ActiveRecord is so simple (and even adequate)
• SimpleForm is so simple!
…there’s tabulatr2!
Why need tables to be such a hazzle?

8. Tabulatr Index Page
index.html.slim
= table_for Customer
customer_controller.rb
def index
tabulatr_for Customer
end
customer_tabulatr_data.rb
class CustomerTabulatrData <
Tabulatr::Data
!
search :firstname, :lastname
column :firstname
column :lastname
column :balance,
format: :currency,
align: :right
end

9. Tabulatr Index Page
index.html.slim
= table_for Customer
customer_controller.rb
def index
tabulatr_for Customer
end
customer_tabulatr_data.rb
class CustomerTabulatrData <
Tabulatr::Data
!
search :firstname, :lastname
column :firstname
column :lastname
column :balance,
format: :currency,
align: :right
end

10. There’s so much more
• All data is fetched via ajax
• Custom SQL for sorting, filtering, sorting, no N + 1
• Tables are (by default) stateful
• Infinite scrolling, if you so wish
• Shortcuts to create ‘action’ buttons
• Support for static tables (non-ajax)
• Batch actions
• …

11. How Does That Work?
(rough concept only)
Controller
Renderer
DSL
Javascript
View
TabulatrData

12. 122.54% Cooler!*
✴ Based on a study with 4 developers that took place
between October 1st and October 2rd 2014 in
some pubs in Ghent. There definitely was too much
alcohol involved, and the number is made up
anyway, but things look so much more professional
with a footnote.

13. Sparklelord demands:
Give it a try!
Talk to us!
@n0dashes / no-dashes!
@crunch09 / Crunch09
github.com/provideal/tabulatr2