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
Haron - Rails TagHelper Trial Horse
Search
wtnabe
December 01, 2012
Programming
0
69
Haron - Rails TagHelper Trial Horse
Introducing Haron, Rails TagHelper App on Rails
at Kanazawa.rb meetup #4
wtnabe
December 01, 2012
Tweet
Share
More Decks by wtnabe
See All by wtnabe
Ruby de Wasm
wtnabe
0
17
Cloud Native Buildpacksって結局どうなの?
wtnabe
0
15
Decoupled System with Turbo Frame
wtnabe
1
63
join-kanazawarb-or-7years-passed-since-it-was-borned
wtnabe
0
730
let-me-edit-with-editor
wtnabe
0
280
google-photos-and-storage-and-rclone
wtnabe
0
380
one case of how to begin vuejs
wtnabe
2
410
Kanazawa.rb meetup #56 Coderetreat Intro
wtnabe
0
400
lightweight authenticity of microservices
wtnabe
0
420
Other Decks in Programming
See All in Programming
よくできたテンプレート言語として TypeScript + JSX を利用する試み / Using TypeScript + JSX outside of Web Frontend #TSKaigiKansai
izumin5210
6
1.7k
Nurturing OpenJDK distribution: Eclipse Temurin Success History and plan
ivargrimstad
0
920
What’s New in Compose Multiplatform - A Live Tour (droidcon London 2024)
zsmb
1
470
PHP でアセンブリ言語のように書く技術
memory1994
PRO
1
170
Figma Dev Modeで変わる!Flutterの開発体験
watanave
0
130
A Journey of Contribution and Collaboration in Open Source
ivargrimstad
0
930
Better Code Design in PHP
afilina
PRO
0
130
AI時代におけるSRE、 あるいはエンジニアの生存戦略
pyama86
6
1.2k
Streams APIとTCPフロー制御 / Web Streams API and TCP flow control
tasshi
2
350
Amazon Qを使ってIaCを触ろう!
maruto
0
410
Webの技術スタックで マルチプラットフォームアプリ開発を可能にするElixirDesktopの紹介
thehaigo
2
1k
AWS IaCの注目アップデート 2024年10月版
konokenj
3
3.3k
Featured
See All Featured
Large-scale JavaScript Application Architecture
addyosmani
510
110k
The Art of Programming - Codeland 2020
erikaheidi
52
13k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
44
2.2k
For a Future-Friendly Web
brad_frost
175
9.4k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
1.9k
Designing the Hi-DPI Web
ddemaree
280
34k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
169
50k
Gamification - CAS2011
davidbonilla
80
5k
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
28
2k
What's in a price? How to price your products and services
michaelherold
243
12k
Transcript
Haron - Rails TagHelper Trial Horse - @wtnabe 2012-12-01(Sat) ⾦沢市⽂化ホール
Haronとは
何するものか RailsのTagHelper練習台 ブラウザで書いてブラウザで確認 だいたいrealtimeに変換
なんで作ったか Railsが得意でないデザイナ向け TagHelperをすぐに試せる環境 RailsでTagHelperの完全回避は無理
例えばimage_tag() <img src="">直書きは御法度 image_tag()でないと?serialが付かない <img src="/path/to/file.png?serial"> cache controlできない
Haronの実装技術
Rails 3.2 ActiveRecord ActiveDecorator Cells Ajax ( JSON )
Rails 3.2 機能的にはシンプルでRailsは不要 RailsのHelperを実際に動かすためにRails
ActiveRecord なくても作れそう 今回はscaffoldからスタートしたので
ActiveDecorator ViewコンテキストでだけModelをextend するModule Helperを使って<%= foo_bar_method( model ) %> Just <%=
model.method %>
Cells 独⽴したControllerとViewから成るView Widget partialでは収まりの悪い部品 Modelへのアクセスがあり様々なViewで 共通に使う部品 最近紹介されているが歴史は古いみたい
Ajax ( JSON ) scaffoldしたJSONのresponseに独⾃の情 報を付加 実際にTagとして変換できた場合だ けDOM更新 views/{C}/show.json.erb
keyup/down event handling realtimeっぽい部分 keyup + 500msでAjax -> DOM更新 keydownで上の流れをstop
続けてtypeしている間は黙って待つ
DEMO
ダメなところ evalを使っているのでサービス化不可 command injectionし放題 デザインとか考えてない feedbackもなくいきなりDOM更新
今後できたらいいな もうちょっと使いたくなるデザイン ActiveRecord撤廃 500 防⽌ ?
Enjoy Rails TagHelper :)