JavaScript and jQuery learning path for .NET Developers

INTRODUCTION

Until five years ago, regardless of web development platform most of the web developers weren’t seeing the JavaScript scripting language as a potential candidate for become the most famous, technology independent language that will be used in 99% of the webs nowadays. One of the reasons why JavaScript became so popular is the jQuery library. Many dare to say that jQuery is the darling of JavaScript world and I pretty much agree with that.


What is this blog post all about?
In this blog post I will try to elaborate more regarding the path (by providing advices, steps and resources) of learning JavaScript and jQuery for .NET Developers (other developers can have benefit of reading this blog post too). I didn’t write ASP.NET, but .NET Developers, because I assume there are number of developers who still work for Desktop (WPF, WinForms), Silverlight or other .NET-based platforms but not Web and they are interested to start learning more about the Web sooner or later. Therefore, this blog will mostly concern the .NET Developers who does not have much experience with UI and Front-end development, but may have (or not) experience with ASP.NET, C# and .NET as platform in general.

Note: In the past 3 months I have got several mails with questions regarding resources, books, methods/ways to learn and much other stuff related to jQuery/JavaScript. Basically, the developers who asked me these questions are ASP.NET Back-end developers or Desktop developers who have just recently moved to web.


A LITTLE HISTORY

Most of the developers didn’t like JavaScript at all
If you ask experienced developers who work with jQuery and JavaScript now on a regular basis if they liked JavaScript about five or six years ago, I bet most of them will tell you “Yes, it was nice for client-side validation… but… almost nothing else”. There will be still small portion of developers who will tell you that, yes, they saw the potential of JavaScript and they were trying to improve it, but this is enormously small number, especially if you compare it with the number of developers who think that way nowadays. If you don’t know why, well, JavaScript wasn’t cross-browser compatible… If you wanted to create some lovely components based on JavaScript and needed to ensure the component (or even simple code) will work in all browsers without compatibility issues, you would end up spending a lot time in writing different versions of JavaScript code that will run for different browsers. If you put the costs of maintenance, the browser upgrades/changes and everything else that might impact your script, you would realize that it’s better not to go in such adventure, especially if your application is for a given business as a service or product, that the deadline to build it is ‘yesterday’.

When and Where I met JavaScript?
Back at the university days, about five-six years ago, we had a course “Client-Server Applications” that was pretty much the first course related to building dynamic web using server-side and client-side languages. One of the chapters was about JavaScript. The most we did (in practice) with JavaScript was form validations, some timer based function executions, alerts, pop-ups, confirm boxes and some very basic browser manipulations. Yes, we learned almost everything about the scripting language itself (from syntax to best practices), but never did something nice more than the previous listed things…

JavaScript started becoming popular
The true value of JavaScript was seen when the first Ajax-based applications were built. For those that don’t know, AJAX stands for Asynchronous JavaScript and XML. On a definition regarding Web 2.0, back in year 2005, Paul Graham said:

