Time for Angular 2?

This post is more than 2 years old.

angular I've been avoiding even thinking about the latest rev of Angular as every time I did look at it, I came away with a headache. It was weird and the docs were even weirder. I saw plenty of blog posts on the topic, but in general they dealt with one small slice of Angular 2 and were too confusing for me to grok.

Over the holidays, I checked out the web site again (Angular 2 can be found at https://angular.io/ whereas Angular 1 is still at the old site: https://angularjs.org/). I tried the five minute quick start and while it took me a bit more than five minutes, it made a bit of sense. It certainly wasn't crystal clear to me, but it wasn't crazy either.

I then went through the tutorials and things began to make even more sense. I'm far from being even close to being able to build a demo with it, but the basics are beginning to click for me.

There were three things in particular I ran into that caused me grief.

  1. Working with Angular 2 means working with TypeScript. I like TypeScript. But I'm kinda disappointed that working with Angular now means working with a build system to get it into the browser. To be absolutely clear, I'm not saying this is bad. I'm just saying I feel a bit disappointed that this is required now. I'll get over it.

  2. The @Component stuff was terribly confusing to me until it finally sank in that those blocks are providing metadata to the classes. It seems so obvious now, but I just couldn't understand what in the heck stuff like this was doing:

import {Component} from 'angular2/core';

    selector: 'my-app',
    template: '

My First Angular 2 App

' }) export class AppComponent { }
  1. One thing I really didn't like in Angular 2 was all the different types of "syntax sugar" being used in templates. Here are just a few examples: [(ngModel)]="foo.name" and *ngFor and (click)="something". I figured there was no way in heck I'd be able to get that right. Luckily - there's a great cheat sheet that nicely documents all this and is easy to use.

So what's next? I plan on making my way - slowly - through the rest of the docs. I'm also going to reread the tutorials a few times. I then need to make the time to look at Ionic 2.

For a while now I've been telling people that - at least in my opinion - it was too early to start playing with Angular 2. Now I definitely feel like it would be a great time to start playing with it and - possibly - even building real apps with it. I'd love to know what my readers think so leave a comment below. Are you using Angular 2 yet or have you been holding off?

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA https://www.raymondcamden.com

Archived Comments

Comment 1 by Rob Caldecott posted on 1/18/2016 at 8:13 PM

We've switched to using React/Flux for new projects and are much happier for it.

Comment 2 (In reply to #1) by Raymond Camden posted on 1/18/2016 at 8:15 PM

I looked at React too but it doesn't quite feel right. Not yet anyway.

Comment 3 (In reply to #2) by Rob Caldecott posted on 1/18/2016 at 8:20 PM

I'm hooked. It's the most excited I've been about a new technology since Node. React Native also has great potential but isn't ready for prime time yet. But React itself flies and is incredibly stable. YMMV obviously, but the virtual DOM and component nature of the framework means you're productive quickly and your UI logic is insanely simple.

Comment 4 by Matt Dyer posted on 1/19/2016 at 10:44 PM

It seems to me like you don't have to use Typescript. https://angular.io/docs/js/...

Comment 5 (In reply to #4) by Raymond Camden posted on 1/19/2016 at 10:47 PM

Would I sound dumb if I said I didn't even notice the drop down?

Comment 6 (In reply to #5) by Matt Dyer posted on 1/19/2016 at 10:48 PM

haha that's ok. I don't think I saw it right away either.

Comment 7 by Kurt Wiersma posted on 1/21/2016 at 11:44 PM

Initially I was questioning Typescript too but now I wouldn't do a project with out it. It is has really helped some of the junior devs I have worked with write better JS code via the TS compiler. It has also helped me learn the AngularJS API (both 1.0 and 2.0) with the nice code complete you get in VS Code or Webstorm/IntelliJ.

Comment 8 by Gábor Soós posted on 1/26/2016 at 4:10 PM

"Working with Angular 2 means working with TypeScript"
Errr...the developers of Angular 2 suggest it, but it is 100% usable with Javascript.

Comment 9 (In reply to #8) by Raymond Camden posted on 1/26/2016 at 4:17 PM

Yep - I was wrong. Someone else pointed it out in the comments below. :)

Comment 10 by Norman Klein posted on 1/26/2016 at 8:22 PM

I don't see how the new features really add anything. I wish the developers had concentrated on completely removing (100%) the need to use JQuery. The new Angular is still nothing more than a bloated JQuery container

Comment 11 (In reply to #10) by Raymond Camden posted on 1/26/2016 at 8:26 PM

Curious - why do you say "need to use jQuery" - I rarely, if ever , use anything jQuery related in my Angular apps.

Comment 12 (In reply to #11) by Norman Klein posted on 1/26/2016 at 8:28 PM

Don't you use directives? Most directives are nothing more than JQuery containers. Less than 10% of the code and more than 90% of the problems. The effort expended on Angular 2 would have been better spent removing that last little bit and becoming 100% virtual instead of dependent in any way on the browser.

Comment 13 (In reply to #12) by Raymond Camden posted on 1/26/2016 at 8:35 PM

I guess I'm revealing my ignorance then. I use directives a bit - have written one - but I didn't think that was jQuery itself. I seem to remember reading that Angular included a stripped down version of jQuery internally, but that it wasn't exposed.

Comment 14 by Lars Jeppesen posted on 1/30/2016 at 11:10 PM

Built my first larger application with Ng2 and love it like crazy.

One quick comment: the "banana in a box" notation (2way binding) is to be avoided if you can.

I'm in love with Observables, they are so powerful that is is a total game changer for me.

Comment 15 (In reply to #10) by Lars Jeppesen posted on 1/30/2016 at 11:12 PM

Who uses JQuery?
Where do you see any jQuery references?
What does that have to do with the Angular2 framework?

Comment 16 (In reply to #0) by Lars Jeppesen posted on 1/30/2016 at 11:13 PM

You can also use Angular2 with Redux.... it's really independent on the framework you use... or library (in the case of React). But I*m with you, I like the Angular approach much more.

Comment 17 (In reply to #3) by Lars Jeppesen posted on 1/30/2016 at 11:16 PM

To me it seems more close to Scientology than anything else.

For example: Flux has nothing to do with React. But React developers always sound like it only works with React.

You're comparing a library that has been in v. 1 for a year, with a framework that just came into beta? And then you praise the "component nature of the framework", knowing that Angular also uses this structure? (plus much much more).

There are too many things that React cannot do and you're ending up using a myriad of libraries to complement it imho.

Also, the core Angular team is way nicer than then React ditto :)

Comment 18 (In reply to #12) by Nicholas Johnson posted on 2/4/2016 at 9:48 AM

Ideally you use templates instead of direct DOM manipulation in your directives. There are very few problems that can't be solved using templates. $ is a last resort (but still useful) or you can just use DOM scripting for the occasional direct manipulation that's required.

Comment 19 (In reply to #8) by Nicholas Johnson posted on 2/4/2016 at 9:49 AM

You can write it in plain ES5, but your life will be less fun if you do so.

Comment 20 (In reply to #19) by Gábor Soós posted on 2/6/2016 at 10:40 PM

You can write it in ES6/ES7 and your life will be fun again :)

Comment 21 (In reply to #20) by Raymond Camden posted on 2/7/2016 at 2:54 PM

I'm digging parts of ES6/7 so far - and others are confusing. It will come in time.

Comment 22 (In reply to #13) by Nicholas Johnson posted on 2/17/2016 at 5:59 PM

Directives are not jQuery. You are allowed to use jQuery in your link function in a directive, but it's a last resort thing. You'll only need it for your most complex components. Templates are the right way.

Comment 23 (In reply to #7) by Nicholas Johnson posted on 2/17/2016 at 6:01 PM

I think TypeScript probably shows its power in a larger team of mixed ability developers. For a lone dev, or a small team, strong typing seems like overkill.

Comment 24 (In reply to #4) by Nicholas Johnson posted on 2/17/2016 at 6:04 PM

The JavaScript documentation is several steps behind, and often out of date. Decent JavaScript documentation is still hard to come by at this point in time. I'm sure this will change. I'm working on a set of JS Angular2 docs at the moment, similar to the series I built for Angular 1.

Comment 25 (In reply to #19) by Nicholas Johnson posted on 3/7/2016 at 7:24 AM

Actually, I retract this comment. You can write fun Angular in ES5 / ES6 or ES7.

Comment 26 (In reply to #0) by Raymond Camden posted on 12/22/2016 at 2:30 PM

This article talks a lot about issues with digest/scope, and I can say I ran into that a lot with Angular1. I just assumed it was always my fault, but it was probably my main annoyance with Angular 1. I haven't seen that once with Angular 2. :)