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
Sarmad Sangi
April 28, 2014
Programming
1
250
From Backbone.Views To ReactJs
Sarmad Sangi
April 28, 2014
Tweet
Share
More Decks by Sarmad Sangi
See All by Sarmad Sangi
Git Flow
sarmadsangi
0
110
Other Decks in Programming
See All in Programming
One Enishi After Another
snoozer05
PRO
0
150
フロントエンド開発のためのブラウザ組み込みAI入門
masashi
7
3.4k
20251016_Rails News ~Rails 8.1の足音を聴く~
morimorihoge
2
670
iOSでSVG画像を扱う
kishikawakatsumi
0
160
モテるデスク環境
mozumasu
3
1.1k
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
3.4k
When Dependencies Fail: Building Antifragile Applications in a Fragile World
selcukusta
0
110
SODA - FACT BOOK(JP)
sodainc
1
8.6k
Reactive Thinking with Signals and the Resource API
manfredsteyer
PRO
0
100
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
190
タスクの特性や不確実性に応じた最適な作業スタイルの選択(ペアプロ・モブプロ・ソロプロ)と実践 / Optimal Work Style Selection: Pair, Mob, or Solo Programming.
honyanya
3
190
AIと人間の共創開発!OSSで試行錯誤した開発スタイル
mae616
2
780
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
303
21k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Facilitating Awesome Meetings
lara
57
6.6k
For a Future-Friendly Web
brad_frost
180
10k
Fireside Chat
paigeccino
40
3.7k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.9k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Reflections from 52 weeks, 52 projects
jeffersonlam
353
21k
Java REST API Framework Comparison - PWX 2021
mraible
34
8.9k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.5k
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
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