Build a feature. Keep it yours.
A feature owns a useful slice of your product: its routes, state, UI, and contributions. Package it once, evolve it independently, and bring it into the apps that need it.
Design feature boundariesModular framework
to grow your Flutter app.
Build your product one feature at a time. Keep each feature independent, give it the capabilities it needs through plugins, and compose the pieces into apps that can keep growing.
Capabilities → features → your app.
FlutterDart
03AppsCompose a product
Customer appTeam app
Different experiences. The features each app needs.
02FeaturesOwn a slice of your product
CatalogAccountCheckout
Routes, state, UI, and contributions in portable packages.
01PluginsShare capabilities
LoggingTelemetryStorageNetwork
One capability can support many features.
Small boundaries.
Room to grow.
As your product grows, features give teams a place to build independently. Plugins give those features a common foundation. Your app brings them together.
Share capabilities across features
Set up logging, telemetry, storage, networking, and authentication through plugins. Multiple features use the same contracts, while each app chooses the implementations.
Understand pluginsTake your features to the next app
Compose a customer app from catalog, account, and checkout. Reuse the catalog feature in a team app with a different set of companions. Declare dependencies so each feature brings the capabilities it needs.
Understand compositionStart with Flutter.
Add what you need.
Begin with a familiar Flutter screen and a feature descriptor. Add another feature when your product needs it, then connect shared capabilities through plugins.
Follow the complete setuplib/main.dart
dart
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:vyuh_core/vyuh_core.dart' as vyuh;
void main() {
vyuh.runApp(
initialLocation: '/',
features: () => [
vyuh.FeatureDescriptor(
name: 'hello',
title: 'Hello',
routes: () => [
GoRoute(
path: '/',
builder: (_, _) => const Scaffold(
body: Center(child: Text('Hello, Vyuh.')),
),
),
],
),
],
);
}