Loading, error and empty are three different states
Distinguishing loading, error and empty, and making each one demonstrable.
12 min read
The acceptance criterion is data fetching with loading, error and empty states, all three demonstrable.
The three states are distinct. A list that is still loading, a list whose request failed, and a list that returned no results call for different screens. Presenting them identically leaves the user unable to tell which has occurred.
Zero and unmeasured differ. A figure showing zero because nothing has been recorded is not the same as one showing zero because a measurement returned nothing. Where the interface cannot distinguish the two, it will eventually state something incorrect with full confidence.
Error messages. State what failed and what the user can do next. Where retrying will not help, say so.
Demonstrability. A reviewer must be able to reach all three states without editing your code. Provide a query parameter, a mock switch or documented network throttling, and list the steps in the README.
Submission. A repository and a README section giving the exact steps to reach each state.
Go deeper
Lessons are not assessed. Progress towards the certificate is recorded from the work you submit. See all requirements