The ongoing saga
As I continue to refactor the “Lego” site, I continue to realize how slapdash I put it together in the first place. I first split the frontend into its component pieces. So scripts, styles, and html all had their own areas. I’ve also touched the backend a bit as well. I think I’m building a shitty version of Angular/Django at the moment.
I’ve gotten a decent way of handling the various requests now. By standardizing the structure of the request, I’ve generalized how the backend handles it. Now, every request tells us what method it wants to perform. Then there’s a simple route map on the backend. If the request is GET, we take the query string and transform it into a command. If it’s a POST, we take the submitted data instead. Then from that command, we route to the appropriate method, passing our parameters.
This will make it easier to add new commands as we just need to write the method, then add it to the route map.
All or none
That’s the way it feels with modules. Javascript always feels a little awkward when you get to anything of size. Referencing a class or function from another file always feels a bit “trust me, it’s there”. So, I figured that creating modules and doing the whole import/export thing would make it better. At the very least, VS Code is able to make the references across files.
But then I got to the point where I wanted my Javascript to work with my HTML. Apparently, crossing from module to non-module is highly discouraged. So the old-school way of adding event handlers directly in HTML takes some work if you want to do that. Or you could attach them using addEventListener as a side effect of loading a module. Which seems to be the preferred way of doing it.
But now, I need a way to attach events to arbitrary HTML elements. So I used datasets. One item to indicate which function I want to call and another to indicate which event to attach it to. This is where I feel a bit weird. Because it feels like I just reimplemented HTML event attributes. The only plus is that it’s generic enough that I can attach all of my events in one go.
Next Steps
Things are coming along decently. Next is getting the filtering working on both ends. Since with pagination, I don’t have the full list client-side, I’m going to have to do the ordering and filtering server-side.