I found some very useful resources for dealing with JS, AJAX, and DOM, so I thought I’d share them for any other eager learners.

Getting Started with AJAX

The first place I stopped in my quest for knowledge was the Mastering Ajax series of articles at IBM’s Developer Works.

I read through the first half of the series. Articles 1, 2, and 3 give a pretty good overview of how to create and use an AJAX request. The later articles introduce the DOM and provide a good overview of how to work with the AJAX response and edit the existing web page.

After reading the first two articles, I was able to re-craft the examples and create some basic AJAX-driven forms of my own. It wasn’t anything exciting – but the concept was easy enough to master.

Although you can get by without ever working directly with the AJAX request object, I agree with the author of this series of articles. It’s best to learn to do something the hard way first – then you can take shortcuts.

AJAX the Easy Way – Prototype.js

Later in the weekend, I set about creating my first real AJAX application. My Digg WordPress Plugin uses AJAX to check the Digg API for info on an article after the page has loaded.

I tried to rework the code that I’d built with the Developer Works tutorial, but I ran into a problem when I had to make more than one request. I knew I had to make extra instances of the HttpRequest object, but I was having trouble getting the code to execute the way I wanted it to. Admittedly I’m a JS newbie – the first Javascript I ever wrote was the code from the first AJAX tutorial.

I found a great solution though – prototype.js. This is a javascript/ajax framework that makes it much simpler to work with the base AJAX class.

This made it much easier to create multiple instances of an AJAX request class and have them simultaneously fire off and handle requests. It also handles some of the browser compatibility issues. I like to do things on my own, but I’m pretty sure I’ll be using prototype.js from now on for any AJAX projects I work on.

DOM: Document Object Model Resources

Once I got a hang of sending and processing requests with AJAX, I had to turn to DOM to edit the page. After reading through the Developer Works tutorial and fiddling a bit on my own, I found this surprisingly easy.

If you’ve got an understanding of OOP and XML, the DOM should be pretty straightforward for you. However, there are a decent amount of methods/properties you’ll run into. I found two great references that I’ll be using for a while until I get more familiar with the DOM methods/properties.

howtocreate.co.uk has a compact list of pertinent methods and properties. It’s not explained very well, but it’s good for looking up a method quickly. By contrast, Javascript Kit has a thorough reference of methods and properties with explanations. It’s a bit more verbose, but a better choice if you haven’t got a clue how a method works.

Working with JS, AJAX, and DOM is pretty simple – especially if you already know a scripting language like PHP. So don’t wait any longer – go out and add to your repertoire.

The Pyramid illustrates the different activities that someone generally engages in while learning to program. While looking at the pyramid, I thought, “Do I do all these things?”

For the most part, I do on a daily basis.

Writing About Code and Writing Code

I spend a decent amount of timing writing about code – or thinking about writing about code. That’s a lot of what this website is about, and it’s also why I spend a lot of time on forums like DaniWeb and Digital Point.

As a high school teacher, I know all too well that you learn best by teaching. So I spend a lot of timing writing about what I’m trying to figure out – so I can help others learn it, but also so I can figure it out myself.

On the pyramid, “Writing About Code” and “Writing Code” are separated into two different categories – but for me they’re pretty synonymous. If I spend time writing some code, I usually devote some time to writing about it. It helps me gain a deeper understanding of what I did.

Reading, Revising, and Reading About Code

Likewise, the pyramid divides these into three different tasks – but I’d say they mostly occur at the same time for me.

I spend a lot of time trolling around the PHP sections of webmaster forums (like DaniWeb, DigitalPoint, etc). I like to see what problems other people are having… and then try to solve them.

In the process, I generally end up reading someone’s code, fixing errors in it, and searching the internet to solutions to deeper problems. A small problem in a forum post can easily drive me to learn more about a topic I didn’t know a lot about.

For example, someone posted a question about using preg_replace(). I never used the function much, because I never had a reason to use it over str_replace(). Instead of directing the person to str_replace() like most other respondents did, I spent some time learning how to use preg_replace() and I fixed the error in the original poster’s code.

Reading Environmental Code

If there’s one thing I hate, out of all the bits included in the pyramid, it’s reading environmental code.

For example, I operate another site using CMS Made Simple (Babel). I wrote some modules for the website to make it do exactly what I wanted… and that meant spending a lot of time mucking through the CMS’ source code.

Like most projects, the source code was not well commented or documented. The code didn’t follow the highest standards of coding, either, and I found myself wanting to stop and fix little problems in it as I went.

No, I definitely find it an annoying chore to read through someone else’s code when it’s not well-written and well-documented. That’s part of the reason I always try to make my own code as clear as possible, with documentation throughout.