Mastering Flutter App Navigation: A Deep Dive into Auto Route

This session was presented at DevFest Ahmedabad 2023.

In this session, I covered the following topics:

- The key difference between Navigator 1.0 and 2.0
- Need of Navigator 2.0 and why should you upgrade to Navigator 2.0
- How can we use Auto Route to simplify navigation using Navigator 2.0
- Advanced functionalities of the Auto route like Route Guards, Declarative routing, Nested Navigation

Transcript

1. Mastering Flutter App Navigation: A Deep Dive into Auto Route Ahmedabad
2. 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
3. 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
4. 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. इस प ्र ोज े क्ट म ें प ्र योग कय े गय े सभी फ ं क्शन या व े रएबल कालप नक ह ै । क ं पाइल करत े समय आन े वाल े एरर ब े -ब ु नयाद हो सकत े ह ैं । उनप े ज्यादा ध्यान ना द े या ना ही उनका असर अपन े जीवन म ें होन े द े
5. Difference between Declarative and Imperative Programming Ahmedabad
6. Ahmedabad Imperative Style Declarative Style
7. Ahmedabad Imperative Style Declarative Style
8. Difference between Navigator 1.0 and Navigator 2.0
9. Ahmedabad Old Times
10. Problems with Navigator 1.0
11. Ahmedabad Web Support
12. Ahmedabad Access of the router stack
13. Ahmedabad OS Events Handling
14. Ahmedabad Other Problems with Navigator 1.0 • Imperative Style • Nested Navigation
15. Ahmedabad Conclusion: Navigator 1.0 won’t be able to tackle everything
16. Was Flutter able to solve this issue? No
17. Ahmedabad
18. Features of Auto Route
19. 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
20. Ahmedabad
21. Ahmedabad • Used as a middleware before moving on some specific route • Used for custom redirection on specific routes Route Guards
22. Ahmedabad Home Profile Root Screen Home Details Profile Details Effortless Nested Navigation
23. 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.
24. “The art of Navigation is about having the courage to change the directions”
25. Feel free to reach out, Happy to help 😃
26. Ahmedabad Any Questions?