Front-end framework or CSS from scratch?

Front-end frameworks are rising in popularity.  From Twitter Bootstrap to Zurb Foundation, these tools can save a tremendous amount of time by doing a lot of CSS heavy-lifting for a web site.

I will be comparing a few frameworks for use in my first web application.  But first, I should tell you why I am even considering one.

What’s a front-end framework?

The unsophisticated definition: a framework provides a basic user interface for your web site, and you build from there.  It saves you time.

More specifically, a framework:

  • Makes responsive design much easier.  Your content will look good on any device.
  • Provides a familiar, intuitive interface for your users.  Links are blue.  Buttons look clickable.  These subtle design decisions, already made for you, make your site easier to learn.
  • Works cross-browser.  The best frameworks are well-tested on all of the major browsers, so you won’t have to do as much debugging.

Should I use a framework?

There are pros and cons.  Chris Coyier of CSS-Tricks summarizes them in a post from 2007 that is still relevant.

For sites that need to be heavily customized or introduce a new kind of interaction that isn’t standard, it may take longer to customize a framework than to build from scratch.

But, as Chris wrote about one major framework, “I think a web app startup could do a lot worse than starting with this to get up and running quickly.”  That sums it up for me.  I am a one-man band on this project, so time is of the essence.  I’ll be using a front-end framework.

Frameworks don’t excuse ignorance

Someone could use a front-end framework to build a site without knowing any CSS.  That’s fine, but the site will look like thousands of others.

In reality, anyone doing front-end development should know how to write CSS from scratch, without the cushion of a framework.

So, in addition to using a framework for my web app, I am going to read a real CSS book.  Stay tuned for updates on that.

It’s time for speed dating

The past few years have seen dozens of new front-end frameworks.  To find the right match for me, I need to spend a little bit of time with each of them.  You’ll come along for the ride in an upcoming posting.  Keep in mind, though – everyone’s framework soulmate may be different.

My first web app: helping people evaluate and improve their skills

As I said in my introduction, I’m an IT consultant who has been developing intranet web sites, primarily in SharePoint, for many years.  My goal is to dive into modern web development, front-end and back-end.  I’m going to learn by doing, and share everything on this blog.

The Pitch

First, of course, I need an app idea. Here’s my elevator pitch:

People generally want to improve their skills in some area. Someone might want to become a better a cook, a better programmer, or a better gardener.

My app will:

  • Help you evaluate your current level of expertise in a certain area
  • Give you tips for improvement
  • Track your progress as you improve, and let you share your progress with others

Experts will create the evaluations that power the app, and gain exposure in the process.

Requirements

Here’s what the app might need to do:

  • Allow anyone to:
    • Take an evaluation on a certain topic
    • Get tips for improvement, based on where they stand now
    • Re-take the evaluation later, to see how much they’ve improved
  • Allow experts in a given area to:
    • Create an evaluation on a certain topic
    • Share the evaluation with others
    • See how many people are taking their evaluation

We’ll flesh out requirements more later, but this is the gist.

In the next post, we’ll start looking at the tools necessary to create this, beginning with the front-end or user interface.

About Me

I’m Corey Martin, and I live in Washington, DC.

I got my first computer at age 8, and fell in love with it. By 12, I had started my own web design company, stylishly named martin.web.design. I set up a web site for it, and began marketing my services to whoever was interested.

Somehow, I got clients. An anthropologist from Papua New Guinea. A small university in California. A realty company. The Internet was new and exciting, and big web firms hadn’t yet established themselves. It was the perfect time to bust out my Dreamweaver skills and start making sites.

Fast forward to now. I’m 27, and consult in DC, mostly on intranet sites. The primary tool I use is SharePoint, which I’ve found can do wonders for internal processes. But I miss web design, and in my very long hiatus from creating sites from scratch I have missed out on the advent of HTML5, CSS3, and JavaScript. Don’t get me wrong, I’ve used these things, but I haven’t really learned them.

In this series of blog posts, I want to understand modern web development inside and out. I hope you’ll come on this journey with me, as I learn:

  • How to start a modern web site front-end. Are frameworks such as Twitter Bootstrap and Zurb Foundation a good idea? When should one start from total scratch, and how?  I’m going to create a front end, and share my experience.
  • How to start a modern web site back-end. What are the most popular tools right now? From platforms such as WordPress and Drupal, to languages such as PHP, Ruby, Node.JS, to frameworks such as Rails, to odd creatures that stand in between like Meteor… where is one supposed to start to code a web application? I’m going to create a web application, and share my experience.

Everything I make will be open source (I know, I’m already flattering myself assuming someone will want to use the code). This is a journey that I want to share in its entirety.

My next post will be about my idea for a web application. Then we’ll start creating it.

Follow me on Twitter (@coreyITguy) or by e-mail (click the lines icon on top of the page for the subscription form).

Did I mention this site will get a facelift as well?

Finally, I’d love to show you some of my early designs…

My web design homepage when I was 14
My web design homepage when I was 14
Toward the beginning of Web 1.0, I loved to give advice…
Toward the beginning of Web 1.0, I loved to give advice…