Why Code More? The Case for Bootstrap 5 Over Plain HTML

27 Feb 2025

Why Bootstrap 5?

Have you ever wondered how websites on the internet are created? It’s straightforward, most websites are created using a programming language called HTML. While searching through the internet, almost everyone has most definitely come across a website that was created in HTML. Creating a website in HTML can take a long time, as it can require a lot of trial and error with messing around with the code to get the correct image we imagine we want on the website. UI Frameworks like Twitter Bootstrap 5 is a very useful tool that helps ease this time constraint, by allowing programmers to create clean websites more efficiently. Bootstrap 5, itself isn’t its programming language but almost like an extension of HTML, with its functions and syntax. However, in my personal experience, learning Bootstrap 5 for the first time was a tough hill to climb. 

image

Out With The Old, In With The New

Bootstrap 5 gave users the choice of ditching the old method of web design by avoiding the use of CSS Styles, a separate file that had to be created to change the styles of the components of your website. From my experience, I prefer the old method of changing the styles via CSS, because I was able to change the styles of almost any component in one place. But using Bootstrap, changing the style of components requires you to make changes to the class heading of a component, along with having to know the specific syntax of the styles. An example of this could be changing the margin of a division, instead of the syntax ‘padding: 10px’, we had to insert ‘p-#’ into the components class, where # is a number from 1-5 which changes the scale of the padding applied to a division. A very small example, but this was the case for any style that was to be edited in the CSS style. This begs the question, if Bootstrap is such a hindrance to learning, why use it and relearn a bunch of new syntax?

How Bootstrap Affects Us in The Long Run

Bootstrap comes with pre-built components that make styling a lot more efficient and clean, while HTML doesn’t have these. Another major benefit of using Bootstrap is its adaptability to different screen sizes. Instead of writing separate code for mobile and PC users, Bootstrap allows programmers to write code for their website in one file, and it can adapt itself to the screen of the user. From my experience, those are the biggest benefits of using Bootstrap 5 over just base HTML and CSS styles. While the syntax will take a bit of practice to get used to, the overall efficiency of creating the website and the pleasant designs of websites will be the ultimate payoff. This is the case with most things in Software Engineering, we’re presented with a base programming language which by itself is a very powerful tool, but with the help of an extension, the time for creating websites can be decreased significantly. One of the few drawbacks of using these extensions is the learning curve and understanding how everything works, but with more repetitions using these extensions, it will just feel like programming in one single language. It was a very similar experience to coding with ESLint, and following a certain set of coding standards because it took a long time to get used to, but it will pay off in the long run.

AI was used to enchance the grammar of this essay.