riverpod-codegen-and-hooks
Riverpod — Code generation and hooks
Code generation
Code generation is optional in Riverpod. It changes the syntax for defining providers: you write an annotated function or class and the generator produces the provider. Use it if you already use code generation (e.g. Freezed, json_serializable); otherwise the extra build step may not be worth it. See riverpod-getting-started for setup (build_runner, riverpod_generator).
Benefits
- Clearer syntax: no manual provider type (Provider vs FutureProvider etc.); Riverpod infers it.
- Parameters: any parameters (named, optional, defaults) instead of a single family parameter.
- Stateful hot-reload for Riverpod code.
- Better debugging via generated metadata.
Syntax
Functional provider (sync):
String example(Ref ref) {
return 'foo';
}
Class-based provider (sync, with methods for side effects):
class Example extends _$Example {
String build() => 'foo';
// Add methods to mutate state
}
Async: Use Future/FutureOr/Stream; async functions get AsyncValue and loading/error handling automatically. Auto-dispose: On by default with codegen. Disable with @Riverpod(keepAlive: true).
String example1(Ref ref) => 'foo';
(keepAlive: true)
String example2(Ref ref) => 'foo';
Parameters: Add parameters to the function (consistent == required):
Future<User> fetchUser(Ref ref, {required int userId}) async {
final json = await http.get('api/user/$userId');
return User.fromJson(json);
}
Manual equivalent would be FutureProvider.autoDispose.family<User, int>(...). See riverpod-providers and riverpod-family for concepts.
Hooks
Hooks come from [flutter_hooks] (separate from Riverpod). They are for local widget state (e.g. TextEditingController, AnimationController) and can replace StatefulWidget or builder nesting. Use them only if you want hooks; they are not required for Riverpod. Newcomers should avoid hooks at first.
Using hooks and Riverpod together
You need both flutter_hooks and hooks_riverpod. Then either:
Option 1: HookConsumerWidget — One base class that supports both hooks and ref:
class Example extends HookConsumerWidget {
Widget build(BuildContext context, WidgetRef ref) {
final counter = useState(0);
final value = ref.watch(myProvider);
return Text('Hello $counter $value');
}
}
Option 2: HookConsumer — Builder that combines HookBuilder + Consumer (works with flutter_riverpod only if you nest them; hooks_riverpod provides HookConsumer):
return HookConsumer(
builder: (context, ref, child) {
final counter = useState(0);
final value = ref.watch(myProvider);
return Text('Hello $counter $value');
},
);
Option 3: Nest Consumer and HookBuilder (no hooks_riverpod needed).
Rules of hooks
- Use hooks only in the build method of a widget that extends HookWidget (or HookConsumerWidget).
- Do not use hooks conditionally or in loops; call order must be stable.
See riverpod-consumers for Ref in widgets and the official docs for full codegen/hooks details.
More from serverpod/skills-registry
riverpod-providers
Declare and use Riverpod providers (Provider, FutureProvider, StreamProvider, NotifierProvider, AsyncNotifierProvider, StreamNotifierProvider); unmodifiable vs modifiable, top-level declaration, Ref, Notifier build method. Use when creating providers, choosing provider type, writing Notifier classes, or understanding Riverpod state. Use this skill whenever the user asks about Riverpod providers, provider types, or notifiers.
25riverpod-consumers
Use Riverpod Consumer, ConsumerWidget, and ConsumerStatefulWidget to read and watch providers in widgets; WidgetRef, builder ref parameter. Use when building widgets that need to access Riverpod providers, ref.watch or ref.read in the UI, or converting StatelessWidget to ConsumerWidget. Prefer this skill when the user asks how to use providers in Flutter widgets or why ConsumerWidget is required.
20riverpod-getting-started
Install Riverpod (flutter_riverpod or riverpod), wrap the app in ProviderScope, run a hello-world provider, and optionally enable riverpod_lint and code generation. Use when starting a Flutter or Dart project with Riverpod, adding the Riverpod dependency, or setting up ProviderScope and a first provider. For version highlights see the official Riverpod docs.
19riverpod-auto-dispose
Enable automatic disposal of Riverpod providers when they have no listeners; keepAlive, onDispose, invalidate, ref.keepAlive. Use when preventing memory leaks, caching only while used, or cleaning up resources when a provider is no longer needed. Use this skill when the user asks about auto-dispose, keepAlive, or when to dispose Riverpod state.
18riverpod-refs
Use Ref and WidgetRef to read, watch, listen, invalidate, and refresh providers; onDispose and onCancel lifecycle; ref.read vs ref.watch vs ref.listen, ref.invalidate and ref.refresh. Use when interacting with Riverpod providers from widgets or other providers, when to use watch vs read, or when resetting provider state. Use this skill whenever the user asks about ref.watch, ref.read, ref.listen, ref.invalidate, or Riverpod lifecycle.
17riverpod-pull-to-refresh
Implement pull-to-refresh with Riverpod using RefreshIndicator and ref.refresh; show spinner on initial load, show previous data during refresh, AsyncValue pattern matching. Use when the user asks about pull-to-refresh, RefreshIndicator with Riverpod, or refreshing async providers.
17