$30 off During Our Annual Pro Sale. View Details »
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
260
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
大規模Cloud Native環境におけるFalcoの運用
owlinux1000
0
190
Navigation 3: 적응형 UI를 위한 앱 탐색
fornewid
1
440
開発に寄りそう自動テストの実現
goyoki
2
1.4k
生成AI時代を勝ち抜くエンジニア組織マネジメント
coconala_engineer
0
530
Pythonではじめるオープンデータ分析〜書籍の紹介と書籍で紹介しきれなかった事例の紹介〜
welliving
2
530
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
cer
PRO
0
390
Context is King? 〜Verifiability時代とコンテキスト設計 / Beyond "Context is King"
rkaga
10
1.4k
Patterns of Patterns
denyspoltorak
0
260
Giselleで作るAI QAアシスタント 〜 Pull Requestレビューに継続的QAを
codenote
0
270
[AtCoder Conference 2025] LLMを使った業務AHCの上⼿な解き⽅
terryu16
3
610
C-Shared Buildで突破するAI Agent バックテストの壁
po3rin
0
410
AIエンジニアリングのご紹介 / Introduction to AI Engineering
rkaga
8
3.3k
Featured
See All Featured
Embracing the Ebb and Flow
colly
88
4.9k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5k
Being A Developer After 40
akosma
91
590k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
15
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
1
200
Designing for Timeless Needs
cassininazir
0
92
Color Theory Basics | Prateek | Gurzu
gurzu
0
150
The SEO identity crisis: Don't let AI make you average
varn
0
35
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
99
Building Applications with DynamoDB
mza
96
6.8k
Bash Introduction
62gerente
615
210k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
190
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