Media Temple Hosting

Learn to Program

In Divya Manian’s controversial post on Smashing Magazine discussing HTML semantics, something that she said got somewhat overlooked in all the debates that ensued.

At the end of the article, she pointed out that rather than wasting time debating HTML tag use, developers should focus on learning how to program. I think this is great advice. So to that end, I’ve compiled a roundup of sources where beginners can expand their skills past HTML and CSS.

Codecademy

Codecademy dubs itself as “the easiest way to learn how to code.” This is testified to by the site’s more than 200,000 users.

Codecademy

Their “about” page explains: “Codecademy was created out of the frustrations Zach and Ryan felt with learning how to program. Tired with less effective text and video resources, Ryan and Zach teamed up to create Codecademy, a better, more interactive way to learn programming by actually coding.”

Treehouse

You’ve probably seen this one advertised on CSS-Tricks. The Treehouse mission is “to teach Web Design, Development and iOS to people everywhere, in order to help them achieve their dreams and change the world.” Sounds like an overly-optimistic mission to me, but from their testimonials, Chris Coyier’s endorsement, and the overall design of the site, this looks like a great way to learn a whole slew of different technologies.

Treehouse

With the Treehouse method, users watch videos, then takes tests to unlock badges. Seems like a simple and effective concept that’s worth looking into.

appendTo Developer Learning Center

The appendTo Developer Learning Center looks like a great option for aspiring developers who want to learn jQuery and JavaScript. As they describe on the home page: “Level up your skills with our on demand, pragmatic training solution. No signup required. No catch. No kidding.” And best of all, it’s free!

appendTo Developer Learning Center

According to their about page: “More and more companies are implementing jQuery in their websites and applications, and they are looking for developers that are highly skilled in jQuery and JavaScript. We see [appendTo] as a vehicle to train and mold these skilled professionals.”

MDN: A Re-Introduction to JavaScript

This is not a fun, interactive course like those already mentioned, but definitely worth a look if you want something simple and text-based. The opening explains: “Why a re-introduction? Because JavaScript has a reasonable claim to being the world’s most misunderstood programming language. While often derided as a toy, beneath its deceptive simplicity lie some powerful language features. 2005 has seen the launch of a number of high-profile JavaScript applications, showing that deeper knowledge of this technology is an important skill for any web developer.”

MDN: A Re-Introduction to JavaScript

Although the opening’s reference to “2005″ seems to imply that the article is somewhat old, it is editable and continues to be maintained and updated, so I think it’s safe to say this would be a fairly reliable and relevant resource for those desiring to learn JavaScript.

jQuery Fundamentals

Another text-based resource, but a much larger one, jQuery Fundamentals by Rebecca Murphey boasts “contributions by James Padolsey, Paul Irish, and others.”

jQuery Fundamentals

Although this project is maintained on GitHub, the GitHub repo has been changed to this one and evidently the entire project will be moving to learn.jquery.com. My guess is that the current project is not the most up to date in terms of jQuery’s features, but is probably still a great resource for those learning jQuery or JavaScript from scratch.

Eloquent JavaScript

Eloquent JavaScript: A Modern Introduction to Programming is a book by Marijn Haverbeke, that has a free HTML version available online. The book provides not only an introduction to JavaScript, but also serves as a brief introduction to programming in general. It comes with a strong endorsement from Brendan Eich (the creator of JavaScript) who says the book “rekindled my earliest joys of programming.”

Eloquent JavaScript

Although the online version can serve as a fine introduction to JavaScript, the print version (which I have a copy of) is revised, thoroughly edited, and updated.

JavaScript 101

Yet another JavaScript-based course, edited and released by Addi Osmani. This one is a free 10-hour audio course on JavaScript fundamentals, released more than a year ago. The download package for the course includes slides in PDF format and course exercises.

JavaScript 101

The course is a set of audio recordings taken from lectures done by Tony Pittarese, an assistant professor of Computer and Information Sciences at East Tennessee State University. Addi endorses the course, however he does point out that there are some minor things in it that would not be considered best practice today.

Code School

I had initially intended to include Code School on this list, but for some reason it got omitted. No idea what happend, but thanks to Sitki Bagdat for the reminder in the comments.

Code School let’s you learn “by doing through interactive video + coding in the browser” and includes courses covering jQuery, CSS, CoffeScript, Rails, and more. This course is endorsed by a number of well-respected members of the design and development community and you can read more about it on this article on .net magazine.

Code School

This looks like a serious option for those who want high-quality learning and are willing to pay a fee. I’m a little miffed at myself for not including this in the original list, but better late than never, and I’m sure many will find this page via search and will be none the wiser.

Conclusion

I can’t personally vouch for all the material in these resources. But all of these have come, in one way or another, endorsed by well-known front-end developers in our industry. So if you’re a beginner whose been working with HTML and CSS for some time now, any one of these resources could be used to help you step up your game and start programming.

As always, if you know of another resource in the category of learning to program for beginners, post it in the comments.

14 Responses

  1. Sitki Bagdat:

    what do you think about codeschool.com? They work really hard. Their trainings, and screencasts are very helpful to learn a language.

    • Huge oversight on my part. I had bookmarked that site for plans to include it in this list, but completely forgot to add it when I published the article.

      Anyhow, thanks for the reminder. I’ve added it to the article because I think it’s a good option for those willing to pay for learning.

  2. A great selection of resources. Learning to program is perhaps one of the most important things you can do as a web designer.

  3. Pete:

    I need to learn more programming, it doesn’t come quite as easy as teaching yourself HTML or CSS. Thanks, these are great.

  4. Thanks. I’ve been looking for more interesting and effective training type sites. I will check these out. Certainly, first impressions are that this is a nice, easy-paced, bite-sized way to learn and the interface is easy on the eye. I would be really interested to explore the ‘Developer’ learning. If only I could find some time to spend on here!

  5. Awesome suggestions! I’ll definitely have to check some of these out.

    My favorite paid resource has always been Lynda.com

  6. How about PHP? I know there’s tons of places to learn PHP online, but I’ve been looking for a well-covered course (not just code snippets) specifically geared toward WordPress theme development. That’s what I’m really eager for. Would you know of such an online resource? Anyway, thanks for the article! I’ve found myself already getting familiar with jQuery. :-)

  7. I want to learn ruby on rails

  8. Dmitry Pashkevich:

    Great list, some time ago I started putting up my own and it includes all of yours except for the paid ones (haven’t tried them yet). Thanks!

  9. Excellent list (I love lists).
    I actually use a majority of those listed!

  10. Winar:

    How about w3schools.com, i think that is good for beginner like me

Leave a Reply

Comment Rules: Please use a real name or alias. Keywords are not allowed in the "name" field. If you use keywords, your comment will be deleted, or your name will be replaced with the alias from your email address. No foul language, please. Thank you for cooperating.

Instructions for code snippets: Wrap inline code in <code> tags; wrap blocks of code in <pre> and <code> tags. When you want your HTML to display on the page in a code snippet inside of <code> tags, make sure you use &lt; and &gt; instead of < and >, otherwise your code will be eaten by pink unicorns.