This bug bothers me, but it’s also an opportunity to learn in the future. Once you move to the next image, this is resolved. There is a lingering bug: the carousel doesn’t reserve enough space in the DOM initially for the first image. It even has keyboard controls and by using a ref (thanks in no small part to Lee Warrick’s article React’s useEffect and useRefs Explained for Mortals I auto-focus on the carousel, so keyboard controls are available as soon as the comics load. Kim aka Dance2Die turned me onto nuka-carousel which turned out much better for me. My first attempt was to use the pure-react-carousel library, however, the results I was getting were hardly ideal (all images were rendered on a single slide). Pretty nice! This takes us to the final stage of the exercise - displaying the data. This is problematic only in that when I tried to make the same API call from the client, I received a CORS error.įunction XKCDGallery ( ) One consequence of this is that I do not have access to a server in the traditional sense. Unfortunately, this site is built on Gatsby, a statically site generator. The XKCD site has a page dedicated to programmatic access of comics. Here’s where I hit my first stumbling block.
Step one to building this gallery was to actually be able to get the images.
#XKCD.COM SIMPLE WRITER FULL#
The building process turned out to be quite informative and full of stumbling blocks.īelow, I highlight a few of them and the final result. To avoid the temptation of hitting the refresh button to get a different five, the randomness would be limited to the day of viewing.The carousel would navigate through five, “randomly” chosen comics.Comics would have the Title and the Image, nothing else displayed (similar to XCKD’s native experience, however with fewer buttons).Some of the decisions I made up front on how the page would look and interact: So, I set about building this (which is live on this site at /xkcd) Over time I would catch up, but I wouldn’t have to worry about fighting the gravitational pull that is. I wondered if there wasn’t some way that I could pull five, just five images into my site every day for a digest of sorts. I love Randall Munroe’s XKCD, but going to his site every day is potentially problematic because it’s so easy to get sucked down the rabbit hole of clicking “random” over and over and over.Īt the same time, he’s been writing comics for years and I haven’t kept up.
0 kommentar(er)
