How to Learn JavaScript Properly

February 24 Last Year

Learn JavaScript Properly (For NON-JavaScript Programmers and First-time Programmers)

Duration: 6 to 8 weeks.
Prerequisite: Completed at least some high school (no programming experience necessary).
Continue course below.

New New Update (January 7, 2014):
A new study group has just started on Reddit:
January 2014, “Learn JavaScript” Study Group on Reddit

Note that there is also a Reddit-based study group, amongst others noted in the comments below. But these other groups have all started months ago.


This course outline gives you a structured and instructive roadmap on how to learn JavaScript properly and thoroughly, from absolute beginner to attainment.

You do want to learn JavaScript; it is why you are here, and you have made a wise decision, for if you want to develop modern websites and web applications (including an internet startup), you need to know JavaScript. And while there are more than enough online resources to teach you JavaScript, finding the most efficient and beneficial method to learn the “language of the web” is not easy and could be frustrating.

It is worth noting that unlike just a couple of years ago when you needed to know a true server-side language (such as PHP, Rails, Java, Python, or Perl) to develop scalable, dynamic, database-driven web applications, today you can do as much and more with JavaScript alone.

How NOT To Learn JavaScript

  • Do not try to learn JavaScript the first time from bits of unrelated or related JavaScript tutorials
    online—this is the worst way to learn a programming language. It could work for some after countless such
    tutorials, but it is an inefficient process that lacks the proper hierarchical structure needed for learning
    a subject matter thoroughly. And this could lead to your being stuck quite frequently, when you start to
    build websites and web applications with the language. In short, you will not have the know-how you need to
    use that language as a tool—as your tool.
  • In addition, some will recommend you learn JavaScript from “JavaScript: The Good Parts,” by the
    venerable JavaScript godfather Douglas Crockford. While Mr. Crockford, who is immensely knowledgeable in
    JavaScript, is seen as the Einstein of the JavaScript world, his book, The Good Parts, is not a
    good JavaScript book for beginners. It does not explain JavaScript’s core concepts in a thorough, clear,
    easily digestible form. I do recommend you follow Crockford’s advanced videos, however, as part of the Advanced roadmap.
  • And do not try to learn the language by using only Codecademy, because while you will know how to program
    bits of very small JavaScript tasks, you absolutely will not have learned enough to build a
    web applications. I do recommend Codecademy below as a supplemental learning resource, however.

Resources For This Course

UPDATE: A study group was just created (on April 8) for this roadmap on Reddit by Reddit user d0gsbody. He and the members of the group are very helpful and motivated. I recommend you join the group; they will keep you motivated and help you on your way to learning JavaScript. It is difficult to learn JavaScript from scratch on your own. Here is the link: Learning JS Properly – Study Group on Reddit.

We are using either of two JavaScript books, one is ideal for first-time programmers and the other is better if you have at least a bit programming experience.

  • You can use either of the following two books:

    This first book is my personal preference because the author explains the topics very well and it covers up to advanced JavaScript topics. However, it is best used if you have at least some very basic understanding of web development. Therefore, if you have at least a bit of programming or web development experience (it needn’t be in JavaScript), buy this book:
    — The paperback Version: Professional JavaScript for Web Developers
    — The Kindle Version: Professional JavaScript for Web Developers

    Or:
    Buy this book if you have no programming experience:
    — The paperback Version: JavaScript: The Definitive Guide
    — The Kindle Version: JavaScript: The Definitive Guide

  • Sign up for an account on Stack Overflow (a FREE service). It is a forum for asking and answering programming questions. This website will be considerably more useful than Codecademy for answering your programming questions, even very basic, seemingly stupid (remember, there is never a stupid question) questions.
  • Sign up for an account on Codecademy. This is an online platform to learn to program: you write code on their website, right in your browser. (It is also a FREE service).
  • JavaScriptIsSexy Blog Posts on Objects, Closures, Variable Scope and Hoisting, Functions, and more.

The Roadmap to JavaScript Attainment
You will learn just about the full JavaScript language (and jQuery and some HTML5) in 6 to 8 weeks,
if you complete this entire course outline. If you don’t have enough time to commit to do all the sections in 6
weeks (which is a relatively aggressive schedule), try to do it in no more than 8 weeks. The longer you take, the
harder it will be for you to grasp and remember everything you learn.

Weeks 1 and 2 (Introduction, Data Types, Expressions, and Operators

  1. If you do not already know HTML and CSS very well, complete the Web Fundamentals Track on Codecademy.
  2. Read the Preface and Chapters 1 and 2 of JavaScript: The Definitive Guide.

    Or Read the Introduction and Chapters 1 and 2 of Professional JavaScript for Web Developers.

  3. Very Important: Every example code you encounter in the book, type it out and test it and tweak it (experiment with it) in Firefox’s or Chrome’s browser console. Or use JSFiddle. Don’t use Safari. I recommend Firefox—add the Firebug Add on to firefox and use it for testing and debugging your code. The browser console is an area of the browser where you can write and run JavaScript code.

    And JSFiddle is a web application that allows you to write and test your code online, right in your browser. You can test all sorts of code, including a combination of HTML, CSS, and JavaScript (and jQuery).

  4. Work through the Introduction to JavaScript section of the JavaScript Track on Codecademy.
  5. Read chapters 3 and 4 of JavaScript: The Definitive Guide.

    Or Read the Preface and Chapters 3 and 4 of Professional JavaScript for Web Developers. You can skip the section on “Bitwise Operators”; it is hardly likely you will use those in your JavaScript career.

    And again, make sure you stop and write the example code in your browser’s console (or JSFiddle) and experiment—change some of the variables and tweak the code a bit.

  6. Read chapter 5 of JavaScript: The Definitive Guide. No reading for Professional JavaScript for Web Developers, you have learned the material already in the last chapter.
  7. And work through sections 2 to 5 of the JavaScript Track on Codecademy.

Weeks 3 and 4 (Objects, Arrays, Functions, DOM, jQuery)

  1. Read my post JavaScript Objects in Detail

    Or read chapter 6 of JavaScript: The Definitive Guide.

    Or read chapter 6 of Professional JavaScript for Web Developers. NOTE: Only read the “Understanding Objects” section.

    Any of the 3 is fine, although the 2 textbooks go into more detail: the extra detail you can skip confidently, if you read and thoroughly understand my post.

  2. Read chapters 7 and 8 of JavaScript: The Definitive Guide

    Or read chapters 5 and 7 of Professional JavaScript for Web Developers

  3. At this juncture, you should be spending a lot of time writing code in your browser’s console and testing if-else statements, for loops, Arrays, Functions, Objects, and more. It is critically important that you know (and keep practicing) how to code independently (without help from Codecademy) in your browser. By the time you get back to Codecademy, you shouldn’t need any help or hints. Every assignment should be easy for you.

    If you are still struggling with Codecademy, go back to your browser and keep hacking away. This is where you will learn the most. This is analogous to Lebron James honing his skills as a youth in the “streets” (the neighborhood basketball courts), or to Bill Gates hacking away in his basement.

    There is tremendous value in your hacking away and learning bit by bit on your own. You have to see the value in this strategy, and you have to embrace it and trust that it will work.

    False Sense of Accomplishment When Using Codecademy
    The biggest problem with Codecademy is that the hints and little code snippets help you so much that you have a false sense of accomplishment when you are progressing through the exercises easily. You wouldn’t know it at the time, but much of what you are doing is not on your own.

    Now, Codecademy is still great for helping you to learn how to code, particularly in the manner in which it guides you through the process of developing small projects and small applications from very basic code constructs like if statements, for loops, functions, and variables.

  4. Return to Codecademy and complete the JavaScript track by working through sections 6, 7, and 8 (Data Structures to Object 2).
  5. While you are on Codecademy, go ahead and build the 5 little Basic Projects on the Projects track. After this, you are done with Codecademy. And this is a good thing, because the more you work on your own, the faster you will learn and the better prepared you will be to start programming on your own.
  6. Read chapters 13, 15, 16, and 19 of JavaScript: The Definitive Guide.

    Or read chapters 8, 9, 10, 11, 13, and 14 of Professional JavaScript for Web Developers. This book does not cover jQuery, and the jQuery coverage on Codecademy is insufficient. Follow this jQuery course—it is free: http://try.jquery.com/

    And you can read chapter 19 of JavaScript: The Definitive Guide, if you have the book, for more on jQuery.

  7. Work through the entire jQuery course at http://try.jquery.com/

Get The Ultimate JavaScript Editor: WebStorm

  • Before you build your first project, if you plan to be a JavaScript developer or use JavaScript often, you should take a break now and download a trial copy of WebStorm. Learn how to get started with WebStorm here (written especially for this course).

    WebStorm is unquestionably the absolute best editor (IDE) for programming JavaScript. It costs $49.00 when your 30-day trial period expires, but it is probably the best investment you will make as a JavaScript developer, besides buying the book you are using in this course and learning JavaScript.

  • Make sure you set WebStorm to use JSHint. JSHint is a “tool to detect errors and potential problems in JavaScript code and to enforce your team’s coding conventions.” The cool thing with using WebStorm is that JSHint automatically adds a red line under errors in your code, just as a spell checker does in a word processing application. So JSHint will show you all the errors in your code (including HTML errors) and make you a better JavaScript programmer, even as you are learning. This is extremely important. You will thank me later after you realize how much WebStorm and JSHint have helped you become a better programmer.
  • Moreover, WebStorm is a world-class, professional-grade IDE for coding professional JavaScript web applications, so you will use it a lot. And it integrates Node.js, Git, and other JavaScript frameworks, so even after you have become a rock star JavaScript developer, you will be using it, unless a more compelling JavaScript IDE comes out in the next few months.
  • It is fair that I also mention Sublime Text 2, which is the next best JavaScript editor. But it is not as feature rich and complete (even with numerous add-on packages) as WebStorm. I use Sublime Text 2 to make small edits to files of different programming languages, including JS files. But I don’t use it to program full JavaScript web applications.

Your First Project—A Dynamic Quiz

At this juncture, you have learned enough to build a solid web application that is manageable. Don’t proceed any further until you can successfully build this application I describe below. If you are stuck, ask questions on Stack Overflow and reread sections of the book to properly understand the concepts.

You are building a JavaScript quiz application (you will use HTML and CSS as well) that will function as follows:

  • It is a simple quiz that has radio button choices, and it will show the user her score upon completion.
  • The quiz can show any number of questions and any number of choices.
  • Tally the user’s score and display the final score on the last page. The last page will only show the score, so remove the last question.
  • Use an array to store all the questions. Each question, along with its choices and correct answer, should be stored in an object. The array of questions should look similar to this:
    // Only one question is in this array, but you will add all the questions.
    var allQuestions = [{question: "Who is Prime Minister of the United Kingdom?", choices: ["David Cameron", "Gordon Brown", "Winston Churchill", "Tony Blair"], correctAnswer:0}];
  • Dynamically (with document.getElementById or jQuery) add the next question and remove the current question from the screen, when the user clicks the “Next” button. The Next button will be the only button to navigate this version of the quiz.
  • You can ask for help in the comments below or preferably on Stack Overflow. You are likely to get a prompt and accurate answer on Stack Overflow.

Weeks 5 and 6 (Regular Expressions, Window Object, Events, jQuery)

  1. Read chapters 10, 14, 17, and 20 of JavaScript: The Definitive Guide.

    Or read chapters 20 and 23 of Professional JavaScript for Web Developers.

  2. Remember to keep typing out all the example codes in Firefox console and tweak each piece of code to experiment with it to really understand how it works and what it does.
  3. At this point, you should be very comfortable with JavaScript, probably feeling like a Jedi. You are not quite a Jedi yet, you must keep using your newly acquired knowledge and skills as often as possible to keep learning and improving.
  4. Improve Your Quiz Application From Earlier:
    — Add client-side data validation: make sure the user answers each question before proceeding to the next question.
    — Add a “Back” button to allow the user to go back and change her answer. The user can go back up to the first question. For the questions that the user has answered already, be sure to show the radio button selected, so that the user is not forced to answer the questions again, which she has completed.
    — Use jQuery to add animation (fade out the current question and fade in the next question).
    — Test the quiz on IE 8 and 9, and fix any bugs. This will give you a good workout ;)
    — Store the quiz questions in an external JSON file.
    — Add user authentication: allow users log in, and save their login credentials to local storage (HTML5 browser storage).
    — Use cookies to remember the user, and show a “Welcome, First Name” message when the user returns to the quiz.

Weeks 7 and, if necessary 8 (Classes, Inheritance, more HTML5)

  1. Read chapters 9, 18, 21, and 22 of JavaScript the Definitive Guide.

    Or read my blog post, OOP In JavaScript: What You NEED to Know.

    Or read chapters 6 (only the “Object Creation” and “Inheritance” sections this time) 16, 22, and 24 of Professional JavaScript for Web Developers. NOTE: The reading in this section of the book is the most technical reading you will encounter in this entire roadmap. It is up to you if you want to read all of it. You should at least learn the Prototype Pattern, Factory Pattern, and Prototypal Inheritance. You don’t have to know all the other patterns.

  2. Improve Your Quiz Application Even Further:
    — Use Twitter Bootstrap for the entire page layout, including the quiz elements to make it look more professional. As an added bonus, use the tabs user interface component from Twitter Bootstrap and show 4 different quizzes, one on each tab.
    Learn Handlebars.js and add Handlebars.js templating to the quiz. You should no longer have any HTML in your JavaScript code. Your quiz is getting more advanced bit by bit.
    — Keep a record of all the users who take the quiz and show each user how her score ranks amongst the scores from other quiz takers.
  3. Later (after you have learned Backbone.js and Node.js), you will use these two technologies to refactor your quiz code and turn the same quiz into a sophisticated, single-page, modern web application built with the latest JavaScript frameworks. And you will store the users’ authentication credentials and scores in a MongoDB database.
  4. Next: Decide on a personal project to build, and start building your project promptly (while everything is fresh in your mind). Use JavaScript the Definitive Guide (or “Professional JavaScript for Web Developers,” if you own it) as a reference when you are stuck. And of course be an active member of Stack Overflow: ask questions and answer other programmers’ questions.

