Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Frontend Choices
Search
Alex Coles
March 16, 2014
Technology
320
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Frontend Choices
Alex Coles
March 16, 2014
More Decks by Alex Coles
See All by Alex Coles
How a language reflects its people (Brighton Ruby)
myabc
0
130
How a language reflects its people
myabc
0
110
Taking Rails beyond the asset pipeline (Workshop at RubyDay Italia)
myabc
0
94
Rails: beyond the asset pipeline (RubyC)
myabc
0
150
Frontend Choices (Tropical Ruby)
myabc
1
820
Frontend Choices (RubyConf Portugal)
myabc
1
480
Frontend Choices
myabc
0
73
Putting the Hype back in Hypermedia
myabc
1
250
DataMapper
myabc
2
240
Other Decks in Technology
See All in Technology
KAEN Company Deck
kaen
PRO
0
290
作り直せるコードは迅速に 作り直せないDBは慎重に - AI時代のプロダクトエンジニアが「判断の不可逆性」で開発速度を変える話
kinosuke01
0
190
推論の観測、できていますか? 〜 Google Cloud Gemini Enterprise Agent Platformで 3つの Gemini モデルを実測して踏んだ、評価の罠 〜
shukob
PRO
0
140
Bet AI Day 2026丨AIを「使う」から、AIが「働く」へ ― LayerXが進める「組織AI」の社会実装
layerx
PRO
2
2.1k
設計の世代交代を乗り越える、14年続くAndroidアプリの開発戦略
sansantech
PRO
1
120
PM領域でのAI Agentの活用
lycorptech_jp
PRO
0
260
Guerilla InnerSource in enterprises, during the AI hype
onenashev
PRO
0
150
AIエージェントを雇う前に決める5つのこと
knishioka
1
150
[RSJ26] Building a VLA Model Based on Self-Distilled Classification
keio_smilab
PRO
0
190
Claude Codeで開発以外の業務も爆速化しよう!
minorun365
PRO
12
9.6k
PdMをやめて、 "プロダクトビルダー"という 働き方に変えました / PdM to Product Builder
shikichee
2
680
少人数データチームのDevin活用実践事例
runandy16
2
430
Featured
See All Featured
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
570
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
400
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
230
Testing 201, or: Great Expectations
jmmastey
46
8.3k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
42k
How STYLIGHT went responsive
nonsquared
100
6.3k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
430
Embracing the Ebb and Flow
colly
88
5.2k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
800
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
590
Transcript
Frontend choices Alex Coles | wroc_love.rb, Wrocław, Polska
Anti-climax
front end vs. frontend
Not really about choice
‘I’m a backend guy living in a frontend world’
About me
@myabc Alex Coles Berlin, Germany Finn GmbH
OpenProject openproject.org
1..2..3
eurucamp eurucamp.org Call for Papers open until 1st May
1..2..3
jeden one: background
Single page v traditional HTML
SPA depends on your content
no kupa, Sherlock
What’s your content? Information Pages Membership sites Closed Systems
Content Criteria • Authentication • Caching • Indexing (SEO) •
curated Content vs Dynamic
dwa two: where we are now
History of the Rails Interface
“Rails is so 2005”
“Rails Way” back in 2005 • Server Generated HTML (ERB,
etc.) • Prototype • Scriptaculous • RJS
“Rails Way” now • Server Generated HTML (ERB, Slim, HAML
etc.) • jQuery • jQuery UI • Server generated JavaScript Responses (SJR)
Where we are now
JavaScript is HUGE
No backend nobackend.org
Hoodie hood.ie
Meteor www.meteor.com
but I <3 Ruby
So here’s the question
None
Room for Rails?
The Rails Way
– Marcin Stecki @madsheep at wroc_love.rb “Not his [DHH]'s responsibility
to tell us how to do these things.”
Frontend frameworks
Frontend (MV*) frameworks • AngularJS • Ember.js • KnockoutJS
Frontend (component) frameworks • ReactJS • Backbone.View (alone) • ExtJS
TodoMVC todomvc.com
KnockoutJS
AngularJS
Ember.js
What is most like Rails?
Ember.js is most like Rails • Everything should inherit from
Ember.Object (think ActiveRecord::Base.inherited) • Routing DSL • Vocabulary (templates, partials, etc.)
trzy three: practical usage
Using asset pipeline / sprockets
Use Bower
gem install bower-rails
Rails 4 (Sprockets 2+)
config.assets.paths << File.join(Rails.root, 'vendor', 'assets', ‘components')
ember-rails-api github.com/dockyard/ember-appkit-rails
None
What is the way forward?
Split Completely
Two applications: one API, one frontend
Rails or Sinatra for API A JS workflow for Frontend
Surprisingly testable (and fast)
Dzięki!
Questions?
@myabc