AngularJs evolution - from heedless meddler to superheroic assistant Miloš Bošković

FullStack 2016

About me› Lead Frontend Engineer› Used to be Fullstack developer –

Laravel + jQuery/AngularJs› From 2013 moved entirely to

AngularJs

› Work from home from Niš, Serbia

FullStack 2016

› Tool giving you a complete insight into your business

› Startup based in London (but also worldwide) › Started around December 2013 › Around 15 people involved in the project › Backend built on Java Apache Spark and

MongoDB› Frontend built on AngularJs 1.x

FullStack 2016

FullStack 2016

› Superheroic JavaScript MVW Framework

› MVW -> Model-View-Whatever › Created in Google› Started off as a tool for designers

FullStack 2016

Angular Terminology› $scope / $rootScope› $apply› Services› Factories › Providers› Directives

› DDO› Compile› Link› Pre-link

› Post-link› Require› Transclude (?!?)

› Config / Run› Filters› Modules› $broadcast / $emit

FullStack 2016

How do we benchmark frontend frameworks?

FullStack 2016

› With To-do applications!› Frontend framework test

The code

FullStack 2016

Early Angular FullStack 2016

Less early Angular FullStack 2016

Starting to make sense… FullStack 2016

Getting nicer… (v1.5) FullStack 2016

Now we’re talking! (v1.5, ES2015) FullStack 2016

Future’s looking bright! (v2.0) FullStack 2016

Let’s compare... FullStack 2016

Let’s compare... #2 FullStack 2016

Getting back to Angular 2.0 FullStack 2016

Movie vs Real programming

FullStack 2016

You should do the same!

› Find your own “evolution”› Always try to implement something new› Start with ES2015› Refactor your code so that it relies on

directives/components (and in that way get ready for Angular 2)

› Share the knowledge

Conclusions

FullStack 2016

› Angular has come a long way› It has grown, improved – evolved

Useful links

› https://angularjs.org/ › https://angular.io/ (Angular 2.0)› https://github.com/johnpapa/angular-styleguide › http://devchat.tv/adventures-in-angular/ (Angular podcasts) › http://jsfiddle.net/misaizdaleka/U3pVM/26080/ (to-do app)› https://www.destroyallsoftware.com/talks/wat (JS wat, 5-minute

video)› https://www.youtube.com/watch?v=M_Wp-2XA9ZU (AngularJs

wat)› http://hackertyper.com/

FullStack 2016

Thanks!

milos.boskovic@gmail.comfacebook.com/misaizdaleka@misaizdalekaDev

Link to this presentation: http://bit.ly/angular-superassistant