Pinterest Stumbleupon Whatsapp
Ads by Google

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 What is Node.JS and Why Should I Care? [Web Development] What is Node.JS and Why Should I Care? [Web Development] JavaScript is a just a client-side programming language that runs in the browser, right? Not any more. Node.js is a way of running JavaScript on the server; but it's so much more as well. If... Read More and Ruby installed (though you won’t have to learn Ruby 3 Interactive, Fun, Free Ways To Start Learning The Ruby Programming Language 3 Interactive, Fun, Free Ways To Start Learning The Ruby Programming Language Ruby is an expressive, very high-level, scripting language. It is used on the Web mainly as part of the Ruby on Rails web development framework, but also standalone. If you’re curious about what Ruby (not... Read More ). Like most Web frameworks, Gumby is for mainly for developers who already know what they’re doing.

gumby0

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 You Are Missing Out By Not Creating A Personal Website: Disproving The 6 Myths You Are Missing Out By Not Creating A Personal Website: Disproving The 6 Myths Have you ever considered having a personal website? You know – a place where people can go to read about who you are, what you do, your goals and aspirations, and of course to contact... Read More . 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 How To Build Your Own Website In Minutes Without Any Coding Skills How To Build Your Own Website In Minutes Without Any Coding Skills As the Web grows, and it does so dazzlingly fast, the need for a web presence is becoming more pressing. In many parts of the world, you simply must have a web presence in order... Read More for making a site.

The Elephants In The Room: Bootstrap and Zurb Foundation

gumby2

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

gumby1

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:

gumby4

  • 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 ezuk.org 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 How To Install A Windows Web Server On Your PC With XAMPP How To Install A Windows Web Server On Your PC With XAMPP Read More , 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.

  1. Guy M
    May 6, 2014 at 11:30 am

    Definitely going to give this a go on my next project. Also, I had NO idea about the Python web server. Where was I during that lesson? Too cool.

Leave a Reply

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