After completing my first week of “code camp” I’ve been met with both highs and lows. Some HTML has clicked instantly and made me think that this will be a walk in the park. While other aspects of CSS and Flex have left me frustrated at seemingly simple tasks. This is good. This is learning and I am trying to be comfortable with the “peaks and valleys” my instructor has talked about. On to the homework assignment, a few questions posed for discussion.
- Describe one thing you learned in class today.
I was called on in class to help wireframe our homework assignment of creating a NASA landing page. It really made me stop and consider how we layout our code helps to create a cleaner working environment. My attempt was good, but not what we as a class agreed was best. It feels like less is better when writing, so imagining the page being broken into Flex helped me see it differently. It’s obviously important in a professional setting to present clean code, and that definitely starts when you plan it out. I though I had wire-framed my own work in a clean manner, but found that I needed to go back and try again before I was ready to dive in. Youtube also had a ton of wireframe tutorials that helped me refine how I see what I’m planning.
2. Describe your choice of pseudo-selectors and discuss what they are used for.
I interpreted this question as a description of the pseudo-selectors, or pseudo-classes, available to me within the styling toolbox. As defined these are used to define a special state of an element, or special circumstantial style. Some common ones I was able to research: color variance when hovered, styling visited and unvisited links differently, or changing an elements focus when clicked. Diving deeper found out you can also combine pseudo-classes with CSS classes, making it even more useful. There are a ton of examples and I fell into a rabbit hole on the first link I followed with:
A pseudo-class is used to define a special state of an element. For example, it can be used to: Style an element when a…
It did have me questioning how crazy I needed to get with these, since I feel with my current limited knowledge I could accomplish some of these tasks with ‘lesser’ coding. I’d guess the further into the Front End side of things you specialize this would be undoubtedly more useful.
3. What are some “gotchas” for writing efficient CSS?
I learned some of this the hard way. Order really matters, it’s obvious to anyone who has done this for more than one week, but being that the last rule stated will be the one that applies was a tough learn during my attempt at building a landing page. I often found myself unsure why the code I had just input didn’t reveal a change, and it was almost always because a rule below would be “overriding” what I was attempting to style. It was also really helpful when I started to add comments within my work so I knew what I was trying to do, or what I needed to do in the future. Comments were also key to me figuring out a few problems. And lastly I think that working within my current knowledge limits and creating a base was helpful, as I often found myself down rabbit holes attempting to create advanced elements that I really had no business with quite yet. I did go back and find ways to improve my initial styling, but it was more helpful to create what I felt comfortable with and build from there.