As my cohort at Dev Bootcamp, codenamed "Copperheads," completes Phase 0, a remote preparation course, into the onsite web-development intensive, we've been asked to reflect upon our experience creating a professional website. Here are my thoughts on the subject so far.

First, I will admit that this is not my first attempt to create a portfolio website; I built another site for myself as part of Rob Percival's Complete Web Developer course at Udemy.com. Like this site, that one was written without a framework, like Bootstrap or Foundation, or a content management system, such as Wordpress or Drupal. When you compare that site—which is still online at webdevjeff.us as of November 9, 2015—to this one, it's pretty obviously that both sites were created by the same person. The general layout is similar, and it had a similar though simpler approach to responsive design. Eventually, I'll migrate this site, currently hosted on GitHub, to my own domain, and replace the older site, but that transition will not happen for a few weeks at least.

Enter griddy

Although I've learned alot in my nine weeks of remote work for Dev Bootcamp, I started the program with some background in HTML and CSS. Because of this, I was determined to push myself in the creation of this site. Since this site began as an extended assignment for DBC, one of the parameters we were given at the outset was that we were not to use a framework for the first several weeks. This limitation suggested to me that I could extend my knowledge of HTML and CSS by constructing my own grid-based responsive framework.

I spent 20 or 30 hours during the second week of Phase 0 putting together the first version my own framework, which I named griddy, mostly for lack of anything catchier. It provides a familiar 12-column grid system, borrows some elements from the HTML5 Boilerplate, and incorporates Normalize.css for resets. Unlike popular framworks like Bootstrap and Foundation, griddy doesn't include any pre-formatted elements like buttons, menus, carousels jumbotrons or nav bars. Those were deliberately left out, not just for time considerations, but because I didn't want my framework to impose a cookie-cutter design on websites which use it, or to slow load times with an elaborate but mostly unnecessary feature set.

With very little practice, the classes that make up griddy's rows-and-columns format become second nature. I'm currently in the process of moving useful helper classes from the main stylesheet for this website into griddy.css, for inclusion as part of the griddy framework. griddy is available at GitHub for download and use under a GNU General Public License. Even if you don't plan to use it yourself, please feel free to look at the griddy.css file there to see how simple it can be to build your own responsive grid system. I'd love to hear any feedback or critique; email me at webdevjeffus@gmail.com with your comments and suggestions.