JavaScript Workshop » libraries

Animation effect can reinforce a message, clarify a user interaction, and even entertain. But they can just as easily cloud the interaction , distract the user, and annoy your visitors. Properly utilized, animation effects should emphasize the message of the site, clarify or reinforce the user interaction, or mildly entertain.

The script.aculo.us library is built on top of Prototype (discussed last meeting) and can create cool effects, allow for drag and drop, assist in Ajax development as well as provide DOM utilities. It is used by many commercial web sites such as Apple, Digg, Feedburner, Gucci and more.

Though just like many other libraries, be aware of the resources it will require and the real necessity of using them.

Have a safe and happy holiday and I'll see ya next year!

JavaScript’s increasing popularity throughout the web makes it more important than ever to make sure our client side code is implemented with a nice mix of stability, speed, and reusability. One of the best ways for accomplishing this is to use a simple library and syntax to use as a foundation for every project.

Prototype was the first JavaScript library to get mainstream support among web developers. It is used as a foundation for other JavaScript libraries such as script.aculo.us, included in the installation of Ruby on Rails and web applications like WordPress. Provides helper functions for Forms, DOM, OOP, Ajax and extends existing JS objects. It is called a framework on the website because it is so robust that it practically recreates the JavaScript language to a certain extent.

To get an idea of the robustness of this library, take a look at this cheatsheet (.pdf) by Jonathan Snooks highlighting its interface methods and properties.

The more advanced JavaScript applications get, the greater the need for structuring the code well. One way to do this is by using OOP, object-oriented programming. JavaScript itself is not an object-oriented language, but rather an object-based language. There is a support for OOP, though it's somewhat limited.

There is no distinctive keyword for classes in JavaScript. Instead, each class is defined as a function. The difference between a regular function and this one is the way this function is later called: with the new keyword.

(read more...)

JavaScript libraries like Prototype, Scriptaculous, YUI and Dojo are making a huge impact on the field of DOM Scripting. As AJAX matures and the complexity of the script to support it increases it becomes much less feasible to re-invent the wheel and produce code from scratch for every project.

At the @media 2006 conference in London, a panel of DOM Scripting experts (Cameron Adams, Peter-Paul Koch, Dan Webb, Stuart Langridge and Simon Willison) discuss the whys and what-fors of JavaScript libraries, the advantages, the disadvantages.

Jonathan Snook is a freelance web developer living in Ottawa, Ontario, Canada. His very popular blog cover topics such as CSS, JavaScript, PHP, Open Source, etc. He is also a web columnist for Digital Web Magazine, and has co-authored The Art and Science of CSS and Pro DOM Scripting with Ajax, APIs and Libraries. Jonathan was nice enough to give me some of his time to answer questions about JavaScript and libraries.

(read more...)

Hasin Hayder is a web developer, author, PHP Certified Engineer and open source enthusiast from Bangladesh. He has authored Wordpress Complete and Smarty PHP Template Programming. He works at a personalized startpage company called PageFlakes as a development engineer. Hasin was nice enough to give me some of his time to answer some questions concerning accessibility in Ajax, WordPress, open source and important web skills.

(read more...)

Lightbox JS is an unobtrusive script that is used to overlay images on a web page. As I mentioned in a previous post, this is one of the techniques you can use to create an image gallery on your website. The script uses the Prototype and Scriptaculous JavaScript libraries as well. By using functionality of these two libraries, the script produces some very nice animations in displaying your images.

(read more...)

Since the emergence of Google Maps giving us the ability to put an interactive map on your own web page(s), there are now four separate APIs to choose from: Google Maps, Yahoo! Maps, Microsoft Virtual Earth and MapQuest. These APIs are similar, so once you understand one; it is just a matter of learning the differences of the others.

(read more...)