Lilly's Free Code Camp Tutorial Reflections

Tutorial: Cat Photo App

screenshot of the final step of the Free Code Camp Cat Photo App challenge, with the code on the right side and with website on the left side of the screen
Final step of Free Code Camp Cat Photo App Challenge

Reflection:

I had a difficult time with most of the coding in this project. The initial labeling of things was easier, like creating headings and areas for text. However, other areas like creating links and making an image a link was very difficult. I learned a lot, especially about the importance of spacing, the “=” sign, and using quotation marks. A lot of the time when my code wouldn’t run, it was because I was missing one of those or put them in the wrong spot. Overall, the hardest part was figuring out all the terminology and what the different parts of code do, and then after that, trying to figure how the pieces of code fit together to create what you want. This code camp was very difficult for me, but I feel like I learned a lot, but I will still need a lot of practice before I actually feel comfortable with it.

Tutorial: Building A Cafe Menu

screenshot of the final step of the Free Code Camp Tutorial on how to learn CSS by making a cafe menu. The right side displays the final website, and the left side contains the code.
Final step of Free Code Camp CSS Cafe Challenge

Reflection:

I had a lot of fun with this challenge. Now that I know a lot more of the vocab that helps me know where to put things, I understand what I am supposed to do a lot more. I really like being able to change the colors and fonts of the webpages, and I am excited to start using it. Most of the CSS seems pretty understandble, such as margin size and things like that. One thing that I am still unsure about it px size, and how to know how much that will affect something, like how much space 1px is. The only other thing I am concerned about is remembering to switch between the regular html code and the css code, and I don't know how to do that on sublime text...yet

Tutorial: Rothko Painting

screenshot of the final step of the Free Code Camp Tutorial on completing a rothko painting. The right side displays the final website, and the left side contains the code.
Final step of Free Code Camp Rothko Challenge

Reflection:

This challenge made a lot of sense to me, especially after going over things like padding and margins in class. The only thing that was really new from this tutorial is the blurring and the spacing of things on the page. This really helped me to preapre for my sonnet styling because it helped me figure out how to color things and arrange items where I want them. This feels like the simplest tutorial so far.

Tutorial: Photo Gallery

screenshot of the final step of the Free Code Camp Photo Gallery challenge, with the code on the right side and with website on the left side of the screen
Final step of Free Code Camp Photo Gallery Challenge

Reflection:

This challenge was pretty simple for me. It didn't have very many steps and most of the instructions were pretty striaght forward. I like knowing how to arragen things the way I want to. My one question leaving this challenge is when you would use row-reverse and column-reverse, instead of just inputing things in the order that you want them in. Overall, this challege made sense to me.

Tutorial: Magazine

screenshot of the final step of the Free Code Camp Magazine challenge, with the code on the right side and with website on the left side of the screen
Final step of Free Code Camp Magazine Challenge

Reflection:

This challenge was hard for me because it brought up some techniques that we had learned eariler that I had forgotten how to use, like the i tag. All of the grid elements made sense to me, it was more of the basics that I got caught up in, lime remembering how to embed a link into an a tag. Overall, this was a good lesson for me to learn grid, but also a good refresher on basic skills!