Flutter

What it is

Imagine writing one recipe and having it cook the same dish in every kitchen, instead of rewriting it for each stove. That is the cross-platform idea: one set of code that runs on many devices. Flutter is Google's open-source UI (User Interface — the on-screen part of the app) toolkit for building cross-platform apps from a single codebase written in the Dart language. Unlike approaches that reuse the device's own on-screen controls, Flutter draws every pixel itself with its own rendering engine, so the UI looks and behaves identically across iOS, Android, web, and desktop. It ships with a rich set of Material and Cupertino widgets out of the box.

Strengths

• One Dart codebase targets iOS, Android, web, and desktop with consistent results.
• Its own rendering engine means pixel-perfect, identical UI everywhere.
• Like editing a document and seeing the change appear instantly without reopening the file, Stateful Hot Reload shows code changes in the running app right away, so iteration is extremely fast.
• A large, polished widget library and strong tooling.
• Excellent for custom, brand-heavy, animation-rich interfaces.

Trade-offs

• Requires learning Dart, a language used almost exclusively for Flutter.
• App binaries are larger because the engine ships with the app.
• Drawing its own widgets means platform-native look-and-feel updates can lag.
• Deep platform integrations still need native (Swift/Kotlin) code via plugins.

When to use it

Reach for Flutter when you want a single team to ship a highly polished, visually consistent app across many platforms — especially when custom design and smooth animation matter more than matching each OS's (Operating System's — the device's core software, like iOS or Android) exact native widgets.

Vibe coding fit

Flutter pairs well with AI assistants because everything is a widget composed in a clear tree, and Hot Reload lets you verify generated UI in seconds. Ask the model to break the tree into small, focused widgets, to keep state management explicit (e.g. a single state class or a well-known package), and to prefer const constructors for performance. Because the framework is self-contained, generated code rarely depends on fragile native setup.

class Counter extends StatefulWidget {
  @override
  State<Counter> createState() => _CounterState();
}

class _CounterState extends State<Counter> {
  int count = 0;
  @override
  Widget build(BuildContext context) => Column(children: [
        Text('Count: $count'),
        ElevatedButton(
          onPressed: () => setState(() => count++),
          child: const Text('Add'),
        ),
      ]);
}