Prototype Visual Reference

April 28th, 2006

I just ran across this great visual diagram of the prototype javascript library:

http://www.snook.ca/archives/prototype.png

It was put together by Jonathan Snook and is a great cheat sheet if you are working with the prototype library.

There are a ton of great plugins for Firefox that make Web development a whole lot better. I really don’t know how I managed without them.

My most recent addition is called FireBug, which provides a number of great features including:

  • Javascript and CSS error notification.
  • Inspection tools for HTML, the DOM, CSS and events.
  • A Javascript command line.
  • XmlHttpRequest spying (which is great for AJAX debugging).

Some of my other favorite Firefox web development extensions include:

  • Web Developer – This should be in every web developer’s tool box. It provides a ton of different utilities for doing things such as disabling cookies and javascript, informational tools such as highlighting elements within your page, tools for validating your HTML and CSS, and way too much more to list.
  • DevBoi – A one stop shop for all of your reference documentation needs. It includes the docs for HTML, CSS, DOM, Javascript and also has add on packs for Ruby On Rails, PHP and XUL. Be sure to install the offline version if you want to be able to access these without internet access.
  • IETab – This is a great tool for viewing your page in IE from within Firefox. It will open the page in a new tab that is rendered using the IE engine. Pretty slick.

If you have any that you think I missed, I would love to hear about them.

Batch Processing with Rails

April 18th, 2006

I just recently ran across another nice thing you can do with Ruby on Rails that I thought others may find useful. I have developed a few different Rails apps and in several cases, I have found that I really needed a way to perform some process in the background outside of the web server. This could serve a variety of purposes, such as for slicing and dicing your data into reports or performing some resource intensive tasks.

Ruby On Rails provides a simple way to take advantage of your existing Rails code from the command line. For this example, let’s say we want to create a script called do_something_magical. So, we can just create a file in the scripts directory of our Rails app and call it do_something_magical.rb. Then, at the top of this script, just add this one line to make your script run within the Ruby On Rails environment:

require File.join(File.dirname(__FILE__), '../config/environment')

Now this script will be able to access all of your other Rails code. For instance, to include your secret_ingredients model, you can just require it like so:

require 'secret_ingredients'

Likewise, if you have a magic_maker dependency in your lib directory you can include it as follows:

require_dependency 'magic_maker'

I found this to be a great time saver when I need to do some heavy lifting with my existing Ruby On Rails code.

Beware the Googlebot

April 8th, 2006

So, I noticed I was receiving a random error from the Gift Hat by one of my ajax auto complete forms.

An ajax submit was occurring without any data, which is impossible from within a browser since a user has to enter data for the ajax form to submit.

Here is the Ajax code in question:

new Ajax.Autocompleter('find_hat', 'find_hat_auto_complete', '/hat/auto_complete_for_find_hat', {indicator:'indicator'})

Thanks to my Exception Notifier setup, I was receiving very detailed emails when the error occurred including this interesting tidbit:

HTTP_FROM : googlebot(at)googlebot.com

It turns out, the googlebot traverses your Ajax code, so beware of the Googlebot or any other random non-human agents. They may be doing things that would otherwise be impossible so plan for these cases as well when building your web apps.

Tour Navigation

April 3rd, 2006

After publishing the Gift Hat Tour, some of the initial feedback I received was that the tour was a bit too long. Looking through the stats for the tour, I could see that a majority of the people never made it to the end. So, I searched for a more elegant solution for presenting the tour content.

My first tour implementation consisted of 8 pages, and that not all of the features of the Gift Hat that I intend to put into the tour. Each page linked to one another through a series of Next and Previous links. So, there was a very linear path through the tour.

After searching around for some alternative inspiration, I ended up completely rewriting the tour navigation to include links to the individual tour pages like so:

I think the end result is a major improvement to the tour with just a simple navigation change. Now, instead of a linear path through the tour, people can choose their own path and exit whenever they like. It also gives me plenty of room to add some of those additional features into the tour as the Gift Hat grows.

