Learning something new is scary. For me, the biggest issue with picking up a new skill is that I don’t know what I don’t know. Given that, it’s often useful to find a plan for learning whatever you’re interested in.
It’s primary purpose is to add interactivity to an otherwise static page.
In the browser, it’s not going to replace PHP or Ruby for you.
It’s not even going to replace your HTML or CSS; you’ll use it in conjunction to them.
Assignment 1: Work Through the Courses at Codecademy.com
Codecademy is a relatively new website that bills itself as “the easiest way to learn how to code.”
Assignment 2: AppendTo’s Screencasts
Assignment 4: Install and Learn Firebug (or the Developer Tools)
Firebug website and wiki
Introduction to Firebug on CSS-Tricks
10 Reasons Why You Should Be Using Firebug here on Nettuts+.
Firebug: White to Black Belt by me, on the Tuts+ Marketplace.
Developer tools website
Google I/O 2011: Chrome Dev Tools Reloaded by Paul Irish
Google Chrome Developer Tools: 12 Tricks to Develop Quicker by Paul Irish
Assignment 5: Read a Book
Assignment 6: Build Something!
A Photo Gallery : Display a set of photo thumbnails and a main photo. When a user clicks a thumbnail, have the larger version of the thumbnail (not the thumbnail itself) replace the current main photo. Bonus points if you can overlay a caption coming from the thumbnail alt tag, or loop through the photos if the user hasn’t clicked one for a minute.
A To-do List : This might sound tougher than it is; but I’m not suggesting you build a full-fledged to-do application. Just have a text box with a button beside it; when you click the button, the entered text becomes an item in an unordered list below. Clicking on a list item removes it. It sounds simple enough, but there are several gotchas that it will be good for you to think about as a beginner.
Assignment 8: Keep up with the Masters