DEV Community

Cover image for Image Gallery
Jalpy
Jalpy

Posted on • Originally published at jalpy.dev

Image Gallery

BLUF: My final project for my web dev class. Can be seen at Image Gallery - ChatGPT's Take On King Midas

This course had to be one of the craziest classes I have taken. My professor was a menace to the system and had his own chaotic and original way with instruction. He made it very clear that he did not care about pissing off his superiors, and had to be my favorite professor I have had yet.

This course focused on Web Components via Lit. I think we spent a single week (two classes) learning the foundations of web development. Never taught us a single line of HTML, told us to google CSS, and spent that first week showing us what JavaScript does. Personally wish we spent some more time understanding the foundations, but even if I don't know exactly what I am doing... I have been able to accomplish some great stuff.

The organization of the code in this project is actually atrocious, but it works... and with the deadline coming up very quickly I do not want to touch it. I will probably go through after it's graded to clean things up and make it something I'd be proud to show off.

The last week I worked on this project was when all of the logic really came together. Lots of inspect element + console to force type various responses and changes. But eventually, something just clicked. When it clicked I genuinely think there's was ten minutes spent to completely finish the project and get everything working.

Oh... forgot to mention, the project is an Image Gallery. A page full of text + images, you can click on any image and it will display larger... taking up the entire page. You can navigate on the pop-up between all the different images and see which image you are on. Whatever image you click, will be the one to populate the screen. It sounds rather simple, but seeing how I have spent 2 days a week for the last 15 weeks learning everything I know about web development to get to this point. It is a rather large accomplishment and something I am proud to share.

With this said, enjoy the project 😉


Direct Link: Image Gallery - ChatGPT's Take On King Midas

GitHub: GitHub - Image Gallery Final Project


Screenshots of The Page(I did NOT care about styling for this project)

Image Gallery Exanded

Main Page With Images

Top comments (0)