How do you show loading, success, and error for a network request?

Short answer

Represent the request state explicitly instead of a single boolean, and show an appropriate UI for each of loading, data, and error with a clear retry option.

Explanation

FutureBuilder makes it easy to connect a Future to the UI, but create the Future outside build so the request does not start again with every rebuild. Move orchestration to a controller when requests multiply or you need caching.

Common mistakes

• Creating the Future inside build.
• Hiding the error behind a generic message with no logging or retry.

Follow-up questions

• Why do we convert JSON to typed models through serialization?

Sources

• Flutter API — FutureBuilder