Graphing/Charting Data on Web Pages: JavaScript Solutions

Aug 4 2008 by Jacob Gube | 19 Comments

Effective data visualization allows users to easily understand and consume otherwise complex, boring information. Plotting your data can serve as a replacement to tabular data, and is also a great way to add practical graphics to your web page or application. There are a variety of ways you can plot data on-the-fly – but in this article we’ll focus on 10 excellent JavaScript solutions to graphing/charting data that allow you to process data client-side. You’ll also find a link to one of the demonstration pages of the script so that you can see it in action.

Flot

Flot - Screen shot.

continue reading »

Learning MooTools: 20 MooTools Tutorials and Examples

Jun 19 2008 by Jacob Gube | 19 Comments

There are literally over a hundred of JavaScript frameworks out there that make writing complex client-side code significantly easier. If you’re in the market for a powerful, relatively lightweight, and customizable JavaScript framework, MooTools is worth checking out.

To help you get on your way to developing highly-interactive web applications using MooTools, here’s 20 tutorials and working examples that’s worth a read.

Getting Started with MooTools

1. The "Mootorial"

The Mootorial - Screenshot

continue reading »

16 Free JavaScript Solutions for Displaying Your Images

May 3 2008 by Jacob Gube | 44 Comments

If you’re looking for a way to display your images on a website but don’t have the time to create a custom solution, there’s plenty of free and easy-to-use scripts available at your disposal.

Here, I’ve compiled 16 free image galleries and slideshows for you to take a look at. Though the effects are smooth and their features are robust, none of them use Flash, only JavaScript, and they require very little coding on your part.

1. JonDesign’s SmoothGallery 2.0

SmoothGallery 2.0 is a nifty slideshow gallery that transitions between images very… smoothly. The author tested SmoothGallery 2.0 in Firefox, Opera, IE 6 and 7, and Safari. It requires the mootools JavaScript framework.

SmoothGallery 2.0: Improved Mootools Mojo for Images

SmoothGallery demo

continue reading »

40 Excellent Resources for JavaScript Coders

Apr 10 2008 by Jacob Gube | 23 Comments

photo provided by Dmitry Baranovskiy - the JavaScript Code

Are you an advanced JavaScript coder looking for more sites to sharpen your coding prowess? Maybe you’re a web designer wanting to double as a developer (or at least know enough to add a bit of rich content into your designs). Either way, if you’re looking for more information on the topic of JavaScript, the following resources are worth a gander.

continue reading »

10 JavaScript Effects to Boost Your Website’s Fanciness Factor

Mar 18 2008 by Jacob Gube | 109 Comments

leading photo - Fireworks 1 - by  AMagillThere comes a point in time where we want to improve our website’s interface or provide a captivating experience that our users will remember.

We have three main options (from hardest to easiest): write the scripts ourselves, use a JavaScript framework such as jQuery or mootools (which will make coding easier), use a pre-made script that works with existing JavaScript frameworks or that the author has developed from scratch. This article’s for the individuals who chooses to make things a bit easier and those who don’t want to re-invent the wheel.

Here’s a collection of 10 powerful yet easy-to-implementJavaScript effects to supplement your web page’s interface. These were picked using a “bang for your buck” methodology; meaning that these effects were chosen specifically because they provide high-impact effects with very little effort in installing and using them.

Author’s note: Title of this article, by request, was changed to reflect the content featured in this list. I apologize for the confusion this may have caused, and better quality control will be implemented in subsequent articles.

continue reading »

10 More Worthwhile Web Developer Websites to Check Out

Mar 15 2008 by Jacob Gube | 4 Comments

Lead-in image: an architectural structure with the words More. Photo by  Gaetan Lee.A recent article of mine entitled “20 Websites That Made Me A Better Web Developer” attained a large amount of popularity and I was pleased to find out that many people found a link or two that they’ve bookmarked.

The list started out as a massive collection of 100 websites (after going through my massive-huge bookmark collection) , but I then decided that, instead of overwhelming readers with 100 links that will be skimmed and forgotten the next day, that I would filter it down to only 20 quality websites that have been truly helpful and rich with information. A few things on the list were there for sentimental reasons, such as Web Monkey and SitePoint, which did help at the beginning, but now I’ve outgrown.

I received plenty of feedback regarding sites that should have been on the list. Here, I’d like to make amends and list down websites that have helped you (and me) further our understanding of web development and design.

continue reading »