This week I learned that React is really powerful for building interactive web UIs. It ties state directly to what shows up on screen. Until this class I had only heard about it from web developer content creators on YouTube.
One thing that stood out was how clean hook-based state management is. Using useState to handle name, password, and message meant no canned function calls, imports, and less cut-n-paste code. It's simple and easy to follow. Then, since state updates are explicit (setName, setPassword, setMessage), the UI always reflects exactly what's going on. So the save/unregister flow wasn't to hard to trace when I was debugging. React Router is does a lot of heavy lifting. useNavigate() made redirecting after unregistering painless. It's a single function call that takes the burden off of the programmer (me).
That said, it has its limitations. I ran some of my code by a co-worker. He pointed out that React by itself doesn't have a built-in way to share state across components. In our case for this this assignment, we're reading and writing straight to sessionStorage inside the component to manage name, customerId, and jwt, which mixes browser storage logic with UI logic. Apparently their are libraries and features to help with this but I don't have the time to study them.
Data fetching could also be better. Every network call (save, unregister) has fetch -> response.ok -> try/catch logic. Looking into it, there's no caching, no request de-duplication, no retries, no built-in loading states (I might be able to implement that part). It's the same in Order.jsx, Login.jsx, and EditOrder.jsx too.
I can see why React is so popular and I why people have found it useful to build on top of it. That explains why there are third party solutions to some of the shortcomings that I pointed out.
