Devlog #16

So I decided to implement some feedback that I got from the last ship. One piece of this was adding my actual certificates into the website, so people could actually view them in the webpage. So I took some time to scan all my certificates. Creating the links wasn’t quite hard, and at first I thought about just letting it open in a new tab, but then I decided to create a modal just to enhance the UX.

Current Progress

I decided to add all my certificates into the webpage, just to add a layer of validity to my work. The first part was finding all of the certificates. Whatever I had, I added them to my GitHub repo, and just linked the relative paths in the webpage. The ones which I had online, I just drag and dropped into the repo, while the physical ones I had to scan and then add in. So that took a while, but wasn’t too tedious of a process. After that, I just made a “View ->” sign that appears when you hover over the card, and that is actually a link to the image. Then I decided to make a modal. I realized it actually isn’t too hard, but the JS logic is a but complicated. I styled the modal in CSS, and then just added a .open class to it which was activated when you click the link. So I’m starting to understand JS logic, the only thing that I have trouble with now is writing like proper syntax, as I still have trouble with writing the correct syntax, and that can cause some problems. So then I styled how the image looks in the modal. At first I though about add ing a X to close the modal, but then I made it so then if you press outside the image, then the modal disappears. Some of my UCMAS achievements do not have images attached to them because I couldn’t find actualy certificates for them, so I might take pictures of my trophies to put there, but I haven’t got to that yet, and I don’t want to put low-quality images. So those are still empty, but almost everything else is filled, so now you can go and view those.

Next Steps

I literally don’t have anything left to do on this, so I think the next step is to just ship. I will take a break from this project and begin to work on my next one, which will be making a cool new tab page from my browser. So expect a ship soon. If anyone has any suggestions on something to add, you can let me know!

Below is an image of my stardance certificate shown in the modal on the page.