Embed Size (px)
Citation preview
THE FRONT-END JUNGLE
Adam Klein
React vs. Angular
ONCE UPON A TIME
<1995
1997-2010
2010 - Adam Learns Web
2010-2015
Google trends - world wide2011-2015
Google trends - Israel2011-2015
SPASingle Page Application
I’m going to be an Angular Expert!!
AngularJSGoogle
Initial release - 2010
Currently version 1.5
HTML based<body> <h1>Hi {{ name }}</h1> <my-grid data="data"></my-grid> </body>
2 way data binding
Digest Cycle
[DELETE THIS]: Use this slide for strong messages. It’s not a chapter name
AngularJSWrite normal HTML
2 way data binding
Much built-in: forms, http, Dependency injection
Custom tags & attributes for reusability
Magical change detection
Harder component composition
Extensive adoption in Israel
ReactJSFacebook
2013
Current version v15
JSX & virtual DOM<div> <h1>Hi { this.name }</h1> <MyGrid data={this.data}></MyGrid> </div>
Component based
Explicit change detection
ReactJScomponent architecture
component lifecycle
just the view, nothing else built in
one way data binding
explicit change detection, customisable
decoupled from DOM (mobile, server)
no magic
early adoption in Israel
Bothgreat eco-system & community
much open source
no state management (flux)
2016
Angular 2
https://youtu.be/gNmWybAyBHI?t=607https://youtu.be/gNmWybAyBHI?t=548
https://youtu.be/gNmWybAyBHI?t=724
Late 2014 announcements
https://youtu.be/gNmWybAyBHI?t=984
Angular 2 here we go!!
2.0
Angular 228 google developers
September 2014 announcement
May 2016 RC
Angular 1 is continuing
Huge cooperations and idea sharing (React, Ember, Microsoft)
Development platform - i18n, http, DI, forms, router, lazy loading
Component based
Improved change detection
Using Web Component standard
Typescript
Decoupled from DOM (mobile NativeScript, server, testing, web workers)
Removed old browser support
Angular 2Hardly any open source
Hardly any Stack Overflow
API changes
Not in production
Existing Angular 1.5 - Migration pathUse a component based architecture
Use angular 1.5 components
Use TypeScript
Use the new router (when it works well)
Wait for Angular2 to be production & stable
New appsAngular React
All in one View only
Typescript ES6
Object Oriented Functional Programming
HTML Templates JSX
Conferencesreact-next.com - September
angular conference - November
Courses react.courses.500tech.com
angular2.courses.500tech.com
Learn more:
http://blog.500tech.comhttp://meetup.com/angularjs-il
http://meetup.com/reactjs-israel
0527475633
![BSc [Hons] Creative Computing React vs Angularshowcase.iadt.ie/assets/MM4/Poster/N00145647_Poster.pdf · React vs Angular Jullian BSc [Hons] Creative Computing Engracio A performance](https://img.pdfslide.us/doc/110x75/5ee109c9ad6a402d666c10bb/bsc-hons-creative-computing-react-vs-react-vs-angular-jullian-bsc-hons-creative.jpg)
