Posts

Showing posts from February, 2020

UI Libraries

I'm currently using React-Bootstrap as my UI library. At least, that is the library that I am importing in most of my components. I'm not actually making much use of it at the moment, but that's the plan. However, I would also like to use Material UI. Actually, I would like to use Material UI instead of Bootstrap, because I like it better. Only, because of the way UI libraries work, the more I integrate Bootstrap, the harder it will be to switch to another UI later. I'm trying to keep all my Bootstrap changes in one branch (bootstrap), and switch to development branch any time I make a non-UI-related change. Which means I have to keep rebasing development onto bootstrap, so I don't lose anything important. Why don't I just drop Bootstrap and start using MUI right now? Well, I tried that a few months ago, and ended up deleting the branch because I got stuck and had to revert back to development to make it compile again. So I'm hesitant to go down that

DRYing out

I just did a coding challenge that involved making a component and then testing it with Storybook. Which reminded me how much I love Storybook. So I started using it in my project. Which reminded me that I'm not really following Best Practices with my components. Basically, my FilteredGallery component is way  too big - it's more of a page than a component. It contains all the other components used for displaying artwork. Which is not optimal design. Ideally, I want an Artwork page that contains the following components: A list of albums (where each image is in exactly one album) A filtering tool that uses tags (which is what I currently have as the album list) A thumbnail gallery, for showing the images returned by the filter or album A carousel An image display An info panel with purchase options and links The thumbnail gallery and carousel can be part of the same component - that's probably easier, because they need to be synchronized. And the info panel can

Getting back to it

I took some time off from working on my site; my reasons are irrelevant to this discussion. The important thing is, I'm back now, and have made a couple of improvements since the last time I worked on this blog. They are: The Featured Artwork on the Home page now shows 4 random images. If you refresh the page, you'll see different images. They all come from a pool of about 30 images tagged with "favorite," so they're all among my best work (based on my own subjective opinion). The mechanism for this is a simple implementation of the Fisher-Yates algorithm to shuffle the images and then grab the first 4 (though the same component could be used to randomly select an arbitrary number of random images). On the Artwork page, the gallery of thumbnails on the left is now a set height, instead of resizing to match the height of the selected image on the right. I'm still not completely satisfied with this, but at least you don't see huge gaps between the rows