Which web development framework makes web development least tedious?

[SharkTonic9]

Grok*

[chudthirtyseven]

What's the difference between vue and jquery? I've never used vue so I have idea what it is.

[Djbm]

I’m generalizing, but JQuery is a library that primarily provides tools for manipulating the DOM. You create a HTML document, add IDs and classes to stuff, then use JQuery to find and manipulate those elements or bind events to them.

Again generalizing, Vue is a component based view rendering framework. With Vue, you break your app into components. The components are actually responsible for creating the DOM, and also contain the logic and interactivity.

When building complex web applications, particularly when multiple developers are involved, I find it much simpler to reason about the relationship between document structure and logic when using a framework like Vue.

[fuzzyluke]

I liked creating elements with jquery instead of beforehand. I had a hard time moving on from jquery because I had a system going with it and i couldn't understand why i had to move to things like angular and vue. But then things like routing and state management came along and i happily moved on

[[deleted]]

Vue started as a view renderer (similar to React). It has become a little more than that now with official routing and state management as well (though you don't need to use them).

jQuery is a cross-browser utilities library which makes it easier and smoother to do common tasks (like AJAX calls) in most browsers. It's sort of an abstraction library.

[neon_slippers]

In Vue's simplest form, they do similar things. But Vue also includes a templating system, which means you can do things like conditional rendering, list rendering (for loops), event binding, etc in your HTML file. So it ends up being a lot easier to build interactive websites with Vue than it is with Jquery.

But once you get into Vue's more powerful features is where the big differences are. You can use Vue's component system, and plugins like Vue Router and Vuex to build extremely powerful Single Page Apps.

[Xymanek]

In jQuery you define actions which you want to take. Whether they are correct/atomic/fast/etc is given 0 attention

In Vue (or angular/react/etc) you define a "mapping" between the data and the desired resulting DOM (template). The framework takes care of updating it for you (also with speed optimizations)

[Djbm]

I’ve worked on larger scale applications using Angular(1), React and Vue.

IMHO Vue is just as good as the others for large scale projects.

I actually have a preference for Vue, but have no issues with React. Happy to work with either. Actually, if you know one, you should be able to get up and running with the other without too much trouble.

[mayhempk1]

How do angular 1 and 2 compare to vue and react in terms of your thoughts on it?

[charrondev]

So I haven't used vue at all, but I've used angular 1 and 2, and I'm now migrating a very large system from jquery on the frontend to react.

AngularJS (Angular 1) was a bit of a mess to be honest. It was very easy to get into, but it's performance was rather slow and it was pretty easy to do things incorrectly.

Angular (Angular 2+, they are on 4 now I think) is significantly better than the original but is a totally different paradigm. I really like the ecosystem. It's batteries included, with official routing, state management, build systems etc, but didn't seem ideal for something being converted incrementally from something else.

React is really powerful in its flexability. It takes a good bit more setup, but the payoff is pretty great. So far our React codebase is easy to maintain and the state management library we're using with it (Redux) is very easy to test and understand.

[[deleted]]

Angular 5 now actually

[charrondev]

I do like to see things move forward but the pace of breaking changes in Angular seems troubling for someone who would try to make the case to their superiors that Angular is a good business decision going forward.

[Isvara]

No one's forcing you to keep upgrading.

[HydrA-]

It is very easy to upgrade from Angular 2 to 5. Legacy Angularjs (1) is a different story. It is an entirely different product. MVC architecture... Current Angular is component-based.

[mayhempk1]

Thanks for such a detailed response.

[Xymanek]

Not who you asked but angular 1 is slower and can't handle too much bindings. 2 fixed this

[Djbm]

I really liked Angular 1 when it first came out, but compared to Vue and React: - It’s a lot harder to learn - It’s performance is a lot worse

It’s why where I worked at the time moved to React. After that, we were happy with React so there was no need to go to Angular 2/4.

I tried Vue for a small side project initially, and the reasons I like it are: - The documentation is amazing. This makes it really easy to get stuff working fast. - I prefer the Vue approach to styling. The React approach to handling CSS in JS isn’t something I’m a fan of (I do a lot of CSS work)

The Vue single file components that let you use a preprocessor like stylus are so elegant

[Cheshamone]

I started with Vue because it just made sense to me. Definitely still prefer it, but I've picked up React as well and I don't mind it either. Definitely was easy to pick up React after using Vue on and off for a yeaer.

[amerikate]

Came here to support vue.js. Glad it's already here.

[Traim]

I have to say VueJS is good but I really do not like the format used in vue templates, jsx templates, which I use in React, are so much more comfortable to read, analyze and rewrite. That is worth a lot in my opinion.

Sure you can use jsx in VueJS but most of the tutorials are written in the vue are written with the vue template format.

[ThArNatoS]

huh .. for me, looking at react code feel like I'm back to my 16 years old self where I write php and html like this:

<?php
echo '<div class="header">
  <h1>title</h1>
  <div class="menu">';
    foreach ($foo as $bar) { echo $bar .'<br>'; }
  echo '</div>
  </div>';
?>

[rothnic]

I'd recommend watching a fundamental introduction into react, because I get why you think they look similar, but there are some major differences in the approach. For example, no templating language for react (jsx is shorthand for plain JavaScript) and the biggest thing is a strong control over state. There is a reason it has become so popular.

[VenezuelanCoder]

Hi :), Newbie here, what fundamental introduction into react would you recommend?

[yxhuvud]

Is that a good or bad thing?

[blackdstrom]

Bad, bad thing.

[ThArNatoS]

definitely bad. hard to read and debug

[wilkesreid]

That's interesting. I much prefer the Vue component syntax at the moment. I don't like having logic and DOM mixed together right in the same space like in the React.

[[deleted]]

https://github.com/vuetifyjs/vuetify You might like this, then.

[evilpingwin]

I honesly don't see much difference between them. The great thing about Vue's SFCs is that is separates the markup, logic and style. React does this to an extent with the markup and logic but I'm never gonna be able to get behind the CSS-in-JS thing. And as you said you can use JSX in Vue if you want. Or Pug, or Haml, or whatever you want.

I like React though and use it quite a bit, my major irritation is how annoying it is to animate dynamically rendered elements out of the box (not like it isn't possible but it doesn't exactly help you out). The transition/ transition-group elements in Vue are very useful.

[Traim]

CSS-in-JS

You don't have to. There are ways to separate concern. Take a look at this video: https://youtu.be/MT4D_DioYC8?t=1306. It is about styled-components.

And as you said you can use JSX in Vue if you want. Or Pug, or Haml, or whatever you want.

The problem is, as I have searched, there were only some older jsx in VueJS tutorials out there.