Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
NEW ROUTER ON THE BLOCK Miroslav Jonaš @meeroslav
Slide 2
Slide 2 text
HELLO! I am Miroslav Jonaš @meeroslav
Slide 3
Slide 3 text
History of angular routing angularjs ui-router @angular/router @ngrx/router react-router angular-routing 2010 2013 2014 2016 2017 2020 angular-route ng v2 v4 v11 @meeroslav
Slide 4
Slide 4 text
Brandon Roberts @meeroslav
Slide 5
Slide 5 text
Short history of angular-routing CREATED June 23rd TWEET July 2nd FIRST PR July 13th @meeroslav
Slide 6
Slide 6 text
@meeroslav
Slide 7
Slide 7 text
@meeroslav
Slide 8
Slide 8 text
@meeroslav
Slide 9
Slide 9 text
OK… SO WHAT’S DIFFERENT? Well, glad you asked @meeroslav
Slide 10
Slide 10 text
621kB Entire package 2 Dependencies 18kB UMD/Ivy bundle size * SIZE MATTERS! @meeroslav
Slide 11
Slide 11 text
GUARDS? JUST NGIF-IT @meeroslav
Slide 12
Slide 12 text
INVALID ROUTE ORDER @meeroslav
Slide 13
Slide 13 text
Where we’re going THERE IS NO INVALID ROUTE ORDER @meeroslav
Slide 14
Slide 14 text
RESPONSIVE ROUTING ROUTER R O U T E R @meeroslav
Slide 15
Slide 15 text
RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES @meeroslav
Slide 16
Slide 16 text
IS IT A REPLACEMENT? No, an upgrade! @meeroslav
Slide 17
Slide 17 text
NOW? Depends... @meeroslav
Slide 18
Slide 18 text
IF YOU NEED... › Redirections › Nesting › Lazy loading › Guards › Stream of Params › Auxiliary routes @meeroslav
Slide 19
Slide 19 text
BUT IF YOU NEED... › Complex guards › All params stream › Resolves › Some other config/event magic @meeroslav
Slide 20
Slide 20 text
@meeroslav “Step-by-step” approach
Slide 21
Slide 21 text
“Ask not what Angular can do for you - ask what you can do for Angular” @meeroslav John F. Kennedy
Slide 22
Slide 22 text
THANKS! Any questions? @meeroslav https://github.com/brandonroberts/angular-routing https://recursive-ng-router.netlify.app/ https://responsive-ng-router.netlify.app/ › Presentation template by SlidesCarnival