Comments Now Work

March 31st, 2006

I just found out that my comments were broken due to a bug
in Typo. They should now be working, so if you tried to leave a comment and failed, you should now be able to.

I am looking forward to Typo maturing to the point where it is not necessary to run off of the trunk.

The Gift Hat Tour

March 31st, 2006

The Gift Hat tour is complete. This provides a nice summary of the major features available within the Gift Hat. Please check it out.

Feedback is welcome in the comments for this post.

Creating Screenshots

March 28th, 2006

I am in the process of creating a demo for the GiftHat.com and I must say it is much more difficult than I would have expected. I thought I could just take some high resolution screen shots using Windows Print Screen and then shrink them down.

However, I quickly found that any text you have on your screen will be garbled to the point of ugliness when you shrink it even a small amount. I noticed that Ian over at UserScape has some great looking shots in his tour and he was kind enough to share his technique with me. He uses SnapZ Pro for the Mac and said it is very easy to use. Unfortunately, I don’t own a Mac so I ventured out to find an equivalent for Windows.

Thankfully, I found it in a great tool called SnagIt. SnagIt makes it easy to grab screen shots from just about anywhere on Windows and provides utilities for adding effects such as drop shadows and custom borders. It also flawlessly handles the scaling of text so that it looks pretty decent even at much smaller sizes than the original.

So, thanks to SnagIt you should be seeing a great demo for the GiftHat.com in the very near future.

An awesome Rails Tool

March 23rd, 2006

Well, I was planning on spacing out the posts of what’s in my toolbox, but another tool in my toolbox called RadRails just won the Best Developer Tool award at EclipseCon. So, it seems like now is a good time to mention it.

RadRails was put together in an incredibly short time by a team of three developers that are in college. Very impressive. It also includes the work of several others including the Eclipse Framework, RDT plugin and Subclipse plugins.

One of the coolest new features they just introduced is a key binding to intelligently switch between your Controllers and your Views based on the Rails naming conventions. This is a great time saver. This is just one of those “Why didn’t anybody else think of that” types of features that is a welcome addition to an already wonderful tool.

Other notable features include:

  • An Outline view of your ruby files
  • Realtime syntax checking
  • Color syntax highlighting for CSS, Javascript, HTML, RHTML and Ruby files
  • An RI documentation viewer for looking up Ruby APIs
  • Server management tools for starting and stopping your WEBbrick servers
  • Integrated debugging tools
  • Source code generator tools
  • And much more…

If you haven’t checked it out, I highly recommend it. I developed The GiftHat.com entirely using this tool. Give it a try. You won’t be disappointed.

What’s in my toolbox?

March 21st, 2006

I thought it might be useful to share some of the tools that I use for software development and general computing. So, I will be posting a series of short articles detailing some of the tools I use and what I find most useful about them. I do all of my development on a Windows machine, so most of my tools are Windows-centric.

The first tool I would like to share is a Windows Explorer replacement called xplorer2. Now, when I first heard of this I thought, “Why would I need a replacement for Windows Explorer?”. But let me tell you, this tool greatly increases my productivity. I am sure I hardly scratch the surface of what it can do, but the features I find most useful about it are:

  • Dual explorer panes: This allows you to see two sets of files and folders simulataneously. As a result, you can work between two folders quite easily for things like copying and moving files.
  • Tabbed browsing: Each of the Dual explorer panes supports multiple tabs so you can have a limitless number of folders constantly open.
  • Great Shortcuts: There are some great shortcut keys for doing the things you do most often in the file system. For instance:
    • F5 - Copy files/folders from one pane to the other.
    • F6 - Move files/folders from one pane to the other.
    • F7 - Create a new file.
    • F8 - Create a new folder.

This also comes in a free version for private and academic use: http://zabkat.com/x2lite.htm.

Enjoy!