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
From Backbone.Views To ReactJs
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Sarmad Sangi
April 28, 2014
Programming
270
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
From Backbone.Views To ReactJs
Sarmad Sangi
April 28, 2014
More Decks by Sarmad Sangi
See All by Sarmad Sangi
Git Flow
sarmadsangi
0
130
Other Decks in Programming
See All in Programming
AIを紡ぐPMのお話
swdtkuy
0
120
リアルな遅延を測る仕様
kota_yata
1
120
Go を使い始めて 2 ヶ月の学び / My first two months with Go
contour_gara
0
340
Claude CodeとAgentCore Gatewayを繋ぐ際の認証認可 / Authentication and authorization when connecting Claude Code with AgentCore Gateway
har1101
2
350
FDEが実現するAI駆動経営の現在地
gonta
2
290
GDG Korea Android: 2026 I/O Extended ~ What's new in Android development tools
pluu
0
230
Android CLI
fornewid
0
230
生成AIで帳票OCRが「簡単に」作れる時代になった?
kon_shou
0
1.1k
これって Effect でできたのでは? / TSKaigi Mashup Kansai #2
susisu
0
250
AI Readyの正体はデータマネジメントだ メダリオン2.0の最前線
freee
PRO
0
340
運用ダッシュボードの設計を誰も教えてくれないのだけどみなさんどうしてるんですか? - チームに監視するという文化を根付かせるための第一歩を踏みたい -
satoshi256kbyte
1
140
「人を評価する AI」の設計と実装
ryoyanara
0
220
Featured
See All Featured
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
500
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
220
Tell your own story through comics
letsgokoyo
1
1k
SEO for Brand Visibility & Recognition
aleyda
0
4.7k
The Spectacular Lies of Maps
axbom
PRO
1
940
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
The Limits of Empathy - UXLibs8
cassininazir
1
610
How to Talk to Developers About Accessibility
jct
2
520
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
220
Agile that works and the tools we love
rasmusluckow
331
22k
Java REST API Framework Comparison - PWX 2021
mraible
34
9.7k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
1k
Transcript
By Sarmad Sangi From Backbone.Views to ReactJs
Problem with backbone views • Nested Backbone.View 's are hard
to maintain (ie lifecycle). • Every time collection changes it re-renders all the views.
Solution ?
What is ReactJs ? • JS Lib for building UI
Components • Virtual DOM for ultra-high performance
Who is using it ? • Facebook (comments, like etc)
• Instagram (Main Page) • Khan Academy (200 components)
React Components React.createClass({ render: function () { return React.DOM.div({}, Everything
is awesome!); } }); OR //jsx lah React.createClass({ render: function () { return <div>Everything is awesome!</div>; } });
React In Action https://github.com/sarmadsangi/backbone_to_reactjs/
React Tips • class -> className • Elements within render
must have parent element • Don't use minified version in development env • Data flows from parent to child • Move component by component, both backbone views and react components can co-exist in one app.
Not satisfied yet? References http://www.quora.com/Pete-Hunt/Posts/React-Convincing-the-Boss http://facebook.github.io/react/docs/thinking-in-react.html http://joelburget.com/backbone-to-react/ Demo Source Code
https://github.com/sarmadsangi/backbone_to_reactjs