November 15, 2022
So...it took me a while to think of what I wanted to do for my first "codesketch", and like with anything I have trouble coming up with a topic for, I decided to make something about my dog. The concept was pretty simple to come up with; I wanted the user to click on a picture of my dog and another picture would appear. The first order of business was to upload a bunch of good pictures to my computer and move them to my github folder, and I got pretty lucky here. Some of the pictures were jpgs and some were HEICs, so I just converted all of them to jpgs, and in the process, I named them all with a consistent formula, which really helped later on as I actually coded the project. I named the pictures "dog*insert number*.JPG", so everything was just dog1.JPG or dog4.JPG or dog17.JPG. After that, I started thinking of what I had to do in order to make this work, and I immediately created a div for where the picture would be. The style section was pretty easy, so I just moved to the javascript section, which I knew would be the hard part. Initially, I thought that I needed an if statement, which led to a whole lot of confusing stuff and me trying to debug with console.log commands. Then, there was this url problem where I didn't really know how to change the background image of a div using urls in javascript, because the code kept not working. I was unfamiliar witht the formatting and data type usage in javascript, so I assumed it was something like that; therefore, before class today, I just finished the text I wanted on the codesketch, because like, why wouldn't you put the word DOG. over an image of a cute dog. It just fits
In class today, I asked Molly to sort out the url problem and found out that I just needed to make it a string, and Molly deleted the if statement because it was just unnecesary. After that, I just worked out a few kinks and now, I have a repeating loop of 17 dog pics that I can click through whenever I need to smile :)