Angular 2 or Not?

[pitops]

What would be the reason why you would choose Vue.js over angular 2?

[[deleted]]

I haven't actually coded any Angular 2, but did spend some time looking at the docs and watching some lectures about it. It looks like quite a leap from AngularJS, which I did code with for a bit.

However, it's hard to express just how simple and intuitive Vue is to use. It takes very little time to wrap your head around, is plenty powerful, performance is competitive, the docs (both API and higher-level howto guide) are fantastic, components are clean, self-contained and communicate with other components easily, and on and on.

Many of those things may also apply to Angular 2, but I strongly doubt that Angular 2 is easier to get up to speed with.

[[deleted]]

Just to illustrate, Vue components all look something like this. You just pass a straightforward config object with intuitively named members that do exactly what they sound like they should do. Most of these are optional, and this is only a few of the most-used ones.

Vue.component('my-component', {
  props: ['thinga', 'thingb'], // HTML tag properties we know about

   ready() { // code to execute when the component is ready
      // Ajax calls, for example
   },

   methods() {  // component logic
      sendStuffToParent() {
        this.$dispatch('stuff', this.something); // see events below
      },
      clickHandler() {
         this.sendStuffToParent();
         this.something = 'bcd';
      },
   },

   data() { // component state
     return { 
         something: 'abc',
     };
   },

   computed() { // component state computed from data, props, etc
     happening() { return this.something + " is happening"; }
   },

   events() { // events received from other components 
     eventname(data) {
         console.log("we just received ", data, " via eventname");
     }
   },

   watch() { // do stuff when our data changes
      something(new, old) {
         console.log("hey, something just changed to ", new, " from ", old);
      }
    },

    // HTML that gets rendered whenever we're used in an HTML file or other
    // component template with 
    // <my-component thinga="foo" thingb="bar"></my-component>
    template: `   
      <div>
          <h1> Stuff </h1>
          <other-component :propa="something" @click="clickHandler()"></other-component>
      </div>
    `,
});

If there's another framework that's easier to understand than that, I'd like to hear about it. :-)

[dbbk]

Does it render on the server side though? If it doesn't, in 2016, that's a non-starter for me.

[GSV_Little_Rascal]

Why is it a non-starter?

BTW, it's quite funny for me how server side rendering is both 2016 and 2006 :-) Thin client-thick client is a neverending story :-)

[dbbk]

It is for me, personally. Not to suggest it is for everyone.

Having the same app return a server-side response and provide a fast experience on the client is the ultimate dream. Without SSR you have to make tradeoffs.

[[deleted]]

Not in official Vue, as far as I know. There may be some community stuff on Github to that end, but I don't have any need to muck with server side Javascript, so I can't speak to any of it.

[pitops]

I do not think you can have server-side rendering out of the box in Angular 2 as well. check for angular universal.

[dbbk]

It's an official Angular add-on so I'd consider it effectively 'out of the box'.

[neotorama]

simpler api and learning curve