“One ingredient of its meaning is certainly Ajax, which I can still only just bear to use without scare quotes. Basically, what “Ajax” means is “JavaScript now works”. And that in turn means that web-based applications can now be made to work much more like desktop ones.” (http://www.paulgraham.com/web20.html)

The inventing of Ajax was one of the reasons for starting many desktop applications to move to web, as well as many of the current websites started changing it’s approach and including more and more Ajax functionalities. [Ajax Example] [Ajax Programming]

Note: The ASP.NET WebForms Framework was great way to help Desktop developers move fast into Web. When Ajax came in scene, the ASP.NET 2.0 was released (November 7, 2005), so both were constituting powerful combination for building dynamic web applications.

Even though it’s accepted that Ajax was invented somewhere in the years 2004 – 2005, I strongly believe that it was the time when ‘the world’ catch up with the real invention, which I think was for first time created by Microsoft, about six years before that. Actually, the Outlook Web Access was the first product that had the ability to modify HTML on client-side and ability to initiate and capture async. http requests. Be careful, the other browsers had not implemented the XMLHttpRequest that time (Chrome didn’t exist at all, Firefox released in production in 2002 and for Safari/Opera it took more than five years to implement) – If you are interested, here is nice article to read about.

Even though Ajax was pretty popular, it wasn’t very easy to work with. Only about two years later (with initial release in Aug 2006 and v1.1 in January 2007), John Resig invented the popular jQuery library, which, besides the main feature of DOM manipulation using Selectors, it also became for very short period of time very popular Ajax wrapper, library that made the Ajax development extremely easy by providing set of jQuery Ajax functions.


LEARNING JAVASCRIPT

A little history…
Mainly, a little history of what happened is nice to know, especially if you weren’t previously much familiar with JavaScript. This should give you idea of the significance of JavaScript in the near past, today and in future in the world of software development, especially web development.

Extending the HTML…
JavaScript is script language used for client-side programming. Many developers understand it as an extension to the HTML and the way to make dynamic websites on client-browsers.

Developer profiles…
Different profiles of developers will find different levels of difficulties in learning JavaScript. By profiles, I mean the background of the developer. For instance, if you are very experienced with C#, you will find it very easy to start coding in JavaScript because the coding syntax follows very similar rules. On the other hand, if you are a VB.NET developer and you are very little familiar with the C-languages coding style, it will be a bit harder for you to start coding, but with a good practice (and will), you will overcome this problem easily.

Don’t be afraid of non-organized code
I have seen back-end developers are afraid of the way how JavaScript is non-organized within the browser. There is no need of Namespaces, Classes, even no need of Functions, like you have need of them in high-level programming languages (C#, C, C++,VB, etc) in order to develop even the simplest application. Well, JavaScript is the assembler of Web. So, you can organize it (read one of the ‘advanced books’) with namespaces, classes and everything else and work with it on Object-Oriented way. Still, you have to be careful a lot because JavaScript is not always very strict regarding the rules you write a code.

Advices…
Here is my list of advices regarding learning JavaScript:

  1. Start learning the very basic things and concepts by reading some tutorials for beginners online.
    A very good set of tutorials I have used several years back are the w3schools articles - http://www.w3schools.com/js/js_intro.asp - Pass all the articles and try the demos yourself. It is very recommended that you try to write the demos in some web editor or VS.NET
  2. Read a book, if you have more free time read even two or more books (one book at least is must!)
    Books I can recommend:
  3. Start a project where you will work on the web front-end. If you don’t have a project on the company where you work, try to build something for yourself, some real project that will enforce you to solve problems with the gained knowledge and will make you experience real-life coding with JavaScript.

What’s next
If you complete all first and second step, depending of your ability to learn fast and your previous experience (developers with long experience can start much faster than developers with only one-two years of experience, the experience really counts!) if you feel you are comfortable to “think” in JavaScript and have very strong understanding of its concepts, features, advantages AND disadvantages, you are ready to move to the next step, learning jQuery.


LEARNING JQUERY

The most popular library…
JQuery is currently the most popular JavaScript library. Yes, it is a library built on top of JavaScript which has resolved many issues that developers had several years ago, when writing only plain JavaScript.

Main features…
The main features of jQuery are:

  • Cross-browser compatible
  • Extremely easy way of DOM manipulation
  • Very lightweight and completely open-source
  • Simplifies Ajax Development
  • Simplifies Animations
  • Simplifies almost everything related to JavaScript

Now, there is almost no website that doesn’t use jQuery library.

Official Website
The official jQuery website where you can find everything about jQuery is www.jquery.com

The dilemma
Many have the dilemma when to start learning jQuery? I know some of you have started to learn jQuery without any prior experience with JavaScript, even without any JavaScript learning effort. You may find jQuery easy to understand, but you will have lack of understanding of the main JavaScript concepts, so later you will suffer the gap and will have to get a big step back to learn JavaScript.

If you need to start working with jQuery as soon as possible, then please learn at least the most basic things from JavaScript, the concept behind JavaScript, how it works… Don’t read a book if you don’t have time (get back to the book later when you have time), then start learning jQuery.

If you don’t need to start working with jQuery for a project which`s deadline is yesterday, then you have more time firstly to pass everything mentioned in ‘LEARNING JAVASCRIPT’ part and then move to jQuery. You will find that after you have learnt and you have good understanding of JavaScript, jQuery will be your way to make magical things with your JavaScript knowledge and the set of features that jQuery gives you. For your JavaScript knowledge it’s like the icing over the cake, where icing is jQuery and the cake is JavaScript ;).


jQuery Learning Resources
There are hundreds of resources on web regarding jQuery library. The primary and main resource is the jQuery website itself. I must say they have very good documentation and a big community around the jQuery library. Microsoft is one of the contributors of jQuery library too.

List of resources:

  1. jQuery website
  2. jQuery for Absolute Beginners – Video Series – Great video series for Absolute Beginners
  3. Getting Started with jQuery
  4. Learning jQuery 1.3 (book) – Jonathan Chaffer
  5. jQuery Enlightenment (book) – Cody Lindley
  6. ASP.NET jQuery Cookbook (book) – Sonal Aneel Allana is the author & I am book technical reviewer

 

CONCLUSION

As you could have expected, in this blog I didn’t write any code samples. The blog is to show my advices from my own experience working with JavaScript and jQuery library as an ASP.NET Developer. I must say if you are good with C-like languages coding style, you will find JavaScript very easy to write. If you don’t have experience with C-like languages, it might be more difficult, but nothing hard to overcome.

The learning path you will trace will still depend a lot from your own situation and how fast you need to learn it. However, for any programming or scripting language you will learn (including JavaScript and jQuery too), you will find that you have to spend a good amount of time before you become completely comfortable in working with it.

I hope you will find this blog post as useful in your JavaScript and jQuery learning journey.

Best Regards,
Hajan

7 Comments

Comments have been disabled for this content.