I completed the image gallery today.
As far as writing code goes, the main task was to generate thumbnails on the fly. I did not want to code this functionality from scratch, so I installed the GD module for PHP, and downloaded phpThumb(). This framework is not very complicated and has demonstration code to show how to use it. I liked that it could be invoked as a class, and so looked no further. It does the job, and while it might be a little bit more than I need, and although I probably could have written this from scratch after learning how GD works, I happily avoided reinventing a function that someone else had created. Internet shopping for open source code allowed me to get this little project done with very little fuss
Generating thumbnails can be time consuming for the server, but I wanted them to be generated on demand.1 Rather than make them from scratch each time, I save the thumbnail as a file on the server for reuse next time. Thus the first thing I do is to check to see if a thumbnail is already made, and if not, I tell the server to make it before serving it to the visitor. Since I am testing the site as I go, this is not a problem. Users aren't waiting a few seconds while the gallery generates all the thumbnails. At most they'll have to wait a few milliseconds while 1 or 2 thumbnails are generated for them. The ideal solution is to make thumbnail generation an asynchronous process in the background which does not get in the way of serving the page to the user. If generating thumbnails on demand becomes a problem I'll add an asynchronous process so that no user has to deal with this, but it is very unlikely that anyone but myself will benefit.
I did write the JSON from scratch for the title, caption, and so on for each image. All of the meta data for the pictures in the gallery is thus written by hand into a text file. This is something that I'll probably want in a relational database if I am updating the gallery often. And I'll need to write a gallery editor to make this work smoothly. At present hand editing the JSON is preferable to spending time creating tools for futzing with the image gallery. The gallery is not a core part of the website. I added it merely because I was obsessed with all the photos I was uploading for the home page background.
Most of my time was spent screwing around with CSS. I really need to get better at front end coding. At present its a painful process of web searching for how to do something, and then fiddling with settings. I am not yet using SASS to manage all of the CSS and just code up a big mess by hand as I go. I can see the pitfalls here. I suppose once I am better at CSS, I'll take the next step and learn the tools, and approach website design as a top down process so that I can organize the whole thing in one go. We'll see. This site is going to grow organically, and I don't know what I am going to do with it. I think that making mistakes like this is good for now. I'll learn much from all the mistakes I make, and develop ideas for how to solve these problems with better organization and coding practices for CSS in the future.
Clearly I am already breaking from my plan to do everything by hand as I make this website. The nostalgia of learning to code like I did back in the late 90's has worn off. I automate stuff from the command line while using my desktop so I might as well code the website to work for me too. ↩