Vue.js is easier to learn than jQuery

Vue looks great; a good move away from jQuery's low-level imperative paradigm, and I would definitely recommend it to an intermediate student interesting in leveling up. However, having taught middle-school CS for two years, I disagree with the author's assertion that it would be easier for beginners to learn.

Beginners want to make something happen. Like making alert windows pop up or (oooh!) modifying the text on a page. For these kinds of things, you actually don't need to know any of the underlying mechanisms. You just need to know that you put an id attribute on the thing you want to mess with and match it in the script. Similarly, throw the script at the bottom of the body, tell them to keep it there, and dispense with $(document).ready(). I haven't done the research (yet), but my experience tells me it's best to start people off somewhere in the middle of the ladder of abstraction, high enough that you can do something interesting right away, but low enough that you have some sense of the mechanism.

For beginners, brevity contributes to simplification. I used to write explanatory comments in scripts I gave my students. But their eyes don't parse the comments effectively, and therefore they perceive the comments as extra complexity. For this reason also, I would stick with jQuery.

But I'd love to find out. Anyone teaching intro CS who has time to run a comparison?

We switched from React to Vue.js recently and we are never going back. Our team couldn't be happier as our productivity dramatically improved and I can tell you it's not even funny.

First, to answer OP's question, well the question is a little weird because i'd say that jquery supplements your vue.js app and makes it even more powerful. For instance, jquery provides methods like $.post() and $.get() along with a wide array of utility functions that you would typically use in your vue.js app.

But if you were comparing Vue.js to other frameworks like React, I'd say it's not only easier, it's a lot more fun to use and elegant (the same way jquery did for DOM several years ago). I would say always bet on elegance!

There is a horde of React developers who probably invested way too much time for them to move to anything else but my advice to them is once you go vue.js, you are probably not going to wanna go back, and hopefully that is a good thing.

React can be fun to learn in the beginning but over time it does cause a lot of fatigue when you need it to do a little more, which can overcomplicate your app rather quickly. So in my mind, I wouldn't be surprised if vue.js takes the lead over React anytime soon.

The assumption this article makes is that beginners don't know the DOM and browser APIs, so if they don't, vue.js is easier than jQuery.

That's kind of ridiculous though.

No one should be writing anything for the web without a basic understanding of how the DOM works, even if you wrap things like jQuery, vue.js or React around it.

It's not that complicated.

Every beginners tutorial should start with a basic introduction to the DOM, with some examples, and without ANY libraries.

Using jQuery here is pointless.

Here, without jQuery. How is using jQuery here with a beginner of ANY help?

  <html>
    <body>
      <div id="output">0</div>
      <button id="increment">Increment</button>

      <script>
        var counter = 0;
        var output = document.getElementById('#output');  
        document.getElementById('#increment').onclick = function() {
          counter += 1;
          output.innerHTML = counter;
        };
      </script>
    </body>
  </html>

I think this comparison doesn't make much sense. jQuery is a low level lib aimed at providing something that is easier to use than the DOM API while doing mostly the same. Vue.js is in a completely different league. It's like comparing apples with oranges.

Need to spice up a mostly static page? Reach for jQuery.

Need to create a complex UI or a single page app? Go for Vue or React. This list for me used to include Angular 1.x, ExtJS, jQuery UI, and many others.

While I agree with the author's points, I don't think we need another post to praise Vue.js. The merits of Vue.js are quite evident, even if you have watched just a few minutes of some video tutorials (https://laracasts.com/series/learning-vue-step-by-step). As a newbie to front-end development, I'm more interested to know how Vue.js measures with other light-weight alternatives --- in particular Mithril --- which take different approaches. I would like someone with rich experiences to analyse the relative merits/drawbacks of them, such as the pros and cons of using template language against pure JavaScript. Unfortunately, this kind of analyses are very rare on the internet. The official website of Mithril has listed some advantages of Mithril (e.g. easier debugging), but I really want to hear a second opinion.

You could simplify this

  <script>
    var counter = 0;
    $(document).ready(function() {
      var $output = $('#output');  
      $('#increment').click(function() {
        counter++;
        $output.html(counter);
      });
      $output.html(counter);
    });
 </script>

with

  <script>
    var counter = 0;
    $(document).on('click', '#increment', function() {
        counter++;
        $('#output').html(counter);
    });
  </script>

Am I the only one who think jQuery is important for beginners since they can get a feeling of what's underneath and furthermore, it is easy to pick up....

jQuery doesn't provide a structure for you app, it's just a library for DOM manipulations, not the framework. So jQuery and Vue.js are not comparable things. Using Vue.js or Angular you are not supposed to work with DOM directly apart of the directives.

It's a key thing to define a flexible structure when you are working on a complex project. It's supposed to be harder to learn Vue.js or similar things than jQuery since using such kind of frameworks you will probably be working on the complex project, so you will have to use your brain to define a proper app structure, to keep code base maintainable, to conduct a refactoring, etc.

Yes it is. Even though you are comparing two different libraries that does different things, vue.js is easy then jquery. Because it is much smaller in it's api. What it does is very simple and clear to understand.

I am using vue.js and vuex in some of my current projects. Only problem for me is that after adding Vuex and all it's getters, mutations and actions, my Vue component code now looks like lot of boilerplate code. Did any one else had that feeling. Is there any way I can directly connect vue template with vuex without intermediate component?

I disagree. jQuery is dead simple. You select an element and call a function on it. That's pretty much it. I think a 5 year old could understand that.

Vue.js requires a lot of different concepts that many developers have never run into before. There are multiple parts working together. It is tremendously more difficult to understand (though only on relative terms, no absolute).

Lesson 1: Yes. A simple app, Vue.js code is more readability than jQuery. It's like a matching game than learning to program.

Lesson 2: No. There're not enough Vue.js plugins in the wild. You can't play with fancy stuff. No more joy.

Lesson 3: No. You will find hard to understand the bundled NODEJS tools on articles and the way to use libs.

There is also the Quasar Framework for Vue (quasar-framework.org), which is like Ionic but using Vue instead of Angular.

Vue.js reminds me of Knockout.js. Is there any significant difference between the two?

jQuery is a DOM api wrapper, Vue is an MV* Framework.

Comparing the two is ridiculous. They both have different aims and use cases.

Yes it is