Boxed In, Breaking Through: My Journey with CSS and JavaScript

Coming into the CSS module of the program, I knew it would be extremely confusing for me; however, I’m surprised at how well I’m picking up each step of this module. During my previous coding course, nothing made sense to me throughout the entire class. While I was able to coast by, I didn’t understand the information and ultimately retained nothing. Thankfully, during this week, the pieces are finally starting to click into place, creating momentum from new information. This is only just the beginning, which can be daunting, but it is doable.

The key to fully understanding how to code (for me, at least) is grasping what each syntax means. Otherwise, code can look like a completely foreign language. In reality, there is a logical system behind it all. What’s helping me the most is taking time to break down each property and thinking through what it’s doing to the element. For example, when I first encountered margin: 20px 15px 10px 5px, it looked like random numbers. But once I understood it follows a clockwise pattern (top, right, bottom, left), I could visualize how it creates space around an element. I’m starting to see patterns in how different CSS rules interact with each other, and that’s making it easier to predict what will happen when I make changes. The more I practice, the more I realize that CSS isn’t just random rules; there’s logic behind why things work the way they do. Once you start to see that logic, everything becomes much more manageable.

This week, we learned about box model concepts and their fundamentals for CSS. While the inspect tool is a perfect resource for understanding content, padding, borders, and margins visually, it’s crucial to understand this model without relying solely on the inspect tool. During the tribute assignment, I initially completed the task without understanding the box model. When I researched how to center certain elements, the results would show me properties like margin-top, margin-right, margin-bottom, and margin-left instead of the shorthand version. However, once I learned the shorthand syntax and grasped the box model fundamentals, I began to see CSS properties as interconnected tools rather than isolated commands. This shift in perspective transformed how I approach styling challenges, though I’m still navigating this learning curve.

An unfamiliar topic from the video that I wanted to explore was JavaScript, as this is something I’ve been asked about frequently when starting the program and discussing it with others. While I wasn’t previously acquainted with JavaScript or its fundamentals, I had at least heard of it before, so it was enlightening to get a foundational taste of what it represents.

I explored this further on Codecademy’s website. I honestly love their interface design, navigation, and content structure, which became my platform of choice for additional JavaScript learning. While watching the instructional videos, they explained JavaScript as a programming language that serves as the standard for most web development. I hadn’t realized there were multiple programming languages, but it makes perfect sense that there wouldn’t be only one tool for all programming needs.

This clarified something that had confused me about “JavaScript or Python” in coding discussions; they were asking about which programming language to use for specific projects. W3Schools.com also offers excellent beginner lessons on JavaScript that I’ve bookmarked for future reference. After gaining this foundational understanding of what JavaScript is and its role in web development, I find myself both nervous and excited to learn more about it in our structured learning environment, rather than attempting to teach myself, since there are fundamentals I didn’t understand when researching the topic.

Leave a Comment

Your email address will not be published. Required fields are marked *