Roadmap to Flutter Development

What is Flutter?

It is an open-source mobile SDK (Software Development Kit) which helps in developing applications for iOS, Android, Web, Desktop using a single codebase. Development of applications using Flutter will be a bit faster and easy.  

Also, using one time code, you can make beautiful applications in varied technologies such as iOS,  Android, etc. 

Why Flutter?

• Fast development experience 
• Heavily optimized 
• Rich set of widgets 
• Reduces cost and complexity of app production across platforms 
• Single codebase to rule them all 
• Simple and easy to learn and use 
• Hot Reload/ Hot Restart feature makes it very easy to design 

Tech stack required for Flutter:

C | C++ | DART | SKIA (2-D RENDERING ENGINE) 

Note: In order to design a UI very quickly, you can learn how to use Flutter Flow.

Roadmap:

Step 1 : Know a programming language and OOPS concept

Before proceeding with development, try to go through the OOPS Concept first. Brush up the concepts once and then start with a programming language.  

Flutter actually uses DART, so try to be thorough with it. Be clear with the basic dart concepts. 

Step 2 : Understand the IDE

Get an idea of how the IDE works. Go through the interface, get an overview of the shortcut commands as  well. 

Step 3 : Start off with the very basic concepts

Get along with the variety of widgets such as Stateful and Stateless, Accessibility, Async, Cupertino, Containers, Rows, Columns, Scaffold. Other concepts will include Lists, Map, Lambda function, Aspect Ratio, Alignment, Cards, Sized Box. Understand about the Styles and Assets as well. 

Step 4 : Try static UI then

Try creating a static UI first. Make use of text, image, button, raised buttons, containers, rows, columns,  constrained box, elevated button, etc.

Step 5 : Start with Dynamic UI

Continue with creating dynamic UI after you understand how to create a static UI. Concepts include List View, Grid View, Expanded class, Slivers. 

Step 6 : Know the animations 

The animations are a very important aspect of UI such as Curved Animation, Animation Controller, Tween, Animated Widgets, Animated Builder, Implicit animations, Hero animations. 

Step 7 : Know about memory and storage management 

Learn about the File System, Shared Preferences, how states actually work, SQLite. 

Step 8 : Know 3rd party libraries and state management

There are multiple third party libraries that one should know about such as font_awesome, http, dio, get_it, cached_network_image, SQFLite, RxDart, bloc_pattern, flutter_webview_plugin. The State Management includes Provider, setState, BLoC, Redux, etc. 

Step 9 : Understand the version control 

Version Control is basically for tracking and managing changes to the software code. Through this, a developer will be able to trace out the changes that have been done to the code. 

So for this, get familiar with any one of these – Git, Github, bitbucket, GitLab.  

Also, if possible try to get your hands on any one of these using Terminal or Source Tree. Though Source Tree is easy to use, one should know Terminal commands as well.

Step 10 : Try to work with Native Integration

After learning Flutter, try once with native integration so that one can get an idea like how the actual android, iOS, desktop apps work and how they will be uploaded on their respective platforms such as App Store and Play Store. 

For this, you can go through different programming languages such as Java, Kotlin, Swift, Objective C, and different IDE’s such as Xcode, Android Studio. 

Also, get an idea of iOS Profiles, Certifications, App Signing. 

Apart from these, Learn Project Structures as well. There are certain predefined architectures such as MVVM, MVC, MVP, etc. 

Note: This roadmap has been created keeping in mind a person who is learning from scratch. If you find another roadmap easier to follow, don’t hesitate from trying that out!