It was fairly easy to reuse my add book request handler logic for the edit handler since it both uses the same data of author id, title, pub year, and genre. I had to use app.put for a specific book id instead of posting the book. I added editingId so that it would know which book to change up. I use separate states for editing to make it different and be able to use it for the MUI.

I wrote delete endpoints before this homework so from what I remember it was sort of simple. For edit, it was pretty simple to just update the book and compare it between what was received and expected.

I created another column called Entry Modification with two buttons within it, one for Edit and one for Deleting. Once clicked on edit, it pops up a menu to edit the entry. For clicking on delete, it prompts you if you want to delete before deleting.

I chose this design because I think it is intuitive and you know exactly which entry row you are deleting or editing based on each row.

I had to add new states for edit and delete, and had to show new messages of what error was and that it updated successfully. That was annoying to do. There wasn’t anything too particularly difficult.

I think that it definitely looks better than what I have created before without the UI. It feels much more clean and spaced out nicely. It feels more organized and well balanced between each element.

It was somewhat difficult to refactor my existing UI to use Material UI. I had to use chatgpt to help me with using Material UI and help changing the ui styling.