Continue Improving

  1. Learn Backbone.js Completely
  2. Learn Intermediate and Advanced JavaScript
  3. Learn Node.js Completely and With Confidence
  4. Read my forthcoming post on Getting Started with Meteor.js
  5. Read my forthcoming posts on the Three Best Front-end JavaScript Frameworks

Words of Encouragement

All the best with your studies. Never give up! When you are struggling and you are feeling dumb (you may from time to time), always remember that many (probably most) other new and, even experienced, programmers around the world are probably feeling the same way.

It is difficult in the beginning when you are learning to code for the first time, especially if you are pass your teenage years. Teenagers have no fear and nothing to lose, and much time to waste use on whatever they are passionate about. So challenges may appear as only brief roadblocks to them.

But after your teenager years, you want results fast because you don’t have sufficient time to kill on figuring out seemingly trivial matters for many, many hours. But this is where you have to dig in deep and don’t get frustrated; just carry on and stick with the task or finding the bug until you figure it out, for a worthwhile reward is awaiting you when you triumph in the end—programming is fun and lucrative.

The joy and intense pleasure one gets from building an application is an awesome feeling that must be experienced to be understood. Even more satisfying, however, is the empowerment you experience when you realize you have attained the skill and knowledge to build applications from scratch.

There will come the moment when you realize that all the difficulty you endured was well worth it, because you became a programmer and you know your future is very bright as a JavaScript developer. Just like the thousands upon thousands before you: You survived the toughest bugs, you survived giving in and giving up, and you triumphed over finding many excuses to quit.

Feel free to share your links with us when you build something, even if it is a tiny, itsy-bitsy project :)

Thanks for your time; please come back soon. Email me here: javascriptissexy at gmail email, or use the contact form.

