Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Angular vs React

67 views

Published on

Angular vs React Presentation

- Lunch and learn presentation for Hubba
- Talks about future and legacy of front-end application development
- Compares angular to react
- Live demo

GitHub Presentation Link: https://github.com/xphong/angular-react-presentation
Blog Post: http://www.phonghuynh.ca/angular-vs-react/

Demo Links:
marvel-api: https://github.com/xphong/marvel-powerlevels-api
marvel-angular2: https://github.com/xphong/marvel-angular2 marvel-react: https://github.com/xphong/marvel-react

Published in: Technology
  • Be the first to comment

Angular vs React

  1. 1. ANGULAR 2 VS. REACT
  2. 2. PHONG HUYNH
  3. 3. AGENDA 1. Legacy/Future 2. Comparisons 3. Live Demo
  4. 4. Hard to reuse across projects and teams Coupled architecture State issues Difficult to debug Eventually outdated LEGACY FRONT-END
  5. 5. Re-use of components (DRY, SRP) Decoupled architecture Faster Development Uni-directional flow New application architectures PRESENT FRONT-END
  6. 6. WHY ANGULAR AND REACT
  7. 7. ANGULAR JavaScript Framework TypeScript Final release in 2016 Google REACT JavaScript library JavaScript w/ JSX Released in 2013 Facebook OVERVIEW
  8. 8. Framework Steeper learning curve Opionated Growing community Library Easy to learn, difficult ecosystem More autonomy Active/strong community MAIN DIFFERENCES
  9. 9. CODE DIFFERENCES <ul> <li *ngfor="let character of characters"> {{character.name}} </li> </ul> <ul> { characters.map(character => <li key="{character.id}">{character.name}</li> )} </ul>
  10. 10. MORE CODE EXAMPLES (click)="handleSearch()" onClick={this.handleSearch.bind(this)}
  11. 11. LIVE DEMO
  12. 12. AND THE WINNER OF THE JAVASCRIPT FRAMEWORK WARS IS... ANGULAR.
  13. 13. THE END
  14. 14. LINKS marvel-api: marvel-angular2: marvel-react: https://github.com/xphong/marvel- powerlevels-api https://github.com/xphong/marvel-angular2 https://github.com/xphong/marvel- react

×