Classy Comp I: Bootstrap

Classy Comp I: Bootstrap



So I realized I don’t talk about my job as a computer scientist and web developer and topics related to it so much on this site. Part of me isn’t completely sure why as I do love my job and (most of the time) love what I do but I also don’t draw much attention to it and I suppose it’s never exactly been my forte and my greatest strength. It’s very difficult for me to get excited and interested about computer science topics even when it’s what I majored in. Strange, is it not? However, that’s still no excuse and so today begins a new series of entries on topics of Computer Science which I am calling “Classy Comp”. For this entry, as it just so happens I do have something really cool computer science and programming related that I am very excited about.

So today in this modern era, mobile devices and gadgets such as IPads, IPhones, tablets, and things like that are becoming much more prevalent and much more in use to the point where there is a greater majority of people using mobile devices as their primary source of connectivity as opposed to a desktop computer. I know I would definitely be in that category if it hadn’t been for my career. And so corporations, businesses, media centers, and programmers have been having to work extra hard to make their websites mobile device friendly in order to reach the biggest audiences. This has even reached the point that a few weeks ago on April 21st, 2015, Google specifically changed its search algorithm to start using mobile-friendly variances in their mobile searches. What this means is that if your website and the pages contained within it aren’t specifically mobile friendly, then your site will not show up on search engines on a mobile device and your site will be marked down on mobile devices and lose that coveted traffic. Naturally, this event called the “Mobile Apocalypse” in some circles has caused major stress and work for a lot of businesses and among the technological and corporate world, some of which I have personally seen. So how do you really combat this? There are basically only two options: you either create a specific mobile site or you make your website mobile friendly with responsive web design techniques and coding. Sounds simple enough, right? A few years ago….not so much. Mobile programming is notoriously difficult and tricky even for experienced programmers and it takes a lot of extra time, effort, and expenses more importantly. I can personally vouch for this and half the time it’s almost more trouble than it’s worth despite how amazing the final product can look. However, today in 2015 with these new restrictions and advances? It is still difficult but there is a new framework for HTML, CSS, and JavaScript that now makes things so much easier and so much simpler that I would like to share with you. It is simply called “Bootstrap”.


Bootstrap is a front end development framework created only a few months ago in March that is rapidly making waves as one of the new major benchmarks of web design. It is essentially a gigantic toolbox to be used with your HTML, CSS, and JavaScript code for designing and creating websites and helping to make your existing websites sleeker and more mobile friendly. It’s specific goal is to make web development and especially mobile coding easier emphasizing responsive design as a default rather than an add-on. Not only is it compatible with all of the major latest browsers (IE, Firefox, Chrome, Safari, Opera), but it is also FREE and open source meaning that anyone can download it, work with it, and contribute to it. This is a major development folks and everyone working in the industry and digital world should at least know what it is and how to work with it as far as I’m concerned. Studying up and working with it for the past couple weeks since its release, I can definitely say it is a major success in almost all of its goals it sets out to accomplish as a mobile friendly framework and it’s so easy to use (provided you have at least some degree of experience in HTML, CSS, and JavaScript).

Here are some of the features that Bootstrap has to offer at your fingertips for your website and web development experience:

  • “BATTERIES-INCLUDED” PRINCIPLE: Downloading and installing the Bootstrap source literally gives you everything you need to start working with it right out of the box. Everything from the base CSS to the Javascript JQuery code and font files are already there for you to use.
  • FLEXIBLE GRID LAYOUT: Probably the strongest core feature that Bootstrap has to offer is a 12 column grid layout as a basic layout. These columns combine with a fixed or a fluid setting that allows for greater response in how you want your pages to behave both on and off the mobile device. Not only is this inherently easy to understand, but with how customizable Boostrap (which I’ll cover in another point), you can perform nesting and offsettings inherently with a few simple lines, combine and add any number of columns you may need on a row by row basis, and use extra variable, mixins, and custom CSS in order to maximize the effectiveness and responsiveness of what you need on screen. Not many frameworks have this kind of flexibility and ease in their framework as Bootstrap with this simple layout.
  • MANY AND VARIED COMPONENTS: Bootstrap has customizable components up the wazoo. Everything from alerts, navigation, glyphicons, badges, and labels, to progress bars, thumbnails, pagination, and buttons are all covered in their framework and are simple to implement. They’ve even provided Jumbotrons, modal windows, and carousels which normally would require a custom Javascript plugin of some form to implement BUILT IN! That’s absolutely unheard of anymore.
  • CUSTOMIZABILITY: I’ve already mentioned this several times before but it’s well worth repeating. You can customize everything and anything in Bootstrap once you download and install the source. There is a built in customize option where you can choose which features you want and don’t want which eliminates bloat and unnecessary. Like WordPress and other frameworks, you can also override the CSS provided with your own custom CSS and mix and match variables for almost every attribute and component. This allows for much more complexity and potential for strong interactive content on your site as well as some beautifully fantastic designs, responsive or not.
  • REUSABILITY: The fact that you can any and all of Bootstrap’s ready made components and coding in your site make it usable and reusable for almost any site. It also saves major time and effort if you are rapidly creating and working with sites on a daily basis like I do and helps allow for stronger maintenance and code efficiency.
  • THIRD PARTY PLUGINS AND INITIATIVES: Bootstrap is rapidly gaining one of the strongest community of developers I’ve ever seen, each with their own ideas and experience on how things should work and behave. Thus, there are SO many new themes, tools, templates, editors, and improvisation coding being accomplished and the creativity is truly astonishing. If something can be thought of, it can most likely be accomplished by Bootstrap. All you need to do is search for it or even better, create it yourself!!!

If you couldn’t tell, I’m seriously excited about this new framework particularly as I am already using it in my daily career path. You will soon see this frame work take the world by storm especially with all the open development that is currently going on associated with it. If you want to learn more, I recommend going to their website at where you can see all the information on it and even download the framework to start using. I would also recommend a book to you called ” Learning Bootstrap” by Aravind Shenoy and Ulrich Sossou. It is a wonderful starting point and contains a strong and comprehensive but yet easy to follow base for you to start working with and learning Bootstrap. You can find it for relatively cheap on The link is HERE. I for one cannot wait to see where this goes from here.

Until next time, ~Geronimo!!!

Leave a Reply

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