Gumby: A Web Framework That Deserves More Love

If you’re an experienced Web developer, you know that a good framework can do wonders for project timelines. The right framework allows you to throw a beautiful, responsive website together in virtually no time — and when you work on a per-project budget, that is essential. It’s not just speed, though: the Web is constantly evolving, and having a solid foundation for your site makes it easier to maintain in the future. That’s why you need Gumby framework.

Who Can Make Friends with Gumby?

To get friendly with Gumby, you will need to have a good working knowledge of HTML and CSS at least — and some JavaScript won’t hurt, either. But to really enjoy what Gumby has to offer, you’ll need to understand Sass, and have Node and Ruby installed (though you won’t have to learn Ruby). Like most Web frameworks, Gumby is for mainly for developers who already know what they’re doing.


If you’re not a coder, fret not! This article may not be for you, but you are missing out by not setting up your own website. The good news is that it’s not rocket science. If you want to quickly pull something together, WordPress is a very versatile option, or you could go with any one of these no-coding methods for making a site.

The Elephants In The Room: Bootstrap and Zurb Foundation


No discussion of Web frameworks can be complete without mentioning Twitter Bootstrap and the (better, in my opinion) Zurb Foundation. I’m not going compare them all today, because that would be boring — and more important, because tools are a very personal choice.

Ads by Google

All three frameworks are semantic, customizable, responsive, have extensive UI kits, and use preprocessors. I’ve tried all three before settling on Gumby, and you should probably do the same. Besides, chances are that if you work on any already-existing code, it’ll be using Bootstrap, so you’ll have to know your way around Bootstrap anyway.

Speaking From Experience: From Concept To Website In 3 Days


We’ll get to the laundry list of Gumby features in a moment. First, the bottom line: With Gumby, I was able to get from a rough paper wireframe to a fully functioning, responsive, beautiful one-page personal homepage in less than 3 days (not full days, mind you). Parallax scrolling, navbar, effortless vertical tabs that work well on mobile — with little fuss compared to previous experiences.

Features Galore!

Here’s a surprising fact: The best place to learn about Gumby features is the Gumby Feature section. The site does a much better job selling the framework than I could, so I won’t mire you down in an endless list. Here’s a quick rundown of my favorite three:


  • The UI kit: You get everything you need for a modern Webapp. Buttons, indicators, navigation (sticky or not, as you wish), and an included icon font, too.
  • Toggles & Switches: Click an element to toggle another element (or a bunch of other elements). This means it is very easy to roll your own tabs, image carousels, or anything that requires showing and hiding elements. Read more about toggles & switches here.
  • The Respond mixin: A wonderfully simple way to fine-tune your Sass to target resolution. Want an image hidden when the viewport falls under a certain size? No problem. Load a different image instead? Sure. Change font sizes? Yup. Read about Respond here. You can see it in action if you go to and change the width of the window: Note how the top section just disappears and the navigation style changes.

I cherry-picked those out of all the Gumby features I used because they make complicated things easy (especially the last two).

One Last Tip: My One-Liner Test Web Server

To use any Web framework, you’re going to need a local Web server. You could always go with a full-fledged XAMPP installation, but for me, that was overkill. My project didn’t have any server-side code to run — all I needed was a basic HTTP server. Python to the rescue:

python -m http.server

This one-liner is all it takes to bring up a rudimentary Web server under Windows, with Python installed. Just navigate to the directory containing the files you want to serve, run this, and presto:gumby3

Try it On Your Next Project

Even if you’re perfectly happy with Bootstrap or Foundation, expanding your horizons is never a bad idea. Gumby has a lot to offer — try it out on your next project and share your thoughts below.

Leave a Reply

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