Battle of the Frameworks

JavaScript frameworks are like weeds. New frameworks pop up at an unprecedented speed. Front-end developers nowadays find it hard to keep up with the latest technologies.

I will share what I have learned from writing the same app with three of the most popular JavaScript frameworks: React, Angular, and Vue. Furthermore, I will compare the concepts behind these frameworks and their ecosystems. And finally, I will give front-end developers tips on how to retain their sanity when faced with choosing a JavaScript framework.

Presented at enterJS 2018.

Transcript

1. A N G U L A R , R E A C T O R V U E ? B AT T L E O F T H E FRAMEWORKS 2 0 - 0 6 - 2 0 1 8 L O R A VA R D A R O VA
2. ZALANDO AT A GLANCE as at March 2018 ~ 4.5 BILLION EUR revenue 2017 > 75% of visits via 
 mobile devices > 200 million visits per month > 23 million active customers > 300,000 product choices > 15,000 employees in 
 Europe 15 countries ~ 2,000 brands
3. WE ARE CONSTANTLY INNOVATING TECHNOLOGY HOME-BREWED, CUTTING-EDGE, SCALABLE technology solutions 7tech locations
 (HQs in Berlin) ~ 2,000 employees from 77 nations help our brands to 
 WIN ONLINE
4. History Lesson Frameworks Comparison Lessons Learned Questions Worth Asking Zalando Tech Radar Wrap-up A G E N D A @LoraVardarova
5. H I S TO RY L E S S O N @LoraVardarova
6. 2 0 0 9 - 2 0 1 8 H I S TO RY L E S S O N 2 0 0 9 2 0 1 3 2 0 1 4 React was open-sourced at JSConf US Vue was released 2 0 1 6 2 0 1 8 Angular 2 was released 2 0 11 AngularJS v1.0 was released @LoraVardarova
7. FRAMEWORKS C O M PA R I S O N @LoraVardarova
8. K E Y C O N C E P T S • Virtual DOM • Components • JSX R E A C T @LoraVardarova
9. K E Y C O N C E P T S • Components • Dependancy injection • Bindings A N G U L A R @LoraVardarova
10. K E Y C O N C E P T S • Virtual DOM • Data-driven view • Single-file components V U E @LoraVardarova
11. FRAMEWORKS COMPARISON REACT ANGULAR VUE BOOTSTRAP create-react-app angular-cli vue-cli ROUTER react-router angular-route vue-router STATE MANAGEMENT Redux Redux/ngrx Vuex SERVER RENDERED APP Next Angular Universal Nuxt MOBILE React Native NativeScript Weex / NativeScript ECO SY STE M S @LoraVardarova
12. LESSONS LEARNED @LoraVardarova
13. !X TODO APP IS TOO SIMPLE Insert footnote @LoraVardarova
14. @LoraVardarova A LT E R N AT I V E S
15. !X D O C U M E N TAT I O N I S I M P O R TA N T Insert footnote @LoraVardarova
16. !X C O M M U N I T Y I S I M P O R TA N T Insert footnote @LoraVardarova
17. QUESTIONS WORTH A S K I N G @LoraVardarova
18. !X H O W H I G H I S T H E B U S FA C TO R ? Insert footnote @LoraVardarova
19. !X WHAT DOES THE PRODUCT ROADMAP LOOK LIKE? Insert footnote @LoraVardarova
20. ZALANDO TECH RADAR @LoraVardarova
21. !X OPENSOURCE.ZALANDO.COM/TECH-RADAR Insert footnote
22. opensource.zalando.com/tech-radar ZALANDO TECH RADAR
23. WRAP-UP @LoraVardarova
24. !X THERE ISN’T A BEST FRAMEWORK @LoraVardarova
25. S ET A D EA DLI NE R E D U C E T H E B U S FA C TO R K N O W Y O U R P R O D U C T Don’t enter the decision trap Have the product roadmap in mind Know your community TA K EAWAYS @LoraVardarova
26. !X D O N O T A S K W H AT T H E B E S T F R A M E W O R K I S , A S K W H AT T H E M O S T SUITA B LE FRAMEWORK FOR YOUR PRODUCT AND YOUR TEAM IS @LoraVardarova
27. @LoraVardarova LORA VARDAROVA Zalando Loyalty Frontend Software Engineer 2 0 - 0 6 - 2 0 1 8