D
NetworkingMedium30 XP4 min read

How do you use GraphQL in a Flutter app?

TL;DR: Use the graphql_flutter or ferry package. graphql_flutter provides Query/Mutation/Subscription widgets. Ferry generates typed Dart classes from .graphql files via build_runner, eliminating manual JSON mapping.

Full Answer

Aspectgraphql_flutterFerry
Code genNone — manual type castingFull: types from .graphql files
SetupQuick — just add packageSlower — needs build_runner
Type safetyLow — dynamic mapsHigh — generated classes
CachingIn-memory InMemoryStoreNormalized store with Hive
Best forPrototypes, small appsProduction, large schemas
🎯

Ferry's generated classes mean a schema change causes a compile error — not a runtime crash. This is the key advantage over REST + manual JSON.

Code Examples

dartgraphql_flutter query widget
Output
// Query executes on mount, shows loading -> result
// refetch() re-runs the query (pull-to-refresh)

Common Mistakes

  • Not normalizing the cache — same data fetched in two queries won't stay in sync
  • Using subscriptions without a WebSocket link — GraphQL subscriptions require WSLink, not HttpLink

Interview Tip

💡

Most Flutter apps at scale use REST. Show you know GraphQL but can articulate when it's worth the added complexity: apps with complex data graphs, many entity types, or mobile bandwidth constraints.

#graphql#ferry#graphql-flutter#query#mutation