531 Comments

  1. April J

    Excellent! I am just starting to learn javascript and getting a good outline like this is perfect! Thanks!

  2. Eduardo

    I’m also trying to learn Javascript, and I know that sometimes it’s difficult to impose oneself a discipline to learn a new language. Because of this, I appreciate your advices. Thanks!.

  3. Richard Bovell

    You are welcome, April and Eduardo.

    Note that I have just updated the post above with the jQuery course on Code Academy, which I mistakenly forgot to add.

  4. Jatin

    Angular also!

  5. Jeff

    This is fantastic!! I started with week 1 just yesterday! I would always get into codeacademy and would either get stuck or stop…this is a great roadmap that is easy to follow.

    Any advice for a server side language, such as PHP?

    • Richard Bovell

      Jeff, I am happy to hear you have started learning JavaScript. Congratulations, you will be very happy you did, because you can do a lot, just about everything, with JavaScript nowadays.

      As for a server-side language, the hot languages for startups and modern web applications are Rails, Python, and Scala (for larger web apps). But, with your JavaScript skills, you can use Node.js or Meteor.js (the future for web application development), and you need not learn a new programming language.

      And it is worth noting that Meteor.js and Node.js are two of the fastest growing server-side frameworks today. So, if I had to tell you to learn one server-side language, I would say learn JavaScript very well, enough that you can use it skillfully to make any web application. Then learn Meteor.js and or Node.js and you would be preparing yourself for future web application development.

      Having said that, it is always good to know at least one server-side language, and you cannot go wrong with Python or Rails, especially Rails.

      • Serge

        Hi Richard,

        I finished the web fundamentals course on Codeacademy and started JavaScript track, but I’m gonna switch to your course because it’s definitelly true that everything seems easy on Codeacademy but not so much when you try it on your own!

        Just a short question, is there any special reason why you suggest Rails over Python (i guess we are talking about Django framework here)? Is it because of the better library or it’s just your personal preference? People say Python is more similar to natural language and thus easier to master.

  6. Jeff

    Thanks for the reply!! I had learned enough PHP and Javascript to slap together a site, but perhaps as I work through this I can rewrite my little project using node instead. Thanks again for the awesome roadmap! Already most of the way through chapter 3 and looking forward to getting back into codecademy.

  7. Andrew

    Hi Richard,

    do you have any suggestions for web application projects we should be attempting in week 4?

    • Richard Bovell

      Andrew,

      That is very good question, and I did ponder adding a web project to accompany the advanced chapters in the two JS books. But because I had not done the proper research to find the ideal project for the advanced chapters, I did not add a project to the post.

      I will do the proper research over the next 2-3 days and update the post above with a web project for week 4.

  8. Be very interested in a post on angular.

  9. Julio

    Thank you for the post. It would be interesting if you cover ember.js also

  10. Michael

    I’d really appreciate an Angular.js tutorial. I’m trying to pick a “goto” javascript framework (yes, I know one tool doesn’t fit every job but it’s nice to have one you know well enough to prototype apps) and Angular is looking good, except I have no idea how to manipulate the DOM, and since it’s new there aren’t many resources.

    So yeah +1 for angular

    • Richard Bovell

      Colin and Michael, I will likely add a post on Angular.js in about 3 – 5 weeks, sometime after I add the Node.js and Backbone.js posts, amongst other.

      Julio, I am not sure about ember.js yet, but with enough requests, I will add it down the road.

  11. Ameen

    I’ve been trying to get to be able to write production level JS code. I’ve played around with JavaScript for a while but haven’t really used it for anything other than simple programs similar to the ones at Codecademy.

    I’m looking to venture into building Web Apps, and this could really help. Thanks :)

  12. So one has to read the whole book? That’s how one usually does it anyway.

  13. tuan anh

    that’s great article. I’ve just started Javascript yesterday :D

  14. Vaishali

    Finally, some guidance! I was hopelessly jumping from one book review to another and now I see hope!! :D

  15. RyanF

    Thank You so much!!

  16. Mark

    Looking forward to working through this and Backbone!

  17. Bwaxxlo

    Have you ever taken a look on CodeAvengers.com. I stopped learning JS on codecademy after realizing I was making little improvement. I learned Java back in college, so I had little experience with coding and most syntax used in programming languages (that’s not to say the two are similar but some thought process is common in different languages). Avengers was more thorough and forced you to work on tasks as opposed to academy’s way of chewing things for you. Plus, it was very easy for me after a week to be able to use my coding experience to build a simple website that, say, asks you for 2 numbers and gives you the sum and/or product. Learning on academy feels very different to applying JS on html. It doesn’t even tell you how to nest your script on HTML code.

  18. Anyone complete this track? How many hours each week did you spend at it?

  19. Mark

    Took delivery of the first book today… its massive! Looking forward to getting stuck in. Thanks for your guidance.

  20. Wilson van Heugten

    Thanks for posting this helpfull guide:-)
    For your information, the URL to the Javascript track at Codecademy you use in your article points to a newer version of this track. The URL to the track you are reffering to is http://www.codecademy.com/tracks/javascript-original

  21. I just want to mention I am beginner to blogs and truly liked you’re web-site. Likely I’m want to bookmark your blog . You certainly have incredible articles and reviews. Thanks for sharing with us your website page.

  22. Sean

    Woww, awesome, please keep up the good tutorials on javascript… Thanks so much!!!

  23. Boaz

    Hi ther Richard Bovell.
    First of all i wanted to thank you cuase i got stucked while ago and now things getting real good!
    but i see now that your post is not a to the date with the code academy site i spouse they changed the site (the are no further section then 8) so if you can post a new guide using the code academy it will be very appricited!!!
    and agian thanks!

  24. Rameş Aliyev

    Thank you a lot Richard, I’m in JavaScript world about 3-4 year, but i fell something missing in my knowledge and this program will fix it :)

  25. Tom Phillips

    Hello Richard-

    Just wanted to confirm that this book is indeed appropriate for the beginner w/o a background in programming. Many of the reviews warn beginners that this book isn’t for beginners so I’m a bit concerned.

    Cheers!

    • @Tom Phillips

      Excellent question. I went and took this directly from the book:
      ________________________________
      WHO THIS BOOK IS FOR
      This book is aimed at three groups of readers:
      ➤ Experienced developers familiar with object-oriented programming who are looking to learn JavaScript as it relates to traditional OO languages such as Java and C++.
      ➤ Web application developers attempting to enhance the usability of their web sites and web applications.
      ➤ Novice JavaScript developers aiming to better understand the language.
      ________________________________

      But since you are using Codecademy along with the book, and taking in to account the manner in which I setup the course outline, I believe you will make it through the course, though you should go at a much slower pace.

      Codecademy will be very helpful for you (you needn’t have any programming background), and definitely read the corresponding chapters in the book so that you can better understand what you are learning on Codecademy.

      • Tom Phillips

        Great. I’m going for it. I’ve been doing the JavaScript track on CodeAcademy already and have had great success with the general syntax. Sometimes I’m getting bogged down on the logic side of things. Hopefully the book will better shed light on why and how to structure my code.

  26. I just want to say I am all new to blogging and site-building and definitely loved you’re website. Almost certainly I’m going to bookmark your site . You absolutely have tremendous articles. Regards for sharing your web page.

  27. Matt

    Do you have any thoughts on the book Eloquent Javascript? I have heard it recommended quite often for beginners, plus the web version is free.

    • I actually tried Eloquent JavaScript when I was learning JavaScript a while ago, but I did not find it as thorough and as instructive as I needed it to be, to teach me JavaScript properly. So I didn’t use it it much and I went ahead and buy the 2 books I noted in the post.

      • Anthony

        I didn’t jive with that book as well, in fact the Wrox book is a good read, I like his approach and style, Zakas is a guru!

  28. Mack

    Challenge accepted!

  29. Felix

    The Main problem i have had when learning to code is not having a complete roadmap to follow. Its so annoying, and i have just been dumping money everywhere.

    This is an exciting solution because no matter how abstract the concept i am leatrning may be at a particular time, i am confident that if i go through it, i will be able to build something at the end. That and as the Javascript language has been the most friendly to me over the past 3 months(and i have tried ruby and python).

    I’ll complete this course and report black; in fact i might even run a live blog about it.

    Thanks again for creating it
    Felix

  30. flo

    Thanks a lot for providing this guidance. It’s really super-helpful if someone picks a selection of resources among the vast amount of what’s out there.

    I just started this course by taking the ‘Web Fundamentals’ track on Codeacademy, and it seems they have changed the structure a bit. There are no chapters 7 and 8 on JavaScript anymore in this track. So you might want to check your course elements that involve Codeacademy tracks and chapters.

    Also, I was really surprised to see that the tracks and lessons on Codeacademy are actually free (they are, aren’t they?). Maybe include this explicitly in your course outline, so that people won’t be put off by thinking they would have to pay for it.

  31. Try throwing in a spaced repetition program such as [Anki] to help you retain your knowledge. The problem is syntax and retention and if you use those flash cards that you create you’ll be well on your way on the path to mastery!

    Check these links out:
    Want to Remember Everything You’ll Ever Learn? Surrender to This Algorithm

    The 20 rules of formulating knowledge in learning

    Using spaced repetition systems to learn and retain technical knowledge.

    Good luck!!

    • Anthony

      Thanks for the links, that’s my problem, remembering the syntax.
      I code in js, ruby, python and php as well as playing with BackboneJS and friends, so remember the syntax is a problem

  32. Anyone wanting to learn JavaScript should definitely give http://codeavengers.com ago. It is much more fun and effective for beginners than CodeCademy.

    CodeCademy is good… but CodeAvengers is better.

  33. Peter T

    Hi Richard,
    Thanks for sharing this. In your opinion would it be ok to buy the JavaScript ebooks and learn off the Kindle?
    My initial thoughts were the screen is quite small and might be a pain having to flick back and forth as you tend to do with a large technical book. What do you think?

    • @Peter T
      I used to prefer reading from PDF eBooks, until I got my iPad and quickly learned that no matter the subject matter, it is a pleasurable, engrossing experience reading on the iPad. So I buy all my books for the iPad nowadays. Making notes, adding bookmarks, and searching the book are super easy compared with reading a paper book or PDF book.

      And I suspect the experience is similar on the Kindle. So, if the Kindle is your preferred reading device, you should get the books for the Kindle.

  34. Wow – thanks for this awesome post!

    I did something similar for Ruby & Rails (http://astonj.com/tech/best-way-to-learn-ruby-rails/) and have been looking for something similar for JS for ages!

    I will let you know how I get on :)

  35. Matthew

    Hey Richard,

    Thanks for this post. This is exactly what I needed. I have absolutely no programming background but am now getting more and more comfortable with the language.

    I wanted to reach out to get some tips on applying all this material in the reading b/c 1,000+ pages is A LOT of reading. I’ve followed your instructions to practice on Codecademy. My experience with Codecademy has been inconsistent — some of their lessons are great but others not so much.

    With all the reading, there are a lot of concepts that aren’t really sinking in. What other ways would you suggest that I get these concepts soaked in and apply my learning. I have been supplementing your track with youtube videos on concepts I don’t fully grasp. Should I just start building my idea now or wait till weeks 5 & 6?

    Thanks!

    • @Matthew and others who are having trouble with this roadmap.

      I do realize the roadmap is not ideal (it could be a lot better) for beginners, and it is not streamlined for people who already have some programming experience.

      To fix this problem and to make the instructions more tailored, I will create two separate roadmaps: one for beginners and one for experienced programmers. And I will create an eBook to help both groups.

      In a few days (within a week), I will create the new roadmap for beginners. Stay tuned.

      • Matthew

        Thanks Richard!

        Looking forward to the new roadmap.

      • Wow, thanks man. This is great. I am starting this roadmap ASAP. I have already been on Code Academy and Treehouse, but this is such a detailed and intentional roadmap. I think it will work well for me. I am looking forward to the beginners road map.

    • @Matthew

      Definitely start building your project or building small projects ON YOUR OWN (not in Codecademy) as soon as you can. Do this from day 2.

      And signup for an account on Stack Overflow and ask questions there when you are stuck.

  36. I just started with your suggestions on learning JavaScript. I’ve been trying to learn for a few months using codeacademy and tutorials in the net. This is the first time I’m going to follow a book. Hope it helps.

  37. Pedro

    Excellent post. I’m learning Javascript during the last month with the Team Tree House Course and with the book Eloquent Javascript, but I think that I’m now in a good level. Do you recommend to start from scratch and follow this guide? Now I’m starting with jQuery and with backbone

    What do you think about the book Eloquent Javacript?

    thanks.

  38. Sandy

    Thanks for this wonderful article. Will learn it in my forth coming holidays.

  39. Arun

    It seems Codeacdemy has changed it’s track structure. Javascript fundamentals doesnt have anything like Chapter 11 and 12. Chapter 8th is the last one.
    You are referring to http://www.codecademy.com/tracks/javascript , right?

    • Thanks, Arun, I will update the article in a few days to reflect the Codecademy changes. I have to make two new roadmaps, as I have noted above; one for absolute beginners and one for programmers with some experience.

  40. Excellent article, great information.

  41. Do you suggest typing out all of the code examples in Professional JavaScript for Web Developers?

    • Andre Lashley

      I’ve tried this approach to learning a language before and I find that it hinders the process more than anything. You get caught up in syntactical details instead of seeing the big picture the author is trying to convey.

      My personal recommendation is to read the chapters, and then think of a feature that each thing you read about can be used for in the context of a larger application. Alternatively, if you still want to type out the examples, maybe use a see, copy, do approach where you read the chapter once, copy the examples, and then use them in your own app. This takes a fair bit longer though!

      Maybe Richard has some other ideas on how to get the most out of the reading material.

  42. Thanks for the challenge! I’v been flirting with JS for ages but never found it never stuck I even ticked of all three of your starter ‘not to’, made me laugh.

    I’v been doing a 9 week online course ‘Introduction to Databases’ and the more formal structure has made it far more beneficial than lots of little blog post opinions scattered all over the web. So really looking forward to your path as well.

    Just got the books through as well, was a heavy box. Feel like I got good value, just may take a while :)

  43. Acami

    Great article. It will be helpful is we can get links or ideas about a project..

    Thanks

  44. Richard, you’ve put together an amazing resource here. So, thank you for that.

    I’m very excited to follow the more regimented program that you’ve offered here. I don’t want to take too much of your time here. However, I was wondering if you’d answer a few very short questions for me and your audience:

    1. Aside from learning from tutorials, scattered knowledge in books, etc… what is the most common mistake novice programmers make when learning Javascript?

    2. Do you know of anyone who struggled with programming, but learned JS (or another language) regardless of their ineptitude? If so, what about their approach was effective in your opinion?

    3. After completing your course, what type of application could a student build to impress potential employers – showing off their JS proficiency?

    • Great questions John. I am looking forward to the answers. Thanks for a great blog Richard. It will be essential to my further education as a developer.

    • @John
      I answered all of your questions. Look at the bottom of this post (above the comments), I added a section called: Frequently Asked Questions and Answers.

      @Seth
      See my answers to John’s questions in the FAQ.

      • Thank you SO much, Richard. GREAT tips there. Going to get started this week! I’ll make sure to document the process on my blog and link back here!

  45. Great article.

    I always learned javascript / jQuery just enough to solve any problems I had and never bothered to learn it properly.

    Resources on this post seems like a good way to do it.

  46. Ab

    Thanks for this great post. I’m just wondering when the announced “master in 1 week” blog post will come. Any news on that?

  47. William

    Richard, What are your thoughts regarding Derby.js?

    http://derbyjs.com/

  48. Peter

    Thanks so much for that posting/roadmap. Really love the approach.
    One thing I would find great is small projects to work on while moving along.

    Somewhat the courses all are somewhat decent explaining a if/then statement but more help for practical applications/small projects would be awesome.

  49. Acami

    Waiting for the post updated ..

    • Andy

      1. You posted this early.
      2. “after 7pm PST” means some time after that time. It does not mean right at that time.
      3. Most importantly, don’t whine.

    • It is my fault. I was too optimistic with the time estimate. I know a lot of readers are waiting eagerly for the update. I am hopeful the post will be helpful.

      I will upload the absolute beginner update shortly (about 1-1/2 hour from now). With the advanced and experienced programmers posts to follow a few hours after that.

      To everyone waiting eagerly: I am sorry about the delay. Drink a cup of tea or coffee and watch some Oscars and come back in about 2 hours :). It will be ready for sure by then. Or read chapter 1 of “JavaScript, The Definitive Guide” in the mean time.

  50. aarsh

    Hey Richard have you tried out sublime text 2? I personally use this one because if its vast features

  51. Ben S

    Thanks so much for this, Richard. I am an entry-level .Net developer who learned mostly all I have on my own, and from my programmer brother who informally tutored me. So I have some know-how, but am not there yet. Considering how important JavaScript is to know for a .Net guy, I was glad to find your course and started the first iteration of it (that was just replaced with this new format). I was about 2 weeks in. Any advice on where I should go in this new format? Thanks!

    • I suspect there are quite a few who are in the same position as you. I will add a section to the roadmap about this tonight.

      • Jeff

        I am also about two weeks in. I had been going back and reading the first chapters of The Definitive Guide anyways. So I plan to keep with that (which sort of jives with the new roadmap). In addition, I was going to finish up the codecademy from the first two weeks of the original roadmap then do step 4, 5, and 6 for weeks 3 and 4 on the new roadmap. That should get me to the project point. I will probably start the project now anyways, even before I get to the jQuery part of the roadmap….just to start noodling around with something of my own.

        • Sounds good, Jeff. Since you have the “JavaScript: The Definitive Guide” book, it is easy to transition indeed, and this new track a lot easier and more effective. The old one had too many unimportant chapters from the other tougher book.

    • Ben,
      I was just about to add some notes for you, but then I remember the old track had the “JavaScript: The Definitive Guide” book, too, so it is very easy to transition to this new track. This new track is actually a lot easier (and more effective, I imagine) than the old one.

      Do you have “JavaScript: The Definitive Guide”?

  52. John O

    In Week 1 and 2 of this course steps 4, 6 and 8 are conflicting unless you mean to redo the track over and over? Would you be able to clarify this please? Or are they referring to a different track?

  53. Sean

    Hey Richard, I was in the middle of learning javascript from your old post reading Nicholas Zakas Professional Javasscript etc… I think it has tremendously helped me… Now should I keep reading that and still go along with this new revise post… ????? thanks

  54. Sean

    Quick Update – Even tho Nicholas Zackas is a bit confusing at times, he does break down each concept that i do understand… I actually purchased the book, so re reading this post assumes I will have to buy The Defenitive Guide Book and start from scratch????? thanks

  55. jesus miguel

    The last year I restart to learn JavaScript and I found Object-Oriented JavaScript very useful. For me, it’s more easy to understand some concepts like variables scope with that book that with “JavaScript: The Definitive Guide”.

    Thank you for your work creating a roadmap to learn JavaScript.

    • Hi Jesus,
      I promptly added back the Professional JS for Web Developers book yesterday, after many readers requested it. So you can use **either** book now. Ever time I referenced one of the books I referenced the other.

  56. Anthony

    I thought I was losing my mind ( I could have sworn, I was suppose to read the Wrox book first)

    • @Ben S, @Sean, @jesus miguel, @Anthony, and others who have purchased the “Professional JavaScript for Web Developers” book or otherwise stared the old track, I just updated the post with complete coverage for the Professional JavaScript book. This updated roadmap is more streamlined and better than the old one.

      I noted which chapters of this book you should read in each section. Now you can follow the entire course with either book.

      “Professional JavaScript” is still my preference, but it is best read if you have at least a bit of web dev experience, while the other book is better for first-time programmers.

      • Anthony

        Richard,

        I would like to thank you for all your hard work, this site is a great resource. The backbone, JavaScript tutorials look great as well as all the other material on this site.
        Great job bud!!

      • jesus miguel

        Nice to you to update the roadmap with “Professional JavaScript for Web Developers” I think that people who started to learn JS some time ago and is now, as me, trying to learn in the proper way could find this very useful.
        For these people I think that Object-Oriented JavaScript by Stoyan Stefanov is also a good lecture.

        Thank you to help us to become JS ninjas.

  57. skyler

    I just started this about a week ago, i’m already on week two and now its all changed T_T, now i’m just confused

    • Hello Skyler,
      First, I apologize for the change that was indeed disruptive for some readers, for a day. But I promptly added back the Professional JS for Web Developers book yesterday, after many readers requested it. So you can use either book now. Ever time I referenced one of the books I reference the other.

      In addition, you can follow this new roadmap with a seamless transition from the old one (no disruption). The new roadmap is much better than the previous one, because the previous one had too much unnecessary technical reading and a few other shortcomings, which I fixed and improved in this new track.

      • skyler

        Thanks for the quick reply. I appreciate the effort in bringing back the Professional JS for Web Developers book.

        After I first saw the update, some of the steps that I had already been working on got removed and I was a little confused as to whether I should continue on with the old course or transition to the new course.

        I guess it was just a bit of a shock : ]. I’ve taken the time to re-examine the new course and I’ve figured out how I can transition from the old to the new.

        The new refined course actually does look a lot better, and more strait-forward. Thanks for keeping this up to date, and thanks for this great course!

  58. Amaury

    After someone learn Javascript in what order should he/she learn these technologies:
    > Node.js

    > Knockout.js
    > Backbone.js

    > JQUERY
    > Coffescript

    > TypeScript
    > Bootstrap

    Thanks

    • Amaury,
      I answered this question on the Backbone.js post. here is my response:

      First, if you follow the Learn JS Properly course, you will see that you will learn jQuery at the same time as you are learning JS.

      1. I recommend you learn JS properly (it includes jQuery), then read the “Effective JavaScript” book (it is one of the books I recommend in the Advanced JS roadmap). And it is easy to read: it is comprised of 68 excellent JS tips.

      2. Then learn Twitter Bootstrap.

      3. Now, it is very tricky to recommend a JS framework, because there are so many good ones to choose from and they are as similar as they are different. For now, I would say learn Backbone.js, because it is relatively easy to use, it is lightweight (not a big behemoth), there are many Backbone.js resources, and it is the most popular. No need to learn knockout.js plus backbone.js.

      4. Then learn Node.js, and you are good to go. You can skip the rest, they are not necessary; most are alternatives to what you would have learned already.

  59. aarsh

    Hey Richard, I have trouble learning client side javascript. There are so many things you need to memorize and its really difficult to do so. Do you have any tips that can help me enhance my knowledge on this specific topic. Thanks

    • Aarsh, you don’t have to memorize all the technical stuff. As long as you know how to use the concepts and you can program, you can Google or keep a JS book next to your computer. The best programmers don’t waste time memorizing the endless stream of technical details.

      Learn JS properly, then learn Backbone.js, then you are good to go. Give yourself 6 – 8 weeks, and stick to it. Don’t quit.

  60. Vic

    First, my thanks for this guide to thorough learning of Javascript. It looks very well thought out, and the fact that you’re revising and improving it as the materials you refer to change and users give their comments means it will be valuable to many people for a long time to come.

    My knowledge of Javascript and other web languages is very limited (at present), so I have one question: If I want to get content from a server-side MySQL database, then it seems to me that I can’t use client-side Javascript. Is that correct? and if so, is there a way round this, or do I have to use something like PHP for the parts of a web page that depend on database access?

  61. Ernesto

    Hello,
    I am excited about just starting out on this course track, though I have yet to purchase the books. I however have had a chance to peruse the opening chapters of both of them. Although I do not have a web development background, I must admit I like the presentation and the style of Zakas slightly more than that of the Definitive Guide from what I’ve initially seen. Would the difference between the two have an significant effect later on in if I went with Professional JS despite my background? Many thanks.

  62. Rashid

    I was wondering if javascript object orientated is easy to learn and use in the real web applications? Do you use object orientation in your web apps? Thanks…

  63. Richard, thanks so much for your awesome roadmap. It really helps.

    As a sort of a thank you gift, I would like to share a tutorial on how to integrate WebStorm, SmartGit, and bitbucket to check all exercise files into a Git repo (in this example, bitbucket.org).

    http://2oahu.com/blog/bitbucket-webstorm-javascript/

    Instead of studying js, I spent most of my free time today writing this up. Hope it helps.

    Thank you!

  64. Robert

    Hello,

    Many thanks for these awesome guidelines. I really want to learn Javascript, although I am a beginner. I have only HTML and CSS knowledge and I guess Javascript will be helpful in the future.

    A couple of weeks ago I found out about Codecademy, I did a few tasks on Javascript but what can I say, I didn’t like their process of learning.

    I am in my early 20s and as you said, sometimes frustration may be present. However, I am really eager to learn this and if you have the right resources you can do it easily, in my opinion.

    Hopefully in 2-3 months I will be able to create my own stuff and have a good knowledge of Javascript. I also took Javascript The Definitive Guide, as you recommended for beginners.

  65. Hey Richard,

    Can you tell us more of what WebStorm offers that makes it better that ST2? I have been using the trail but I am not sure what features to look for and there is a slight learning curve, considering I am so used to ST2 and my work flow is so integrated with ST2.

    Thanks.

    • Seth,
      I really should write a blog post comparing the two, because this requires a thorough review. Nonetheless, if you are already very comfortable with Sublime Text 2, you should keep using it for now.

      Later, when you are ready to develop complex JavaScript web applications, you will have outgrown Sublime Text 2 and that would be a good time to look into WebStorm.

      Indeed, there is a moderate learning curve for WebStorm, but it is similar to using Sublime Text 2, except it has many more specific JavaScript features and integration with JavaScript libraries and frameworks, including Node.js, CoffeeScript, jQuery, and a lot more.

      • Thanks for the feedback. I hear what you are saying.

        I will keep trying WS during the trial and go from there.

        A comparison post and an in depth look into the benefits of WS would be good content for your blog,

      • Domen

        It would really help if you made an article about WebStorm. I need someone to tell me about features, so I have a solid reason to pay for it. Maybe include in article some extra links about using the program.

  66. Burak

    Thanks for this creating this guide, It’s really helpful track for non-programmers.

    But I find it tedious to study over trivial parts, such as chapter 4, I mean do I really need to read beforehand how “+” operator works, isn’t that obvious how it works?

  67. Jonathan Kempf

    Richard,
    Thank you so much for this tutorial on learning JS. As a designer, I found myself using jQuery widgets a lot on webpages, but I always wanted to learn JS properly.

    Now I am on week 3-4 and starting to grasp Objects, but I have run into a problem regarding the ‘hacking’ away part of the lesson: Most everything that I think of doing to practice with JS has already been solved by either jQuery UI or CSS3, and I can’t really think of any good exercises that I could experiment with to further develop my skills. Do you have a resource that could give me some practical problems so that I can practice solving them? I’m not looking for a Codeacademy-type hand holding, but left to my own devices, I can’t think of any good problems that I can solve at this level of skill.

    Thanks again!

    • HI Jonathan,

      I think you should build the quiz application I noted in the post above. It will help you develop a complete JavaScript web application that starts off simple and gets increasingly more advanced. See the details in the post above.

      BTW, I am sorry about the late reply to your post. I don’t know how I missed your comment. I have only now stumbled upon it.

  68. I am working through this track slowly but surely. Things are starting to fall into place. I am also building my first web app with Meteor as I go (I need to apply while I learn, if I just read, I will not grasp anything and will probably fall asleep). So I am learning JS, JS programming and the Meteor framework at the same time. I will get there, I will get there, I will get there.

  69. Robert

    Is this a typo in the section for weeks 3 & 4? Where is the “Prototype Pattern” material located? Thanks.

    can read up to “Prototype Pattern.” The other object patterns are quite dense for you at this juncture and they are not necessary for you to know now.

  70. i just wanted to say thank you, before reading your blog post i didnt have a road map to follow in order to learn javascript, i also got stuckevery time on codeacademy javascript challenges, by now its been almost a month since i started reading the books and following the roadmap…..im so exited because today with the knowladge in javascript and using jquery i made the challenge of make my own dynamic quiz application and it feels so good to know im improving!!!!!!…im so looking forward to keep improving and improve the quiz as it follows!!!!!

  71. Thank you for the great tutorial guide, so helpful for beginner like me who don’t know where to start learning Javascript. I got the book, now I’m ready to learn properly :)

  72. Thanks for the brilliant post. I’d just like to ask you one thing before I dive headfirst into this. Could you consider another link than Amazon? O’Reilly might be a good alternative or at least an option. They’re a very progressive publisher leading a lot of modern trends. Plus they’re in support of a more open web not limiting their eBook downloads to a proprietary format. Of course if you’re going to do all the work to write this I wouldn’t mind supporting you.

    http://oreilly.com/affiliates/

    Again, great work. Thanks.

  73. Hi, I was just wondering if this is still relevant or not. I’m always concerned about stuff being outdated. Also, I’ve programmed in C and some Java. Should I go with “Javascript for Web Developers”?

    Thanks so much for all this info, it is exactly what I’ve been looking for.
    Can one get a job after going through all of this?
    I’m was a ruby guy but man I’m loving javascript so much.

    • @Franklin
      This blog post is very new; it was originally written about 5 months and it was updated just 2 months ago.

      Yes, get Professional JavaScript for Web Developers (3rd Edition)

      You can definitely get a great job once you have learned JavaScript properly (including jQuery) and then learn Backbone.js. Front-end developers are in great demand right now.

      All the best with your studying and coding.

  74. Very thorough and wonderful resource. I’ve been sharing this link. Thanks for taking the time to do this!

  75. Linda Gausman

    Richard, I’m using the Professional JavaScript for Web Developers guide. In week 4, you ask us to read chapter 19 of JavaScript: The Definitive Guide for the JQuery chapter. Is there another resource that covers this or do we need to purchase a second book?

  76. Dragan

    Greetings from Bosnia,
    thank you for doing this, it is very helpful for beginners like me, I have a question. I want to learn javascript but also C #, which language is better to start, thanks again :)

  77. Lars Finsen

    “Don’t use Safari”? Why not exactly?

  78. Antonis

    Hi Richard, congrats for your excellent work. I am currently on week 4 and I am a little confused about the “Javascript or jQuery” subject and can’t figure out the right answer.

    Should someone has a very solid understanding of JS and only then move to jQuery, or he has to learn both parallel?

    As far as the quiz is concerned, should I write it in pure JS or jQuery?

    I really want to hear your opinion because you have real experience. My aim isn’t just to start coding and see quick results. I ‘d like to be able to use HTML/CSS/JS for a lot of uses, even for mobile apps for example. Not just some webpage effects etc…

    • @Antonis
      In hindsight, I think I should recommend jQuery (for DOM manipulation) for the first go at the quiz (and not pure JS), because everyone will be using jQuery afterwards anyway.

      So, no need to use pure JS for DOM manipulation in the first iteration of the quiz.

      However, if anyone wants to use pure JS, go for it; you will learn how to manipulate the DOM with JS, which is important to know as a JS developer, in case you ever have to do it without jQuery. And you will also understand how jQuery actually works. But it is not necessary to use pure JS for the DOM manipulation, if you can do it much easier and quicker with jQuery.

      • Yuichi

        Hello, I am beginner, I am learning with “Professional Javascript for Web Developers” book but I was wondering if real life developers(front-end) use everything covered in the steps often or necessary to know them? or some topics are rarely used?

        • No. No one uses everything from a programming book in real life, just like no one uses most of what he learns in school in real life. In the roadmap above, I recommended you skip many parts of the book. See the roadmap for more.

      • As I wrote to Sean below:
        Derek Sivers is the first to complete the quiz and post his code, you can checkout his code and learn from his efforts. Here is his code in pure JS:
        https://github.com/sivers/jsisquiz

  79. Mateusz

    Great roadmap!

    I am very aprecieted about all of you articles. It is like a good book, with growing level of complexity, very motivaiting and well structured.

    My javascript developer career will move on a fast track thanks to you :)

    Keep up the excelent work.
    I’ll be your faithful reader.

    Thanks!

  80. Sean

    Hey Richard, im a bit confused about the Quiz.. Im wondering how will i access the object in the array.. Im trying to access the array/object such as..
    allQuestions[0] or making acessing the property of that object/array such as allQuestions.question..

    Im guessin it would be a bit easier if i created three seperated objects or arrays such as below.. thanxx
    var allQuestions = {};
    var allAnswers ={};
    var Choices = {};

  81. Sean

    Never mind I figured it out :), to access a object inside an array as the Quiz stated, one would need to do the following:
    allQuestions[0].question; etc..

    what was confusing me , as well as getting errors, was the second choice array inside of this array.. i just took that second array out (choices) and i figured it out.. Richard was that a good idea to take that second array out?? thanks

    • @Sean, I am glad to hear about your progress and your struggles :) Welcome to the life of a programmer.

      Derek Sivers is the first to complete the quiz and post his code, you can checkout his code and learn from his efforts. Here is his code in pure JS:
      https://github.com/sivers/jsisquiz

      And the coolest part is that he will keep updating his code as he learn jQuery and other technologies. So keep an eye on the link.

  82. Josh Forbes

    I love the link to Derek Sivers quiz code. I just pushed another revision to my own quiz app so I am at a point where I am looking forward to sitting down and looking over his code to see how someone else approached the application.

    In the spirit of sharing, here is my code as well: https://github.com/joshdforbes/dynamicquiz

  83. Antonis

    I just finished the 1st version of my quiz in pure JS and wanna share with you guys! Here it is: http://jsfiddle.net/zryHu/ . I think that I have written some parts not with the best way, but the main purpose was to get it work!
    My code is heavily commented so maybe someone finds the help he/she needs!

  84. Acami

    Richard,

    From the book “Professional JavaScript for Web Developers.”,?
    which topics are the most important?

  85. I have to say that I am -incredibly- grateful for this post. I started a few weeks ago and I’m already feeling great after completing the first iteration of the quiz project, and I’m continually motivated to learn more and learn about JavaScript every single day. In just the last few weeks, I went from knowing next to nothing to actually building things and even learning CoffeeScript in the process. Thank you for the great post and helpful information!

    If anyone would like to see the quiz I’ve built, you can find it here:
    http://dylanribb.com/projects/javascript/jsquiz

    • Very well done, Dylan. I like the fade and the well organized structure of your UI.

      You should probably show the question number (1 of 10), so the user has an idea which question he is on and how many more questions to come.

    • Boaz

      Hey Dylan,
      first of all i saw the amazing quiz that you did
      and it looks great!
      can you please add some comments explaining what you did in each section of your code?
      it would be very helpful

      • Hi, Boaz.

        Thanks for the feedback. I’ve added some comments to make it easier to understand what’s happening and uploaded the new js file. :)

        Dylan

  86. sneha

    Outstanding guidance for those developers( like me ) who are new in javascript..

  87. Tim

    Awesome article mate…just what I needed to learn javascript

  88. Sean

    Hey whats up Richard, I finished my Justin Timberlake Quiz. Its Pure JS, it still needs some work, hopefully you’ll check it out.. http://seanshoats.com/jtquiz.html
    Im loving javascript.. my main goal is to build modern mobile apps & web apps using javascript and node.js etc….
    Hopefully my quiz can be some help to some guys who are stuck like I was lol….. thanks so much for this blog!!! Richard You Rock!! :)

    • You rock, Sean.
      Congrats, Bro. I am really inspired by you guys. Keep up the good work and keep making your quiz more advance as you learn more advance topics.

  89. Niraj

    I like it.It’s cool.

  90. javascript1618

    Thank you taking the time to provide guidance and clear direction. I have tried many times to become proficient in javascript. I am fortunate to now have a mentor. I stumbled upon your site looking for information on backbone.js
    In my area NYC surrounding the income compensation is worth the effort. Thank you for providing a clear path to achievement

  91. adam baker

    great post.

    I know this might be outside the focus of this website, but since it still is related to web development I would appreciate an article about “how to learn php properly”, especially since a lot of programmers learn it the wrong way.

    Anyhow, great article.

  92. Hey!

    Good job on the course so far. I just wanted to point out a little ‘bug’. I think that the link for web-storm description has changed from http://2oahu.com/blog/webstorm-javascript/ (doesn’t work) to http://2oahu.com/posts/2013/webstorm-javascript/. It’ s not that hard to find the correct one, but would be nice if you changed it here as well.

    • @Martins

      Hello, this is Paul running 2oahu.com.

      The ‘bug’ is actually my fault, not R. Bovell. When R. Bovell first wrote about my 2oahu.com blog, I was using WordPress and I kept everything under blog/. However I recently decided to ditch WordPress and went for Pelican and in the process switched around the urls. I did include html forwards in the new site for more popular pages but my deployment script for deploying the html files didn’t know about the html forwards.

      I’ve updated my deployment script to make sure the html forwarders are included.

      Sorry about that Richard.

  93. Peter

    Hi Richard,
    I’m trying to work through the tutorial and made it already to week 5-6. But I’m having a bit problems implementing the changes.
    Questions: Is there any possibility for code review? e.g. somebody looking through the code and suggesting how to do things “better”. Also, do you have any suggestions for keeping a better structure? I’m trying to stuff things into functions to keep somewhat the different effects seperated, but is there any recommended way of doing this?
    Thanks so much for this great roadmap!

  94. Its such as you read my mind! You appear to grasp so much about this, like you wrote the guide in it or something.
    I feel that you just can do with a few % to force the message home a bit, but other than that, this is excellent blog.
    A great read. I’ll certainly be back.

  95. Rasheed

    Great guide!

    I was wondering– what’s the difference between Ruby Mine and Webstorm? They are both by jetbrains but Ruby Mine seems to include a few more features than Webstorm.

    What would you recommend?

  96. Sean

    Hey Richard, I was wondering on my journey to learning javascript, should I also learn php/msql to create data driven as well as CMS web apps? Where a user has complete control in the backend (admin settings etc)…Or Should I learn node.js for this, I thought node.js is mainly for server side driven apps
    ( chat apps etc.) Thanks!

    • This is an interesting question, Sean. If you want to know (and you should) how to develop general websites, customize CMS and blogs, and the like, it makes sense to learn PHP/MySQL. Many huge web apps are built with PHP, so it is worth knowing. But you should still Node.js or at least Meteor.js.

  97. Vincent

    Hello !

    Thank you so much for this helpful post. I’m just wondering how many hours per week you had in mind in your estimate?

    Is it full-time study or more like 2,3h/day?

    I just would like to know the pace I’m about to face!

    Thanks again,
    – Vincent

  98. boaz

    Hey richard.
    First i want to thank you it is a great guide for learning JS.
    Now lets get to my problem :-)
    Im trying to build the first edition of the quz and im stuck for a long time.
    Basically i have done an object that looks like your array example.
    And i made an html basic file with h1 as a title qusetion
    A 4 li with radio buttons.
    And a next buttons.
    Just to note i all of rhe html tags are empty the only one who as value and attributes is the next button.
    And my simple thinking was for every qistion in allqustion object.is to show the first qusetion (position 0) and append it to h1 using jQuery.
    Next for every choice append chicice ( start with position 0) to li num1 after that go to the next li abd append the next choice. Untilthere are no li tags to fill.
    Now when the client click next i check the value of the radio if its not undfinded meaning it is not empty procced to next qustion by earsing the current h1 value and doing the same as i explained above for qusetion position 1.
    If the value of the choosen radio button is equals to the qusetion answer. Then correcAnswer get +1 to it.

    I think that the way i think of how to build this app is fine.
    I just cant seem to “translate” it to javascript code.
    I have read all the chapters agian from the js book and still im stuck.
    Is there any hope for me to learn JS?
    im really intresting in learning js/meteoe/node.js/backbone.js

  99. Jhon

    Do I also need to learn HTML5 and CSS3 apart from Javascript, Backbone, and Node.js?

    Thanks

  100. Hey Richard,
    Thanks for this informative post. I followed along with the reddit group and found it to be helpful to have a group to study along with.

    Someone told me to write about the process to better understand what I am learning. So my blog follows each week of your program, maybe it will help other people going through the program.

    More importantly, I would like to share the two live dynamic quizzes I have created. The first one in pure JS that I did and the second which utilizes jQuery: http://www.briandavishall.com/projects/

    You can find the code of those dynamic quizzes at my GitHub account:
    https://github.com/hallbd16

    Lastly, I would greatly appreciate anyone who would critique my code. What would you do differently and why? As a noob coder, I figure this is a critical step in learning.

    • Hi Brian,
      Thanks for your comment and for posting your code. I am sure both will help other JS developers who are also learning JS.

      I took a cursory look at your code and it looks good. As you look at others code later on in your dev career, you will learn a lot about how adv. developers code, but for now, keep learning and coding. As long as your projects are working as expected, you are doing fine.

      When you learn JS frameworks like Backbone.js, you will see how they better organized your code and make your entire code look very professional :)

  101. Boaz

    Well guys here is my quiz check it out and tell me what you think of my quiz:

    http://jsfiddle.net/boazmier/ru8Qj/5/embedded/result/

    • Hi Boaz,
      Sorry, man, I was inundated the last few weeks and only now I am able to respond properly.

      So it looks like you have overcame the trouble you were having and you completed your quiz. Good job.

      You quiz is pretty and slick :)
      Why is an answer already selected by default for each question?

  102. Owl

    Thanks for great article. it is one of the best on internet!

    Have a look at my progress with quiz:

    http://owlgraphic.com/quiz/

  103. Jay

    After completing the Javascript track at Codeacademy and realizing that, while I learned quite a bit, I still have no idea how to implement JS, I found your course, “How to Learn JavaScript Properly” using Javascript: The Definitive Guide (I have the other recommended book as well, but I figured I’d work through once with the beginner book and once with the more advanced). I am having some difficulty in determining how to enter the code and try it out using Firebug. Nothing that I can find seems to allow me to enter the code form the book, run it, and see how it works. I have tried looking up tutorials for firebug, but to no avail. Can you explain how to go about entering the code and testing it? Also, is it necessary to enter everything, beginning with chapter 1.1 core JavaScript?

    • Hi Jay,

      You have a few options for entering the code and running i:
      1. On Chrome. ,Safari, or Firefox, open the console.
      — On Chrome, at the very top of the window on your monitor: Select View > Developer > JavaScript Console.

      — On Firefox, at the very top of the window on your monitor: Select Tools > Web Developer > Web Console.

      — On Safari, at the very top of the window on your monitor: Select Develop > Show Error Console.

      When the console opens, you can type any JavaScript and click run or just press the enter key.
      If you want to type a line of code and add more code below that line, do Ctrl and Enter.

      Try it out, type:
      console.log (“Testing”);
      And press enter, you should see the word “Testing” shown right there in the console.

      2. You can use an online tool like JSFiddle or JsBin.
      — On http://jsfiddle.net/ simply type any JavaScript code in the box labeled “javaScript” and then press the Run button at t

      • Jay

        That helps…but what do you use Firebug for, then?

        • You don’t really need Firebug at all. Firebug allows you to view the HTML elements (the DOM) on the page and use the console for JavaScript and such, but Firefox has added all this functionality within the browser itself without the need to install Firebug plugin, so you don’t need Firebug anymore like you did a few years ago.

          I actually recommend you use Chrome, which does as much as Firebug did and a lot more.

          • Jay

            Ok. Thanks much. Last question (for now): Should I enter all code from the book, beginning with the first introduction to variables in section 1.1? If not where should I start?

  104. Jason

    Hi Richard,

    Thanks for helping us learn JavaScript! Quick question on the quiz. When it comes time to:
    — Store the quiz questions in an external JSON file.

    I’m stuck at this part. It seems most people use jquery .getJSON but when I try this it appears the rest of my script runs before getJSON callback completes.

    What are some recommended ways to import the quiz questions from a separate JSON file?

    Thanks!
    Jason

    • HI Jason,

      Post your code here and I will help you figure out the problem.

      Also, if you read some of the comments above, you will find links to the source code of other beginners’ completed quizzes. Take a look and see how some of them have solve the problem you are having.

      • Jason

        Hi Richard,

        I looked through the other quiz before posting. Most of them moved the quiz data into a second JavaScript file, then imported it using a second script tag in the HTML.

        For example, I saw many practice quiz do similar to:

        quiz-data.js
        arrayName = [{},{},{}]

        quiz.html

        Where the external data is really just another JavaScript file. This works but it is not much different than before.

        I was expecting to import the JSON as objects (not a variable or function) and from within my JavaScriprt.. Not from additional HTML script tags.

        I have my data formatted as an array of objects:
        quiz-data.json
        [{},{},{}]

        I tried to load the data using .getJSON, but it loaded it asynchronously after the rest of my JavaScript had finished running.

        I changed it to $.ajax and disabled async and this did the trick (until I can re-write my quiz in async style).

        My current function to import JSON.
        http://jsfiddle.net/EeYha/

        This works, and I’ve learned more about working with JSON data, but I’m still not sure how to do this if we didn’t use jQuery, or if there is an easier way.

        Thanks again.

        • Jason

          My practice quiz is here – http://jasonlong.com/startrek – Looking forward to using templates and backbone soon!

        • It was very resourceful of you to look for a solution that could work for you specific case, and this is standard practice in the life of a programmer. So you did the right thing.

          AJAX without jQuery is a bit tedious, and quite frankly, I don’t think I have ever seen anyone in last few years use AJAX without jQuery, except for demonstration purposes or to teach pure JS AJAX.

          I tried to load the data using .getJSON, but it loaded it asynchronously after the rest of my JavaScript had finished running.

          You can put your quiz inside a function (at least the part of the quiz to start the quiz), let’s say an init() function which will get the quiz started.

          And then you can call the init() function after the AJAX data loads asynchronously:

          
          // This is your code from the JSFiddle example you posted:
          function getQuestions() {
              $.ajax({
                url: 'js/quiz-data.json',
                async: false,
                dataType: 'json',
                success: function(data) {
          allQuestions = data;
          // Call init function here to start the quiz
          quiz.init();
                  
                }
              });
              return allQuestions;
            }
          

          alert(getQuestions());

  105. boaz

    Hi Richard,
    right now im trying to get my quiz app improved,
    and has you wrote we need to read chapters:
    Read chapters 10, 14, 17, and 20 of JavaScript: The Definitive Guide.
    Or read chapters 13, 20, and 23 of Professional JavaScript for Web Developers.

    and then to make an external JSON file for out questions.
    well those two books lack explanation on JSON, i didnt saw any reminder for the getJSON at those two books,
    so my question is do you have any other good source, that really take it deep with JSON?

    another question is:
    if we learn JSON, dont we need AJAX too?
    i mean those two are really going hand in hand..

    • so my question is do you have any other good source, that really take it deep with JSON?

      In the “Professional JavaScript for Web Developers” book, chapter 20 (JSON) is a very short chapter and it covers EVERYTHING you need to know about JSON to develop JavaScript web applications.

      if we learn JSON, dont we need AJAX too?
      i mean those two are really going hand in hand..

      JSON is a data structure that is used to transfer data to and from the server and to save data in an external source, such as a file or in localStorage in the browser. On the other hand, AJAX is a method for communicating with the server asynchronously.

      You can use JSON as the data format to transfer data while communicating with the server via an AJAX call. So you are correct that JSON and AJAX do go “hand in hand.” But you don’t have to know AJAX to use JSON, although you will eventually have to know both technologies to develop production-ready JavaScript web apps.

  106. Hi Richard,

    I have created my first jQuery plugin that allows users to create an image slider that is populated via content from Instagram. It supports both a hashtag search and a @username feed.

    You can find it here: http://christill89.github.io/instaslider/ or on github at https://github.com/christill89/instaslider

    I’d love to get your feedback on it!

    Thanks

    Chris

    • Chris,
      I just checked out your code, and I have to say I am impressed. Very good work, Mate. But the demo on your site doesn’t appear to be working. I am using Chrome.

      • Thank you very much!

        I know, the demo is hosted on my blog and good old godaddy has just gone down yesterday. It should be fixed over the weekend.

        Thanks

  107. boaz

    hey richard

  108. boaz

    Ok , i have finished my web quiz finally ( version 2).
    check it out here: http://boaz.comze.com/Quiz/index/index.html

    and now iv just finsihed reading your post on the final part of your post: OOP In JavaScript: What You NEED to Know.

    and i think i got it…the only thing i didnt understood is, why creating objects (from constructor function), and creating a child objects…
    beacuse i thought we need to save our questions in an external JSON file, and of course we cant make functions and so on in JSON.
    so do you wnat us to use OOP on our quiz JS file make it toJSON() or JSON.stringfy send it to the server and then retrive it??? isnt it an unnessecry duplication?
    im abit confuse and lost :(

  109. Jalil

    Do you think its worthwhile doing the advance projects on codeacademy as well?

    http://www.codecademy.com/tracks/projects

  110. ZenStunna

    Dear Richard,

    Thank you very much for you work in putting together this tutorial. I know that it wasn’t trivial and it’s been very helpful in my studies.

    Here is my first go at the quiz: http://jsfiddle.net/zenstunna/BJfZY/

    Also, if you are open to feedback, I think it would really help people to do the free Chrome DevTools course before starting. As a newbie, I didn’t understand your many references to the console and to writing code in the browser until I did that tutorial.

    Lastly, I think people should do the jQuery course before trying to finish the basic project (at least one required jQuery and I couldn’t do it). Perhaps the jQuery course should also come before reading about the DOM in the JS for Professionals book because I found the book to abstract until I had a visual of what the DOM was and how it could be manipulated.

    Thanks again. Rock on.

    • Hi ZenStunna,

      You made the quiz look very easy. Very good work, Mate.

      I agree with you about learning Dev Tools first, and I will add that bit to the post. Thanks.

      I also know that learning jQuery before building the quiz makes it much easier to develop the quiz, but the goal is to know pure JavaScript enough that you can use it to build a an app like the quiz. It is not essential or important that one use only JS, especially since most developers will use jQuery in their careers anyway. But the challenge of using JS will force you to learn JS well. And by the time you get to jQuery, jQuery will be a walk in the park.

      Much success to you in your dev career and thanks for the tips. Keep coding.

  111. mkaze

    Thank you so much for this blog!

    Could give any advice for app development in PhoneGap?
    What kind of JavaScript’s topics should I learn?

    Sorry for my bad English and Thanks again!

    • Well, I personally don’t have much experience with PhoneGap. Is there a reason you need PhoneGap in particular?

      • mkaze

        No, I want to develop apps for mobile and tablet devices. PhoneGap is cross-platform and easy to use, so I chose it.
        Do you have any suggestion instead of PhoneGap?

        Thanks in Advance!

        • I have heard good things about PhoneGap, but I haven’t used it. It is indeed one of the best bet for mobile JS web apps, based on what I have read.

          Besides PhoneGap, other technologies such as jQuery Mobile and even frameworks like Backbone.js (used along with responsive HTML/CSS frameworks like Bootstrap 3) are worthwhile technologies for mobile JS development.

          • mkaze

            Thank you so much, Mr. Bovell. I’m looking forward
            to your new posts, especially about mobile JS
            development related topics.Your posts are great. I have never seen like those before.

            P.S. I am not a native English speaker, so I’m so
            sorry about my poor English!

  112. Sandeep

    Hey Richard,

    Thanks for taking time to write such a brilliantly structured article on the JavaScript roadmap. Really appreciate your efforts!. Helped me a lot.

    I have read many more JS articles of your’s and they simply rock!.

  113. Boaz

    Hey Richard,
    i have a question:
    you write —
    — Keep a record of all the users who take the quiz and show each user how her score ranks amongst the scores from other quiz takers.

    my question is how to you suggest to do so?

    • Good question, Boaz.

      The only tough part is persisting the data (users who take the quiz along with their scores). The best way to do this is to use a database, in which case you will need to use MySQL or a NoSQL database like MongoDB (I recommend MongoDB).

      Steps:
      1. Before a user takes the quiz, present the user with a simple text field asking for his name or email. Then when the user completes the quiz, save his name/email along with his score to the database.

      2. And when you show the user his score, upon completion of the quiz, also show him the average score of other users—you can get this by fetching all the scores from the database and calculating the average. You can also show the highest and the lowest scores, so the user has an idea how his score compares with the best and worst scores. Again, you can get this data from the database.

      I will put together a MongoDB tutorial, but I don’t think I will complete it soon. I will likely add it to the book I am writing. But you can find some good MongoDB tutorials online, although I haven’t find any that was thorough enough. They were good enough to get started though.

  114. mkaze

    Hi Mr. Bovel. Do you have any suggestion(book or roadmap) for CSS, please? I am at week 4, and I have made the quiz and it works properly, but it isn’t look so good(because of lack of appearance).

    Sorry for my poor English.
    Thanks in Advance!

  115. John

    Hi! Wow! This looks like a fantastic resource, thanks for posting!
    I’m just not entirely sure which book I should get. When you say “at least a bit of programming or web development experience,” well I’ve taken and passed a couple of intro to programming classes on plain old Java and Pascal before that, and I can make a very basic web-page in HTML and alter CSS (though I’ve never written it myself). Does that qualify as at least a bit? I’m just not sure if that’s enough that I should get the not-a-complete-beginner book.

    Thank you so much!
    -John

    • HI John,

      You are definitely qualify as having some web dev experience, so get the Professional JS book. You will be fine because I actually explain nearly ALL the important JavaScript concepts on my blog, so you can always just read some of the blog posts, if there are some concepts that you don’t follow in the book.

  116. tyler

    I completed a basic quiz #1 using Angular.

    Here’s the code for the ng-curious:

    https://github.com/TylerCuster/quiz-quiz

    • Tyler,
      Thanks a lot for posting your Angular.js quiz. It is very interesting to see your quiz and compare it with the others—considerably less code to begin with.

      I would encourage other JS newbie developers to look at your code and go learn a bit of Angular.js to get a feel for what it is like to develop with a popular JS framework.

  117. Subbu

    Really a wonderful post.. Though I am a web developer and using javascript in my projects, I haven’t learnt javascript using any books. After reading your blog I think it’s time to get a book and learn javascript progressively and completely. I’m going to start suggested learning plan.. thanks a lot:)
    Subbu

  118. Grzegorz

    Looks like a solid learning path, thanks for posting this!
    Hopefully in 2 months I’m gonna be on the right track to take a step forward with my front end career.

    Did you received any mails with succes stories from people who completed this roadmap?

    • Hey Grzegorz!….. if you are looking for a succes story i can tell you that i was in my way to learn javascript to be a Front End Devoloper. 9 months ago I finished my studies as an artist in the university and i decided to start programming because i love the web, i took the roadmap in this Blog and almost 5 months ago i found job as frond en developer in this digital agency http://www.enigmind.com . I didnt sent and and email to Richard but a post a comment beeing so greertfully because of this great path to learn Javascript. Right now im not the greatets Front End developer, i still have too much to learn but if it wasnt for this path i will be probbably still looking for a job. Sorry for my bad english but this is not my main lenguage. Cheers.

    • If you read many of the comments above, you will see that many readers have been learning JS and developing the quiz application and improving their web-dev skills along the way. And I imagine they will eventually be world-class JS developers :)

  119. Regarding :
    “Very Important: Every example code you encounter in the book, type it out and test it and tweak it (experiment with it) in Firefox’s or Chrome’s browser console.”

    Even the code in The Definitive Guide Preface chapters, like the “Loan calculator”?

    Hopefully you can clear this up?

    Cheers,

    Egbert

  120. Thanks so much for this! What a great resource! I was struggling figuring out how to teach myself so having something to follow makes it much easier.

    In addition to CodeCademy, I am using Code Avengers. I think it’s a better resource with CodeCademy in that a) it makes you do more of the work and b) it has better help resources if you get stuck.

    I am also using JSBin to test my code because I like that you can turn off the sections you don’t need at the moment which gives more space to see your code on a smaller screen. It also gives you tips if there is something wrong with your code.

    I’m tracking my progress here: http://codeontheroad.wordpress.com/

  121. great stuff!! can’t wait for your article on meteor.js. in the meantime, i suppose i’ll have to purchase tom coleman’s discovering meteor.

    • I will definitely write about Meteor.js, but I prefer to do so after I complete the huge Meteor.js project I am developing right now.

      Yes, I agree that getting the Discover Meteor book is the best bet at this point, since there is really no other book on Meteor.js.

  122. ERIC

    Hey Richard,
    Can Javascript query sql and MYsql db’s?

  123. Hi Richard,

    Great course and site! I was wondering what you thought about Angular JS.

  124. Hi Robert,

    Great post/guide.

    I’ve been working my way through this although a little bit more slowly than recommended. However when I started chapter 14 of Professional Javascript for Web Developers I found the code not working and it felt like I was missing something vital.

    After skimming the two skipped chapters I found that Chapter 13 has you create an object called EventUtil that’s used pretty heavily in chapter 14. Might be beneficial to have people read the beginning bit of 13 before moving to 14

    • Tiredness from a full day of Javascript, I intended to type Richard I swear.

      • Hahaha. No problem at all, Brett. I am glad to hear you are coding a lot. Thanks for the tip about chapter 14 and 13.

        • I agree with Brett, Chapter 14 has completely thrown me off

          • Hey Sam,

            I ended up going through 12 and 13 and not skipping either of them to get back on track. I think you could probably get away with skipping 12 though as the two extra chapters add quite a lot of time(I think there were over 100 pages or so between them.)

            Feel free to reach out to me on skype or twitter(brett_warner on both) if you need a study partner to bounce ideas off of. My pace is slightly slower that ideal though on this course.

  125. derron

    hi Richard am interested in learning java script but I got no programming experience any suggestion, by the way thanks this site is so useful in helping make my mind up

  126. Betsss

    Hello Richard,

    I’v stared the javascript roadmap (go into week 3),but i have a question.
    is in the javascript roadmap we will be also learn dealing with cross browser compatibility and cross security issues ?

    thanks

  127. Hi Richard,

    Is there any particular reason you’ve skipped chapter 13: events, in professional Js for web developers?

  128. Raj

    Been looking for a proper guideline like these among the sea of resources about javascript for some time…thank you a lot Richard for all your efforts.. I promise to be a top class javascript developer one day, thanks again Sir.. :)

  129. What’s up everyone, it’s my first visit at this website, and piece of writing
    is in fact fruitful designed for me, keep
    up posting these articles or reviews.

  130. Paul Wanwu

    Hello, My version of the JS Quiz is here: https://github.com/wanwu/js-dynamicQuiz

    (Note this uses jQuery for DOM traversal & elements.)

    On jsFiddle here: http://jsfiddle.net/wanwu/mAcaM/embedded/result/

    (code / editor: http://jsfiddle.net/wanwu/mAcaM/)

    Many thanks to Richard for putting together this superb course and guide. You rock.

    • Congratulations, Wanwu. Very good work there on the quiz. Now, keep learning and keep coding and go build amazing stuff!

      • Paul Wanwu

        Hi all,

        Finished quiz up to week 7. Maybe useful for someone else.

        Here it is on github:

        https://github.com/wanwu/js-dynamicQuiz

        – Add a “Back” button
        – Shows history of answers to questions
        — Use jQuery to add fade animation animation (fade out the current question and fade in the next question).
        — Store the quiz questions in an external JSON file.
        — Add user authentication: allow users log in, and save their login credentials to local storage (HTML5 browser storage).
        — Use cookies to remember the user, and show a “Welcome, First Name” message when the user returns to the quiz.

        Paul

  131. Benj

    Hi Richard, i’m on the course, and I learned to “like” the Flanagan book which I first found totally unsuitable to learning because of being quite complicated. Fact is, this book is thorough and can’t see how to master the language without this book. Examples are often unnecessarily inexpressive and complicated though.

    Anyway there is a LOT to learn: ECMAscript, client side DOM and BOM, Nodejs, framework, templating, testing… What confuses me is what should I do for DOM manipulation.
    IF I learn jquery, is it necessary to go trough the dom-bom manipulation chapters of the Flanagan book about standard JS manipulations ?
    And is it viable to not learn jquery at all if one uses a framework like AngularJS ?
    I would appreciate a bit more of guidance about the DOM/BOM/JQUERY/Framework antagonisms.

    Thanks,
    Benj

    • MikeT

      Good question..

      • Paul Wanwu

        I had a similar question.

        Vanilla JS vs. jQuery…. Seems like:

        – for DOM traversal
        – browser compatibility
        – general UI

        jQuery and other frameworks offer substantial benefits?

        I had a long question on it but I can’t seem to post it here – am getting a ‘firewall blocked’ message?

        Regards
        Paul

        • Paul Wanwu

          … Some more from my probably too long question/comment! [ I guess that's why I can't get it to post ]:

          – I’ve read that for cross-browser compatibility, and simplicity, the jQuery DOM API makes a lot of sense over vanilla Javascript unless you are a highly proficent in Javascript.
          – I realise that there is a performance hit – download times as well as memory usage and performance for using any library, including jQuery
          – Still, I don’t think my vanilla Javscript skills would be able to compete with jQuery at this time!
          – Would it be sensible to at this point use jQuery for DOM manipulation and events?
          – Any thing else you would suggest I defer to libraries at this point?
          – How about backbone, angular and node.js – given I want to gain these skills would I really struggle if I didn’t go into the advanced Javascript stuff?

        • Indeed, jQuery makes it easy for the front-end developer to traverse the DOM and develop sites that are compatible with all browsers. You are correct, so using jQuery is recommended for production applications.

          Note that jQuery is actually built with Vanilla JavaScript, so everything that you can do with jQuery, you can do with Vanilla JavaScript, but it is just a lot more work.

    • Good questions indeed.

      There is no antagonism for any of the frameworks and DOM and BOM, though.

      As a front-end developer, you will likely use a ton of jQuery in your career, so it makes sense to definitely learn jQuery thoroughly. Whichever source you find to be the best for learning jQuery, use that.

      Now, even though you may know jQuery very well, it will still be useful (though not necessary) for you to read the DOM and BOM chapters. So, read the DOM and BOM chapters, if you can, to get a fundamental understanding of the stuff works and then learn jQuery.

      As for Angular.js, I will be writing about this and all the other JS frameworks on moderndevelopertoolkit.com. For now, you still want to know jQuery, which is probably the easiest thing to learn with the most utility in all of web development.

  132. I would rather recommend Ruby on Rails as a prototyping language, if you’re the startup guy or entreprenuer, trying to learn how to code, on the internet.

  133. James

    Hello, first of all I am so glad I stumbled upon this outline. Very helpful because most of the time I felt lost trying to learn javascript before. So now I have a question for you. I am trying to get a internship as a Front-end Developer and was curious to how you measure completion of this course with being qualified skill wise for an internship? I already know HTML5 and CSS3 fairly well and I am currently half way done with this course and I must say I am feeling already more confident in my javascript knowledge. But I was curious to what your insight was? Btw, thanks for this outline.

    • Hi James, I’m sorry about being a bit tardy.

      1. First, I don’t think you need to complete this entire course to get an internship. With an adequate enough of familiarity of HTML5 and CSS3, you should be fine.

      2. I think if you complete this course and you practice afterwards by building a few applications, you will improve you readiness for a front-end job markedly. You should learn jQuery completely and, if you have sufficient time, learn Backbone.js, too.

      So you should complete this course whether you get the internship position or not, and start building some small applications afterwards. This alone will allow you to learn an essential skill and make you marketable as a JS developer.

  134. CC

    Hello. hmm, well, one quick and stupid question maybe…

    well, i want to learn javascript. want to learn the programming. but, what software? i mean, i can copy the code yes , but to where? and how do i know it is correct?
    i am mac user… and now i want free software as i just want to try and learn, nothing about profession yet. any suggestion? i am kinda lost in the java world ….

    thx

    • Hi CC,

      A few others have asked similar questions and the answers are above. I will answer here again.

      1. You can use a web-based JavaScript editor like http://jsbin.com.

      2. To create your code and save them, you can use any editor like Sublime Text (which is great, and you can get it free) or Smultron (which is also free). And then you can open the .js (to HTML with embedded JavaScript) )file in the browser to test the code.

      3. You can also test the code right in the browser’s console. You can Google for screenshots on how to do this.

  135. Phill H

    Here is my first try at doing anything in JavaScript – really enjoying it so far. Not very good at the moment but I’m going to keep at it: http://jsfiddle.net/greenhulk01/LY36A/33/embedded/result/

  136. Stanley Ulili

    hi Richard,am Stanley and am 18 years.i just want to say thank you very much for this course,its is really helping me.but i have a couple of questions which are troubling me very much and they are disrupting my progress.
    (1)am just finishing chapter 9(professional javascript book) but i have trouble understanding regular expressions used in this chapter,honestly speaking the book didn’t cover much about regex.So,should i worry about them?(because i have a regular expressions cookbook but it has too many pages and i feel like it will slow me down on your course).

    (2)do i need to understand and remember everything inorder to move forward?i mean things like navigator/location/math properties or function module or prototype patterns.

    (3)do i need to memorise all the code.like memorizing the
    useragent detection script or all the code i have encountered in the book.this is has been my biggest problem,thats ‘why i didnt include it on number.most people dont answer me clearly.

    (4)is it normal for me to just read code but fail to write.because right now i just cant write any real program like sliding images or making a date.(if its normal ,then after reading which chapter should i attempt this to do this things(mind you,am on chapter 9[zachas book]).

    (5)when do you know you fluent in javascript and ready to move on to a server sided language(i know about node,js but i have always wanted to learn php or ruby)?

    (6) someone asked how many hours you had in mind for this course and you said 2 hours but the thing is i stay home all day.so the question is,should i stick to 2 hours? and if not,how long should i take to finish this?i fail to give myself a deadline.can you give me one since i stay all day.i learn better with deadline and am a recovering procrastinator.so i need to fix my productivity.

    (7)lastly,how long has your website been around.i cant help but notice how its ranking well on google.if its knew,did do you do a lot of seo or it just went on top.am asking this because when i finally learn this,i want to enter a tutorial and a learning web design niche .is it possible to make it top ten?

    am so sorry for all this question,i just have never had satisfactory answers.please try to answer and i know your busy.thanks again for this sexy post and am telling you posts are always sexy.you are heaven sent for javascript learners.

  137. Adam Newis

    Hi there! Thanks for posting this awesome guideline. I’ve been following it for a few weeks and I thought i’ll recommend a wonderful resource to practice programming in JavaScript.
    codewars.com gives you step by step community build challenges to hone you JavaScript skills in particular areas, be it Algorithm design or basic fundamentals.

    Just thought the practice may help fellow learners like me.

    • I like your site, Adam.
      I just tried the first question on your homepage. It might be best to have the user enter a code-related answer, instead of an essay-type answer in the form of an sentence.

      • Adam Newis

        Actually you have to fix the code to make it work (like adding the semicolon) In the first example (most are randomly generated) you have to use the this keyword to reference the name variable in the parent function.

  138. Adnane

    Hi Richard ! Thank you so much man , I really appreciate what are you doing for us , you’re really helpful , I was obsessed in learning Javascript :D :D , I started learning it 2 times ago ! and I stumbled in both of them . And now I’m good with your Roadmap ! It’s awesome ;) I have just completed the chapter 2 :) !

    But I have a question (I don’t if you will reply it soon, but ..) about Codeacademy I think the track is changed !
    Because you said in (week 4) : “Return to Codecademy and complete the JavaScript track by working through sections 6, 7, and 8 (Data Structures to Object 2).”
    but when you look at the track you will find ” sections 6, 7, and 8 are about the loops o.O ” ?

    That was my question, and I will thank you twice :D Wishing all the best for you ! Bye .

    • Adnane

      Haha ! Ignore the question ! It’s correct -_- . Sorry !
      A other question :) : I didn’t understand the section of “Document Modes” in Chapter 2 ! Any other reference to get it ? !
      Thanks !

      • Good question, Adnane.

        You can ignore that discussion abut Document Mode completely. The author was sharing some background information about a compatibility mode for IE5.5 and older browser.

        As a modern developer, you wouldn’t be needing the information discussed in “Document Mode” in chapter 2. It is practically useless to you. It was more relevant about 4-5 years ago.

        I answered your other question before I saw your updated comment that it was a mistake on your end. :) No problem. I still have to update this post.

    • Thanks much for bringing this to my attention, Adnane.

      I have to spend some time updating some of the blog posts, especially this “How to Learn JS” one. I will try to do that in late December when I have a bit more time. I am too inundated to get to it sooner.

      Thanks also for the compliment. I am glad to hear the website is helpful.

  139. When I initially commented I clicked the “Notify me when new comments are added” checkbox and now each time a comment
    is added I get four emauls with the same comment.
    Is there any way you caan remove me from that service? Cheers!

    • Adnane

      You can enter to any e-mail you received from JavascriptIsSexy and at the bottom you’ll find “Unsubscribe” ! Click on it , and it’s gonna fixed !

  140. Rookie

    Hello,
    Here is “not a dumb question” number one:
    So I am going through this course of learning and, in accordance with your advice, I am writing out the code that I am coming across (in the Definitive Guide) into JSFiddle and … NOTHING ever happens ??? No results. Nada.

    I have just finished chapter 3. And still … nothing. Am I to assume that this is normal? -Or am I totally missing the boat here? This is making my comprehension level drop significantly it seems since everything I’ve read is all just hypothetical stuff.

    Help!

    • Stanley Ulili

      its normal Rookie.it happens to me each and every day.it has has to be a mistake in your code,maybe you forget to call the functions or you made some typos.simple things can break you code,yesterday when i was trying to make a javascript date,just one simple typo made it fail.just look clearly.Am pretty sure Richard has good solution..

      • Rookie

        I wish that you were correct Stanley. But I don’t think so … I am just typing out the very simple stuff as it appears in the first few chapters. It is not at all difficult to duplicate exactly.

        I am wondering if I am somehow using JSFiddle incorrectly or something (?) since this is all new to me and I have no way to tell which end is up. (???)

        • Hi there,

          Have you tried running the examples in a browser console rather than through JSFiddle? That might be a good way to narrow down whether it’s a code issue or a JDFiddle issue.

          • Rookie

            Hi Dylan,
            No, I have not. I do have the Firebug thing set up on my Firefox … but I really don’t know how to use it. I tend to get caught up in the minutiae (do I need to have an HTML file set up? -should I have an external JS? -or embed it in the HTML? etc. etc. etc.). Perhaps there is a simple “how to” type of tutorial out there about Firebug (?).
            Most of my time so far has been going through the very beginnings of the codecedemy stuff and reading from both books.
            I guess I will monkey with Firebug console thing to see if I can make sense of it.
            Thank you for your response.

            • Hi again,

              My suggestion is to start with something REALLY simple in Firebug. Open up the Firebug extension (click on the icon in your browser) and you should see a “Console” tab. Click that and you’ll an area that has three left chevrons (>>>). This is where you’ll enter your code.

              From there, type the following:
              console.log(“It works!”);

              That should display the command followed by the string near the top of the console window.

              You can also do something similar in Chrome (which is what I use). Under View -> Developer, you should see an option for “JavaScript Console.” If you open that up it should be very similar to the Firebug console and allow you to enter the same commands.

              I understand about getting caught up in minutiae. Just keep at it and you will have some “light bulb” moments where things start to make sense.

              Good luck!

              • Rookie

                Thanks for the encouragement Dylan.

                I can’t help but think that something is being lost in translation here (?). I’ve opened firebug, clicked on the console tab, and I see the little 1 line area on the bottom with the >>>. I put the code into that area but … nothing happens??? (other than that I can see code in the chevron area).
                I certainly don’t want to be a hassle here but … What gives? I checked my preferences and JS is enabled … but I don’t know what else to do?

                • Rookie

                  hmmmm … after doing some online searching, etc. I have come to the conclusion that my Mac is simply too outdated to do this stuff. -and therefore some kind of glitch is not allowing for JSfiddle to do it’s thing, etc. I think the Firebug issue is the same (?).

                  I am using a Mac 10.5.8

    • Stanley Ulili

      Well,if thats the case,then try to download notepad++(the best free editor) and then make an html and js file and the link them.to create an html/js file,open new file and then then select language(its on the toolbar) and the in the js file,paste the following code:
      var scope = “global”;
      function f() {
      alert(scope);
      var scope = “local”;
      alert(scope);
      };

      f();

      i substituted console.log with alert.and always do when using a text editor because when you write console.log,the change occurs only in the console.

      if this doesnt work,go to chrome/firefox developers tool and then check the error and the line where the error occured.this should help find errors quickly.

      • Rookie

        Stanley -I am assuming that you are responding to me (?).
        If so, I don’t think that your advice would work for me as I am on a Mac and (I was under the impression) that notepad++ was for pc computers, etc.

        Maybe I could pull that kind of a move in TextWrangler or Dreamweaver or something?

        This stuff is difficult enough as it is without trying to jump through all of these other hoops with outdated tools, etc. -Frustrating.

  141. Stanley Ulili

    hey Richard,

    am sorry for my silly questions.recently i have just understood that the only way to learn programming is practice,practice,practice.i used to think that i had to memorize and know each and everything before i could start practice programming.i think it was because i was afraid i might fail.now i have learnt to face my fears because doing them makes a difference.That being said, i have started breaking and reversing other peoples code and seeing what works and doesnt,its cool to see how mistakes build you up.Currently,am now grasping the DOM,i hope in the few weeks i ,might be able to program some real cool applications from my brain and i cant wait to start the quiz project and practice * 1000.and i just found some interesting quotes,maybe it might motivate others who were/are in the same boat:
    “Experience teaches slowly, and at the cost of mistakes.”
    James A. Froude
    “Inaction breeds doubt and fear. Action breeds confidence and courage. If you want to conquer fear, do not sit home and think about it. Go out and get busy.”
    Dale Carnegie

  142. I do not even know the way I stopped up right here, but I thought this subnit
    was great. I do not understand who you’re however certainly you’re going
    to a well-known blogger when you aren’t already. Cheers!

  143. Maddane motaquillah

    Hi, i don’t know what to say but :) i have a long story with this blog and especially with this post :) I’ve read this post 6 months ago and i love it so much but i did’t bookmark it and it’s been a 3 week that i’am looking for this post and I’ve finally found it :) and this’s really one of the best and complete posts about Javascript thank you :)

  144. AWESOME! I am just starting to learn javascript…next challenge “Node.js”

  145. Khalil Rashid

    I AM excited about this journey

  146. Adnane

    Hi Richard , I have a little problem in understanding “Accessor Properties” ! the problem is : why I use underscore as a prefix of a variable ? !
    I read this
    ” The underscore on _year is a common notation to indicate that a property is not intended to be accessed
    from outside of the object’s methods. ” p 177.
    But I didn’t get it :/
    Thanks ..

  147. I like to disseminate understanding that will I have accumulated with the calendar year to help
    improve group efficiency.

  148. I love this! You helped me and so many people! Thank You!

  149. Here is my first attempt on the quiz assignment. :)

    http://jsfiddle.net/GYNLB/

    I know the code is inconsistent and a bit messy but I just wanted to get it working first. It takes any number of questions and answers at least. I’m going to rewrite it all now and apply the things I thought of while coding this version. Want to make it more modular than it is now.

    Would be happy if anyone could take a look at it and give some feedback.. Thanks!

    • You guys are cool. There are lots of interesting quizzes with interesting animations and even lovely designs and cute pink buttons.

      On a serious note, good effort there, Andreas. I am sure you enjoyed building the quiz.

  150. Atlas_

    Hey like the tut and trying to follow it but can’t say i am big fan of Professional JavaScript for Web Developers, it’s very dry and eager to give you a history lesson along and meaningless info at the time with unnecessary long way to explain something, sometimes ending up missing the point.

    I find myself using https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide on top of it with greater success.

    • Atlas, I understand what you mean: Some people don’t like to study from books like Professional JS for Web Developers, for the reasons you have mentioned.

      I have written articles on some of the core topics covered in the book, so you can use those articles, if necessary. But since you have found a way to learn the language that works for you, stick with it.

  151. I wrote a new version of my quiz as an object instead: http://jsfiddle.net/Js4Jz/3/

    (my previous version is two comments up)
    Any feedback is welcome.. :)

  152. Adnane

    Hi Richard , I’m reading the chapter 7 of JAVASCRIPT® FOR WEB DEVELOPERS !
    But I’m confused (Scopes, Private values, private functions, function expressions, the function type ..) ! I found it more than a time WHY? !!! I just want to get it simply , resuming all what I need about that . I wish you understand my question, because I really need help :)
    Thanks so much .

    • You can skip Chapter 7, if you are having trouble understanding it. The only lesson from Chapter 7 that is essential is the one on “Closures.” But I have written a full article on closures on this blog. So just skip Chapter 7 and read my article.

  153. Atlas_

    This is what i came up with, it’s a good learning experience.

    http://jsfiddle.net/Atlas_/smuC7/1/

  154. Mike SF

    Awesome tutorial… really motivated me to go beyond simply doing tutorials, and actually start building applications.

    Here is my Quiz app… I need to add better quiz content, but fairly happy with overall application logic and UX. I will continue to refine and improve as I learn more about JavaScript.

    http://jsfiddle.net/basixmike/nxv57/

  155. I really enjoyed digging into your quizzes! So here’s mine : http://jsfiddle.net/dufia/U7saz/5/ .

    Andreas, I hope you don’t mind that I used your questions.

  156. Matt J

    Next week I’m starting a new Learn JavaScript Properly reddit study group.

    Post a comment if you’re interested in joining.

    http://www.reddit.com/r/learn_js_in_seattle/comments/1tziaa/new_study_group_starting_january_2014/

  157. Hey man, I really appreciate this article and I will be starting this February 1st.I my self am at the point in my javascript knowledge to were i can do a few very minor jQuery functions but i need to take my dev to the next step. I had the privilege to join a web agency as a dev intern last October and latest till the last week of december of 2013. I was making responsive emails for the company and was able to make something that somewhat met the standards of the agency. At the time though however, there was no room at the agency for a beginner developer and my knowledge of jQuery and javascript just was not and still is what it should. I am now still working with the agency but I am associated with the quality assurance team performing end user test for visual/functionality. I am going to follow the steps here and really stick to the regimen. I belong to all the treehouse, codeschool and codeacademies but I still feel that there are somethings that could be better described. At the same time though my knowledge is still growing and is day by day getting better. I hope and really think that this program may very well for lack of a better term do the trick.

  158. coder0523

    Richard of Stanley, besides the roadmap here, do you recommend any other resources like learnstreet, etc? What about eloquent javascript? Seems like the most popular choice for beginning javascript students.

  159. your blog is very nice i like it if you r want to visit for sale on any place you can visit our site then you will take that you want .

  160. Orlando

    Hi. I have a question regarding what book to buy. You stated that anyone with programming experience can get Professional JavaScript for Web Developers, I have programming experience in C/C++ and JAVA but no web development experience.
    Do I still get the Professional JavaScript for Web Developers book or the other one?
    Thanks

  161. Very nice post. I just stumbled upon your blog and wanted to say that I have truly enjoyed surfing around your blog posts.
    In any case I’ll be subscribing to your rss feed and I hope you
    write again soon!

  162. Vamp

    Great guide.
    By the way, when you make quiz, here is suggestion for app you can make:

    1. Music player(html5 webstorage to store songs, audio API, bootstrap for design so it can be used everywhere, jquery for DOM and animations etc);

    ; )

  163. Web development are popular career choices right now. One of the great things about getting into the industry is that there are a variety of different ways to build your knowledge and gain experience. I am a UI Engineer and have more than three years experience. Recently, I joined JavaScript training classes in Go-Live Labs for improve my skills more.

  164. Raddi

    Hi! I just read the first 2 chapters of the Definitive Guide, and although I have some experience with HTML & CSS, even did some JS on Codecademy before I started the book, I DID NOT understand most of what the first chapters were talking about. I thought when it said the book is for people with no prior experience in Programming, that everything would be explained from scratch, but it doesn’t seem so. Should I not worry and try to keep going, or is there a FOUNDATION that I need to make sure I have in order to understand JS’s logic. I wasn’t great in Math, but I do have a BS (not in CS though)… I feel super discouraged, and don’t know what to think. :( Help..Thank you!

  165. This is really useful Richard. Thanks a lot for the details on JavaScript topics and resources

  166. Hello folks. i am very interesting in starting next Monday. Does anyone wants to form/create new/study group?

  167. Code Academy is a joke…

    Example: Section 6. “Search Text for Your Name” – step 5/7. What the fuck is the point to this exercise? NONE. IT DOESNT EVEN SPELL OUT YOUR NAME (regardless of whether or not all of the characters of your name are in the body text).

    Obfuscation != good learning. Retarded examples that are completely pointless, and furthermore don’t make sense != good learning.

    Highly recommend taking CodeAcademy OUT of this.

  168. I’m a newcomer in blog commenting.And I have just started to learn javascript.its a amazing post which will help us to learning java.

  169. James

    Very grateful for this site–there’s a lot of good work here. I’ve tried several sites, and each has taught me something. I like your approach. But:

    After faithfully following your “Learn JavaScript Properly” plan, I attempted the “quiz” exercise you described. It was like hitting a brick wall. I’d done every exercise and experimented with code, right up through Try jQuery, and–blam. Just–stymied.

    Getting and displaying objects in arrays (quiz items) on a page? Didn’t learn how to do that. Tying Javascript/jQuery and form elements (radio buttons, etc.) together? Nope–didn’t really see that in the book or exercises.

    Several other bits, but–am I missing something? The project and the learning just seem so far apart at that point.

  170. Girish

    Hi,
    I am new to programming. I went through the tutorial as suggested. I am unable to complete the quiz exercise on my own.
    But I can understand the examples done by others and use their code.
    What I have done wrong ? or What am I missing? Please help me out.

  171. It seems that a lot of the information in the Professional JavaScript for Web Developers book isn’t useful. For example, they’ll take like 3 pages to explain something, and then say that it’s deprecated and/or that you shouldn’t use it.

    I know that sometimes it’s good to know things even if you won’t be using them, but I still think that this book seriously overdoes them.

    At the very least, it should tell you that you don’t need to know it *before* explaining it to you.

    • Also, the book seems to take a lot of time explaining things about JS that could be implemented way easier with jQuery. Again, I know the background knowledge of JS is useful, but still think it’s overdone (that much background JS isn’t really necessary to be able to implement things with jQuery and be a good programmer).

      At the very least, it should tell you beforehand, “this is really easy to do with jQuery, but I’m going to explain the background JS to you so you have a deeper understanding”.

      • StevenJS

        I disagree with your statement above. jQuery is just a JavaScript library. Learning the actual JavaScript code is still extremely important. Although something might be “easy” to do with jQuery, you still must understand how its doing it.

  172. First of all, let me say I’ve really enjoyed your course. I am to the part with Bootstrap integration, and I am having some trouble locating Quiz specific components for it. Am I missing something, or is it another part of Bootstrap that would just function well for a quiz? Thanks for the awesome posts, hope that I can make it over this hurdle and continue on!

    Sean

  173. Steve

    I just went through Code Academy’s 10 hour JS course and it helped me grasp some concepts I could never truly easily grasp. I would advise anyone to give it a shot. Your advice not to seems poorly-given. This course is step 2 for me.

  174. Ama

    Richard,

    Since ECMAScript 6 is around the corner, people who are learning ECMAScript 5 or Javascript now are just wasting their time?

    Tha same goes with AngularJS since AngularJS 2 is around the corner too?
    Thanks

    • Naman

      Are there any major differences in AngularJS and AngularJS2? I firmly believe that only the syntax changes, but the concepts still remain the same.

  175. Adam

    Hi,

    This post has been a huge help to me as I learn javascript.

    I was wondering if there is a reason for skipping chapter 5 of “professional javascript for web developers”?

    I am nearing the end of week 2. I want to make sure I learn everything properly!

  176. Adam

    Do you have any thoughts on IntelliJ and how it differs (better or worse) than webstorm. I’m using ST2 now but I’m sure to migrate to a more javascipt centric IDE once I’m at that level.

  177. CB

    Thanks for this excellent post! Quick question: How much HTML/CSS should I know before starting this track? I recently completed the ‘Web Fundamentals HTML/CSS’ course on Code Academy. Should that be enough?

  178. Hey there just wanted to give you a quick heads up.

    The words in your post seem to be running off the screen in Opera.

    I’m not sure if this is a formatting issue or something to do with internet browser compatibility but I thought I’d post to let you know.

    The style and design look great though! Hope you get the problem resolved soon. Many
    thanks

  179. Thanks very munch.
    At first I encounter js, I was interested to study it because of its ability to create interactive, dynamic, cool elements on web page. But after having some difficulties on some aspect, I stopped learning it. Then I learnt scriptaculous & quit. I learnt jQuery & quit. All of them without a mastery.
    Then I stumble upon your post http://javascriptissexy.com/learn-backbone-js-completely/. It pointed me to this post.

    what section do I like most about this post?
    It IS Words of Encouragement. Thanks ^_^

  180. Mcs

    here is a go for a pure javascript quiz,

    I think I could have done it easier, man did it take a lot of work.
    I will now do the same quiz with jquery in 1 hour

    http://jsfiddle.net/Mehmetcan/sFr5f/78/

  181. Robert

    I tried reading “JavaScript for Web Developers” and I just could not get through it. It’s about the driest, most boring technical book I’ve ever (tried) to read. I do_not recommend it.

  182. Jennifer

    Hi Richard,

    I just want to sincerely thank you for posting the JavaScript roadmap. I just started week 1 and it’s been great. And your site has so much useful information.

    Thanks!!!

  183. Una

    Thanks for the great course! JavaScript is my first programming language, and this guide made learning it much less intimidating.

    My code for the quiz project:
    https://github.com/umgauper/JavaScript_Quiz/blob/master/js/quiz.js

  184. If you live in San Diego and would like to follow this track, we are hosting a Learn JavaScript Properly study group. Look at the details here: http://www.sdtig.com.

    We’ll probably have 50 students and four teachers there.

  185. Now we’re doing a “Learn JavaScript Properly” track using GotoWebinar, starting August 20th, 2014. We’ll meet once a month for three months. Each meeting will be an hour. Looking forward to seeing you!
    http://bookreaders.sqlpass.org/

    Ike

  186. ric

    Hi,

    If I want to learn javascript faster than 4-6 weeks, how many hours do you think I need to put in on a daily basis. I have some background on javascripts but never have written them myself ever, only have read and understood what they r doing. I would appreciate your response. And thank you for putting together this information. It is certainly very helpful.

    Thanks,
    Ric

  187. So.. am I supposed to use the new course on ccademy or the original one? Which is more useful to someone who only knows HTML & CSS please.

    Thank you. :-)

  188. Franklin

    I love this, I started and finished this roadmap a while back but can’t stop coming again for new stuff.

    To everyone: join the “learnjavascript” network on jellyblub.com

  189. thanks sir or madam

  190. Do you mind if I quote a few of your articles as
    long as I provide credit and sources back to your webpage?
    My blog site is in the exact same area of interest as yours and my users would certainly benefit from some of the information you present here.
    Please let me know if this ok with you. Regards!

  191. Spot on with this write-up, I honestly believe this web site needs far more attention. I’ll probably be
    returning to see more, thanks for the advice!

  192. Iccio

    Hi,
    Thanks, nice job!
    Is there a group starting in Autumn 2014?

    Thanks!

  193. Jovan

    Just curious but why can’t the 5 little projects be found via the Codeacademy front end? What am I missing?

  194. Howdy! Quick question that’s completely off topic.
    Do you know how to make your site mobile friendly?
    My blog looks weird when viewing from my apple iphone.
    I’m trying to find a template or plugin that might be able to correct this issue.
    If you have any suggestions, please share. With thanks!

  195. Great blog here! Also your web site loads up very fast!
    What host are you using? Can I get your affiliate link to your host?
    I wish my website loaded up as fast as yours lol

  196. Hi there outstanding blog! Does running a
    blog similar to this take a large amount of work?
    I’ve virtually no expertise in programming however I was hoping to start my own blog soon. Anyway, if you have any recommendations
    or tips for new blog owners please share. I understand
    this is off topic nevertheless I simply needed to ask. Kudos!

  197. I enjoy reading a post that can make men and women think.
    Also, thank you for allowing for me to comment!

  198. Mac Chinedu

    Now I am sure that there is someone who knows exactly how I feel trying to learn programming. Those words of encouragement are awesome! I will be back to give my testimony. Thanks for the push.

  199. Dan Raymond

    Dear Sir,

    Would like to learn JavaScript but cant’ begin till September 24th. Can I just jump in then? Is there a course fee? I am a complete beginner but looking forward to learning.

    Thanks,

    Dan

  200. Ηey There. I disϲovered your blog the usagе of msn. Thiiѕ is an extremely smartly written article.
    I’ll make sure to bookmark it and cߋme back
    to read more of your helpful information. Thank yօu for the post.
    І will certainly return.

  201. StevenJS

    Hey Richard, Any idea on whether you’ll be making a post on Meteor.js? Thanks.

  202. 1- Find a product to promote, something you feel passionate about and that you know people will want to buy it.
    The website speed test at Secret Search Engine Labs will analyze how fast a page on your site is loading and
    give you tips on how to improve it. But it seems Memorial
    Day wasn’t important enough to Google.

  203. Naman

    You really need to switch to a different browser! Try Chrome or Firefox. Just avioid IE.

