Bootstrap Breakthrough
10 Oct 2024When I started learning HTML and CSS as part of my ICS 314 course, I thought that I had everything I needed to build sleek and responsive websites. Oh boy, was I wrong. While HTML and CSS alone are crucial, they are incredibly tedious, especially when it comes to achieving those pixel-perfect designs on various window sizes.
Quickly was I overwhelmed by responsive web design, but even quicker did my savior, Bootstrap 5, arrive to rescue me.
The Beginning
At the start, I was ecstatic to tweak every part of a webpage utilizing these two fundamental parts of web page building. The ability to exercise control over each and every pixel felt as though building web pages was a video game, one I admittedly enjoyed, at least at first.
This quickly shifted, the first time I encountered the first boss: “<nav>”. Navigation bars using raw HTML were fine in full screen, but responsive design on the level I wanted needed tools to handle its complexity.
Interactivity Issues
In my ICS 314 course, I learned about these foundational elements which act as the building blocks for most of the websites I interact with on a daily basis. Taking glances at some of them, I thought how impressive it was for these websites to function as they do.
Once I had started getting into it myself, I quickly realized how complex and time consuming it would be to get webpages to such a level of interactivity using these things alone. With that, the introduction of Bootstrap 5 two weeks ago couldn’t have come at a better time.
Strap Those Boots - Using Bootstrap to Better Understand HTML and CSS
At first, I was skeptical. Why would I jump right into a framework rather than focusing on further improving my HTML and CSS skills? The answer was simple. Because it does. Bootstrap was not solely about making web development easier— it taught me how to use HTML and CSS more properly by working through their key concepts.
Before Bootstrap, I would manually define row and column structures, often finding difficulty to make them fully responsive. While its predefined classes reduced that complexity ten-fold, it helped teach me much more about not only semantic HTML and CSS properties, but more importantly, my thought process when it came to layouts.
The beauty of Bootstrap lies within how it changed my mindset, where now I think about responsiveness from the beginning. This would simplify how I operated under recent web page development assignments, as well as helping me realize how flexible CSS can be when used properly. By taking the more difficult parts of CSS out of the equation, I could better understand those underlying principles much better.