Tweet
Tweet

Slide 1

Slide 1 text

Mastering Flutter App Navigation: A Deep Dive into Auto Route Ahmedabad

Slide 2

Slide 2 text

Ahmedabad ★ Working as a Flutter Developer at 7Span 💙 ★ Technical content writer at Medium 󰜼 ★ Contributor at StackOverflow 📕 ★ Have worked in Data Science and ML 🤖 ★ Have been a National Basketball Player 🏀 A little bit about me

Slide 3

Slide 3 text

Ahmedabad 1. Understanding different Programming Paradigms 2. Difference between Navigator 1.0 and 2.0 3. What is Auto Route and the need for it 4. Route Guards 5. Nested Navigation 6. Deep Linking Agenda

Slide 4

Slide 4 text

All functions or variables used in this project are imaginary. The errors that come while compiling can be baseless. Do not pay much attention to them or let them affect your life. इस प ्र ोज े क्ट म ें प ्र योग कय े गय े सभी फ ं क्शन या व े रएबल कालप नक ह ै । क ं पाइल करत े समय आन े वाल े एरर ब े -ब ु नयाद हो सकत े ह ैं । उनप े ज्यादा ध्यान ना द े या ना ही उनका असर अपन े जीवन म ें होन े द े

Slide 5

Slide 5 text

Difference between Declarative and Imperative Programming Ahmedabad

Slide 6

Slide 6 text

Ahmedabad Imperative Style Declarative Style

Slide 7

Slide 7 text

Ahmedabad Imperative Style Declarative Style

Slide 8

Slide 8 text

Difference between Navigator 1.0 and Navigator 2.0

Slide 9

Slide 9 text

Ahmedabad Old Times

Slide 10

Slide 10 text

Problems with Navigator 1.0

Slide 11

Slide 11 text

Ahmedabad Web Support

Slide 12

Slide 12 text

Ahmedabad Access of the router stack

Slide 13

Slide 13 text

Ahmedabad OS Events Handling

Slide 14

Slide 14 text

Ahmedabad Other Problems with Navigator 1.0 ● Imperative Style ● Nested Navigation

Slide 15

Slide 15 text

Ahmedabad Conclusion: Navigator 1.0 won’t be able to tackle everything

Slide 16

Slide 16 text

Was Flutter able to solve this issue? No

Slide 17

Slide 17 text

Ahmedabad

Slide 18

Slide 18 text

Features of Auto Route

Slide 19

Slide 19 text

Ahmedabad Complete Web Support ● Doesn’t need any boilerplate to add the web support ● Includes the support for query parameters and path parameters ● Back and Forward button navigation is handled by default

Slide 20

Slide 20 text

Ahmedabad

Slide 21

Slide 21 text

Ahmedabad ● Used as a middleware before moving on some specific route ● Used for custom redirection on specific routes Route Guards

Slide 22

Slide 22 text

Ahmedabad Home Profile Root Screen Home Details Profile Details Effortless Nested Navigation

Slide 23

Slide 23 text

Ahmedabad Deep Linking ● Easy to setup and test ● Supports nested navigation routing with zero to no configuration ● Doesn’t need any extra dependency other than auto_route itself.

Slide 24

Slide 24 text

“The art of Navigation is about having the courage to change the directions”

Slide 25

Slide 25 text

Feel free to reach out, Happy to help 😃

Slide 26

Slide 26 text

Ahmedabad Any Questions?