0
showcase
Shipped: Personal reading list
I built a personal reading list where you can add books (title, optional author) and remove them. It’s saved in the browser’s localStorage, so it persists across reloads and restarts, and it needs no account or server for the reviewer to use. The store is wrapped in an async API, so the app handles waiting and failure as it would with a network backend.
How to check each criterion: open the “For reviewers: see each state” panel at the bottom of the page. Each link reloads with a setting in the address, so no code changes are needed. The README lists them too.
Loading: ?delay=4000. You see “Loading your reading list…”, a spinner and grey placeholder rows, and the form is disabled.
Error: ?fail=load. A red panel with an icon names what failed and what to do, with a Try again button (which then succeeds). ?fail=save shows the error for a failed add or remove, naming the book and confirming the list is unchanged.
Empty: ?reset, or any first visit. A dashed panel explains what the list is for and offers an “Add your first book” button.
Each state differs in its text, colour, icon and available actions, so none can be mistaken for another; in particular, an error is never shown as “no books”.
Repository: https://github.com/TechnicalSamia18/practise-task-reading-list
Built for the Verified Frontend Internship · state and data
Add a comment
0/2000