beginner app-building tip: plan what the screen shows when there is nothing to show yet.
a list of notes needs more than a design filled with perfect sample notes.
try writing these four states in plain language before styling the page.
The app is still fetching the notes. Say "Loading your notes..." so an empty area doesn't look like lost work.
The request worked, but this person has no notes yet. Say "Your first note starts here" and offer a clear "Create a note" button.
The request failed. Say "We couldn't load your notes" and offer a way to try again. Don't tell someone their collection is empty when you haven't been able to load it.
The notes arrived. Show the list and the action people came to take, such as opening or creating a note.
You can sketch all four screens on paper. No library choice needed for that decision.
When you implement them, make the situations distinguishable in your code. An empty array alone can't explain whether a request is still running, failed, or returned zero notes.
Try each path deliberately in your development setup. Slow down a request. Return an empty result. Simulate a failed request. Then load a few notes.
Ask one question each time: would a new user understand what happened and what they can do next?
A small screen becomes much easier to trust when it explains the awkward moments too.