Transition from Angular to Flutter

The Frontend ecosystem is growing rapidly nowadays. As a frontend developer, the ability to switch between frameworks is essential. In this post, I will share my experiences when I transitioned from Angular to Flutter

Recently, I have contributed to a Flutter project. Unfortunately, I have never worked with Flutter; my expertise is Angular and web development. After one year of discovering Flutter and delivering some successful features, I realize it doesn’t matter which framework you are using; fundamentals and mindset are the most important.

Comparison

Both belong to the frontend land, powered and maintained by Google. Below, we list out some differences:

• Angular
  • Language base: Typescript
  • Platform: Web (Browsers)
  • UI Rendering: Html, Css, and the Browser’s DOM
• Flutter
  • Language base: Dart
  • Platform: Cross-platform (Android/Ios/Desktop/Web)
  • UI Rendering: Renders its own widgets using the Skia Graphics Engine,

Technique

Below, we list out the primary technique we have used for each one

• Angular
  • State management: Ngrx
  • UI library: Angular Material
• Flutter
  • State management: Getx
  • Ui library: Material

Transition mindset (Angular → Flutter)

Although they run on different platforms, they are the same ideal. When the user takes action, we update our ui to reflect the user’s action. Each one provides its own way to handle it. Let's go through side by side

• Component - Widget

Component in Angular

Widget in Flutter

We have a comparison table below:

Part	Angular	Flutter
controller	feature.component.ts	feature_controller.dart
view	feature.component.css	feature_page.dart
module	feature.module.ts	feature_bindings.dart

• Dependency injection

Angular	Flutter
Built in dependency system	GetX provide solution

• Routing

Angular	Flutter
Built in Route management	GetX provide solution

• Reactive programming

Angular	Flutter
RxJs	RxDart

Above, we compare some main key differences. Technically, each one uses its own technique, but the ideal is the same. Solid fundamentals help us move and adapt faster!

Conclusion

Above, I share my experiences in transiting from Angular to Flutter. To build a robust mobile app as well as a web application, many things have to be done. Technique can be changed, but our mindset remains the same; core fundamentals are “key” to help us transition faster!