Trackbacks for this post

  1. JavaScript is Sexy | JavaScript is Sexy
  2. Martin Codes – Cool Link Stash, September 2012
  3. Pilgrimage to JavaScript Glory: Noob to Expert | JavaScript is Sexy
  4. 16 JavaScript Concepts You Must Know Well | JavaScript is Sexy
  5. Learn Node.js Completely and with Confidence | JavaScript is Sexy
  6. Learn Backbone.js Completely | JavaScript is Sexy
  7. tamapolis : Javi Agenjo's personal blog » Blog Archive » A Year in Javascript
  8. Dev & stuff to look into | Pearltrees
  9. How to Learn JavaScript Properly | Modern web development | Scoop.it
  10. How to Learn JavaScript Properly | Software Development Solutions | Scoop.it
  11. Boston web developer and web designer : Erik August Johnson : Blog
  12. [Bookmark] Tips Belajar Javascript dengan Betul | Robotys.net
  13. Q Leren Programmeren
  14. February Roundup of Javascript Resources for front-end developers - petersena.com
  15. Weekly Reading Summary - Beyond Isolation
  16. Learn Web Fundamentals: JavaScript, HTML-5, CSS3, & .XML | Omni-Optx
  17. Learn Intermediate and Advanced JavaScript | JavaScript is Sexy
  18. Codecademy JavaScript Track: Status Report | Somehow Doomed
  19. Learning javascript — 2oahu.com/blog
  20. Learning javascript properly — 2oahu.com/blog
  21. Bitbucket, WebStorm and Learning Javascript Properly. — 2oahu.com/blog
  22. How to become a developer | James Anderson
  23. Using WebStorm effectively to Learn JavaScript Properly — 2oahu.com/blog
  24. mjinubygrcxe4zssxctv
  25. Learn JavaScript | Juicy Web Design
  26. Thoughts on starting over with JavaScript by
  27. Learning JavaScript | Tech Ramblings
  28. My JavaScript Adventure | aggie's notebook
  29. Share Only | Pearltrees
  30. sexywebdesigner
  31. Introducing Myself | sexywebdesigner
  32. Learning JS Properly | codingIsBananas
  33. Learning JS Properly | coding(isBananas);
  34. RT @orlybg: How to Learn JavaScript Properly http… | @thisgunforhire
  35. Learning JavaScript | somenotesforself
  36. Learning JS Properly – Study Group Index | coding(isBananas);
  37. Learning JS Properly – Week 2 | coding(isBananas);
  38. Bitbucket, WebStorm and Learning Javascript Properly. | 2oahu.com
  39. Using WebStorm effectively to Learn JavaScript Properly | 2oahu.com
  40. Learning JS Properly – Week 3 review and Week 4 Assignments | coding(isBananas);
  41. Structure at Last- Found a Study Group | B's Blog
  42. Lengthy load times - DesignersTalk
  43. Be Your Own Dojo « factotum.dk
  44. JS is Sexy Week 4- Spot the Bug | B's Blog
  45. JS is Sexy Week 5- Dynamic Quiz | B's Blog
  46. Best Learning Resources for Meteor.js | XNFA ZEN
  47. Poll Results: Best Books to Learn Programming While Having Fun
  48. Issue 37 – Ballerinas In Business Suits | TLN
  49. Client Side Development with OpenERP | FVDSN's Blog
  50. Progress report – day 41 | Learning on my own
  51. aggie's notebook
  52. Learn to Programming for Free | Code Self Study
  53. Learn Computer Programming for Free | Code Self Study
  54. Jak się nauczyć | Pearltrees
  55. Client Side Development with OpenERP | maytasoft
  56. ECMA / JavaScript | Pearltrees
  57. PAF #1 – Ebooker | Potato Life
  58. Javascript | Pearltrees
  59. Learning JavaScript | yevpod
  60. New is always better… | Iggy's Box
  61. JavaScript Crash Course | Salute The Robot Victory
  62. Javascript | Annotary
  63. Learning JavaScript Free Online: Phase 1 | Learning to Code
  64. Introduction to JavaScript (Unit 1.1 Getting Started with Programming) | KARTIKA'S BLOG
  65. How to Learn JavaScript Properly – Genesis | Bobby Showalter
  66. A Slightly More Formal Approach to Learning JavaScript « David's Personal Blog
  67. JQuery i nasıl öğrenirim? | Ibrahim OZGON
  68. Properly Update #1, Chrome Cast Excitement | David's Personal Blog
  69. How to Learn JavaScript Properly | Web Developm...
  70. Learn JavaScript Properly – A Course On JavaScript | Otto Uusihakala
  71. Day 35. JAVASCRIPT: WHERE TO START & WHAT IS GSAP?
  72. Thanks Jessica Hische. Now I want to learn to code... - DesignersTalk
  73. Javascript | Pearltrees
  74. Getting Good at Digital Strategy | Jon Litwack
  75. Thanks Jessica Hische. Now I want to learn to code... - Page 2 - DesignersTalk
  76. Code Diary - 1% Project
  77. Programming and web development - coding | Pearltrees
  78. Learning to code 2: HTML | February Man
  79. What To Do After Learning The Basics Of Programming? ← Odd Journey
  80. Js | Pearltrees
  81. How To Learn Javascript Properly | Jason Griffith
  82. Learn Javascript Properly – Blog
  83. Useful Meteor Resources | Life by Bits & Numbers
  84. Learning Javascript « Non Geek for the Geeks
  85. 如何正确地学习Javascript | witmin
  86. Stephanie Chang | Learn Javascript Properly
  87. Web Design | Pearltrees
  88. How to load, and save local JSON into variable | QueryPost.com
  89. Web programming | Pearltrees
  90. Resources for Learning JavaScript
  91. JavaScript is Sexy | Lobsterhands' Programming Adventures
  92. I’m all stocked up. | Turk Learns Javascript
  93. The Water Damage Restoration Process | bevchristianse
  94. How can I add text to radio button with Javascript? | QueryPost.com
  95. milinks | Barking Bananas
  96. Learning JavaScript - Typing Out Loud!
  97. A Week of JavaScript - Typing Out Loud!
  98. How to Get a Job as a Front End Developer « Hanna Liebl – Digital Design
  99. JavaScript & Hack Reactor | study resources | bellerachelle
  100. So I’m learning my first programming language & Newbie resources | Kauress
  101. How to Learn JavaScript Properly | web developm...
  102. Creating a Single Page App – Part 1 – Learning the Fundamentals | A Blog About Code
  103. How to Learn JavaScript Properly | Just some st...
  104. Web Design Diary (6/5/14): The Problem with Codecademy | Josh Langley
  105. JavaScripting with Women Who Code | My coding blog
  106. Web Design Diary (6/9/14): Saying ‘Goodbye’ to WordPress & Other Changes | Josh R. Langley
  107. Zero to One: Building Mamoru – LJSP Weeks 1 and 2 | Something Worth Reading
  108. » How I am learning Javascript
  109. Charlotte’s totally subjective opinion on the best guides for learning programming languages | My Blog
  110. Charlotte’s totally subjective opinion on the best guides for learning programming languages | Charlotte Spencer's Blog
  111. 10 JavaScript Concepts JavaScript Professionals Must Know Well July9Last Year | My Blog
  112. Hacker School: Week 7 - CodeXJourneys

Leave a Comment