A nice article on exactly what is a Flutter Widget

The notion of widgets in development have been around for a long time, tracing back at least 20 years to components in Portal CMS systems.  But some of these older widget systems still inherited a lot of visual context from the underlying OS.  A nice article at flutterbyexample.com clarifies the situation with Flutter nicely, which may be the first pure “Widget Centric Development” system pushed by a giant like Google.  My personal favorite excerpt is:

Thinking in Widgets:

In Flutter, everything is a widget. Widgets are just tiny chunks of UI that you can combine to make a complete app. Building an app Flutter is like building a lego set — piece by piece.

Widgets are nested inside of eachother to build your app. Even the root of your app is just a widget. It’s widgets all the way down.

Flutter is unique in that every aspect of UI is handled with Widgets.

A widget might display something, it might help define design, it might help with layout, or it may handle interaction. I really can’t exclaim this enough: everything is a widget

  • A simple widget that displays text: const Text('Hello World').
  • A simple widget that a user interacts with const Button(onTap: ...callback...)
  • A simple widget that adds a background color: const BoxDecoration(background: Colors.blue)

Basically, imagine that your CSS, HTML, and JavaScript are all handled by widgets. There is no markup language. There is no CSS. Just widgets.

Yep, for better or worse logic and presentation are remashed together.  So far I have found this very productive … with a few pain points.

Read it all at: https://flutterbyexample.com/flutter-widgets/