Node / Backend
Changes made
I made several updates to the backend while implementing the frontend, including restructuring the API routes and adding additional query options to the GET books endpoints.
Specifically, I changed the endpoints from /books and /authors to /api/books and /api/authors.
This change was made to clearly separate backend API routes from potential frontend routes, improve maintainability, and follow common REST API design conventions.
Validation
I relied primarily on server-side validation using Zod to ensure required fields were filled, IDs were unique, and data types matched expectations.
Client-side validation could have improved the user experience by providing immediate feedback, but server-side validation was essential to guarantee data integrity.
Reflection
If I could go back to HW1, I would have used the /api prefix from the start.
While the change itself was small, making it earlier would have avoided minor refactoring
when connecting the front end to the backend.
React / Frontend
Experience
Using React made building interactive UIs much easier than manually manipulating the DOM in plain JavaScript. Managing state with useState and side effects with useEffect
helped keep the UI in sync automatically. I struggled a bit with handling multiple form states and asynchronous API calls at first, but organizing state carefully helped solve these issues.
Comparison to plain JS
Compared to writing plain JavaScript DOM manipulation code in CS375, React felt much more structured, less error-prone, and easier to maintain.
In plain JS, I often had to manually select DOM elements, update them, and ensure that the UI stayed in sync with the underlying data, which made the code harder to reason about as it grew.
React’s component-based architecture and state-driven rendering remove much of this manual work by automatically updating the UI when state changes. I prefer React because it reduces boilerplate code,
encourages better organization, and makes UI updates more predictable and easier to debug as applications become more complex.
Types
Using TypeScript was helpful in catching potential bugs, such as passing the wrong type to state or API calls. It forced me to think about the shape of data returned from the backend.
Occasionally, typing optional fields like genre or handling backend inconsistencies required extra attention, but overall it was very useful.
LLMs
Usage
I used ChatGPT to help organize state in React forms and troubleshoot API call issues. For example, it helped me figure out how to handle optional fields and type conversions when fetching data from the backend.
Reflection
LLMs made the assignment more efficient and enjoyable by saving time on boilerplate code and guiding me through tricky state management issues. They did not replace understanding. I still had to read and adapt generated suggestions.
Using LLMs allowed me to focus more on learning the core concepts rather than debugging syntax.