LESSON 02 OF 03 · WRITTEN GUIDE
Build one complete interaction
A working interaction includes what happens before, during, and after an action. A beautiful Save button that does nothing is not a complete feature. Define input validation, success, and error behavior before adding motion or extra screens.
Make it practical
Build the add-book interaction. Require a title, show a useful message if it is missing, and display the saved item. If you use browser storage, clearly state that the reading list stays on this device.
TRY THIS PROMPT
Implement only the add-book interaction. Use a labeled title field and an optional note. Reject whitespace-only titles. Render user text safely. Explain how the data is stored and what happens after a reload.
Check your work
Try an empty title, a very long title, punctuation, and a second item. Check the behavior using only a keyboard. Does the result match the stated storage behavior?
Use the output as a draft. Compare it with the brief, inspect the work, and keep the decisions you can explain.