048

048 AiA The Road to NG2


03:51 – Dilemma of Choice: Onboarding Process

12:45 – Frameworks => Structured Languages

  • Are we leaving behind the casual web developer?

17:47 – Do Angular 1 with TypeScript, etc., before doing it with Angular 2

20:46 – ES5 with Angular 2

23:45 – Wrangling Tools

28:58 – If you’re starting an app now…what do you do?

39:36 – Applying Concepts

42:12 – Repos

Picks

The Phoenix Project: A Novel about IT, DevOps, and Helping Your Business Win by Gene Kim (Lukas)
Arrow (John)
Ex Machina (Ward)
Listen to other people’s views (Chuck)

This episode is sponsored by

comments powered by Disqus

TRANSCRIPT

LUKAS: [Singing] Can you hear me nooooooowwwwww?!!?!?!?!

CHUCK: [Laughs]

LUKAS: Rock!

WARD: That’s the Lukas I know.

[This episode is sponsored by Hired.com. Every week on Hired, they run an auction where over a thousand tech companies in San Francisco and New York and LA get on JavaScript developers providing to put the salary and equity upfront. The average JavaScript developer gets an average of 5-15 introductory offers and an average salary of over $130,000 a year. You just can either accept an offer and go right into interviewing with the company and neither with that any continuing obligations. It’s totally free for users, and when you’re hired, they’ll also give you a $2,000 signing bonus as a “Thank You” for using them. But if you use the Adventures in Angular link, you’ll get a $4,000 bonus instead. Finally, if you’re not looking for a job but know someone who is, you can refer them to Hired to get a $1,337 bonus if they accept the job. Go sign up at Hired.com/AdventuresinAngular.]

[Does your team need to master AngularJS? Oasis Digital offers Angular Boot Camp, a three-day, in-person workshop class for individuals or teams. Bring us to your site or send developers to ours — AngularBootCamp.com.]

[This episode is sponsored by Wijmo 5, a brand new generation of JavaScript Controls. A pretty amazing line of HTML5 and JavaScript products for enterprise application development. Wijmo 5 leverages ECMAScript 5 and each control ships with AngularJS directives. Check out the faster, lighter and more mobile Wijmo 5.]

[This episode is sponsored by Digital Ocean. Digital Ocean is the provider I use to host all of my creations. All the shows are hosted there, along with any other projects I come up with. Their user interface is simple and easy to use. Their support is excellent. And their VPSes are backed on solid-state drives and are fast and responsive. Check them out at DigitalOcean.com. If you use the code “angularadventures” you’ll get a $10 credit!]

CHUCK: Hey, everybody! Welcome to Episode 48 of the Adventures in Angular show. I almost said Angular something, something, I don’t even know. Anyway, this week on our panel, we have Lukas Reubbelke.

LUKAS: Hello!

CHUCK: Ward Bell.

WARD: How do you do?

CHUCK: John Papa.

JOHN: Hey, everybody!

CHUCK: I’m Charles Maxwood from DevChat.tv. So, we kind of set this plan in motion and we’ll see how it goes. We’re going to do a two-parter here, and I’m not sure if the next part is going to be in a week or two weeks, but we’re just going to have to see.

The first part is the one we’re going to do today. We’re just going to talk about where things around right now with Angular 2 and the things that we’re looking forward to, the things that we’re worried about, some of our experience in just looking over the docs and trying to set it up initially. And then, we’re going to go and we’re going to do a little bit more deep dive on our own. And then in a few weeks, we will actually come in with a little bit more experience, talk about what we’ve run into.

So, the first one is kind of, “Hey, we’re a little bit new to Angular 2 just like everybody else so we’re just kind of looking at where things are going and we’re going to talk about what we like and what we don’t like and what we see.”

And then the next one will be, “Hey, look, we’re Angular 2 experienced or more experienced, and here’s the experience we had.” So, it’s going to be more of an experience report coming up.

JOHN: Yeah, I think that’s the way to go, man. It’s really that “onboarding”. It’s not that anybody disagrees or agrees with looking at what Angular 2 is trying to be. It’s more from the stand point of, “I’m new to Angular 2, what is the experience today? What else in alpha to get on board and start using this thing?” I think that’s an important place because a lot of developers are there right now along with us.

CHUCK: That’s funny! I’m new to Angular 2 as well!

JOHN: Hey!

LUKAS: Everyone is new to Angular 2. That is the beauty of it.

CHUCK: Yup.

JOHN: I know Ward is going to skip right to Angular 3, but yeah, the rest of us need to go right to Angular 2.

[Laughter]

WARD: I just want to know where the puck is going to be, you know, and skate there.

CHUCK: I can start this off. And I’m comig from a little bit different place. I think most of you guys do your work on JavaScript backend, and I am much more in the Ruby camp as far as the backend goes. So, I don’t spend as much time doing like ES5, ES6 stuff. And then, seeing all the options with TypeScript and ES5 and ES6 and Dart and whatever else they’re going to support, I’m just not completely — it’s almost like a dilemma of choice, it’s like which one do I go with and why and how, especially since the browser does ES5 so everything else is going to transpile anyway.

JOHN: Let’s start with “what is the concept now?” If you’re new to Angular 2 but you’ve done Angular 1, let’s start there. An Angular 1 expert developer of some sort, what is it you have to do to get to Angular 2? You really have to start familiarizing yourself at terms you’re getting thrown out like possibly TypeScript or ES6 or Babel or Traceur. Or maybe, you have to learn about SystemJS as module loading to all that seems to be inherit and where we’re heading. What’s CommonJS, and should I be using AMD or that? Or, should I be using SystemJS? And then, what about JSPM? There’s all these things that are being thrown at us that we have to break down. I think, for me, it’s all about how do you start most easily. If you’re an Angular 1 developer, how do I take just one of those things first and say, “How do I write Angular 2 and which of those things do I have to look at?”

WARD: And to just set the table for you, I just did something that I think is kind of interesting. First thing, I went to Angular 1 homepage, angularjs.org, and what the very first thing is that it shows you how to do that something called “The Basics”, if you scroll to it. It’s a single HTML page with a single script tag in it, and it’s 14 lines of HTML. And just like that, you have your first Angular app.

In contrast, you go to the Angular 2 5-Minute Quick Start, and you’ve got scrollable page and 8 steps.

LUKAS: Blah, blah, blah, blah…

WARD: Which involves enormous amounts of like what’s this, what’s that, what’s the other thing, you’re not in HTML, you’re all over the place, right?

Now, I don’t want to draw any conclusions from that. Other than that, the obvious one, which is if you’re coming fresh to these two things, one of them looks really easy and the other one doesn’t, and it’s just that simple.

LUKAS: So, let’s take the first two steps of the Angular.io Quick Start that you just mentioned. I did it the other day and right in the first step is, you have TypeScript then they start talking about TypeScript Definitions, and about this repo called “DefinitelyTyped”, so it’s like, “Whoa, what is that thing?” so then I had to go look at that. And then, you go into the second step, they got this TypeScript compiler thing with all these flags, –watch -m commonjs -t es5 on and on and on, so I said, “What are these things even mean?”

WARD: Don’t forget Node and npm, which you might not know.

LUKAS: Right, absolutely. So I think two things is interesting and that is, it is a 5-minute tutorial if you go straight through it and you don’t actually try to understand it. So if you just type everything out, boom, boom, boom, it’s done.

But in my case, I was like, “What are these things? What did it actually do?” as well as actually how much, I think, like pumping ceremony actually went into actually getting this up and running, which actually had very little to do with Angular.

On the flip side is, once it was finished, I actually thought it was fairly elegant and I actually liked what it ended up with. But, it was just such this huge leap of all these other things you had to do in conjunction with actually writing the Angular piece as well.

CHUCK: I wanted to say that, with new technology, even if it’s technology that is theoretically version 2 of what I’ve used to in version 1, it’s nice to have something up and running that I can fiddle with. So for having something up in 5 minutes, that’s nice. But I completely agree with you on the other stuff.

JOHN: I agree. As I went through the 5-minute thing more than once — I will admit, I took longer than 5 minutes! I know most of us technologists, you said, Lukas, I know TypeScript and DefinitelyTyped repo, I know Node, and I know SystemJS enough to go through all these, and it took me longer because a lot of this is figuring out what part of the spiderwebs do I have to connect to the others. And their always settings are wrong and my worst part of it is, there was no downloadable sample like in run. Everything is a tutorial run this, run this, run that, but the other moving part was nobody talks about is, “Oh wait, you’re using TypeScript 5 Beta 2, you need TypeScript 5 Beta 1 to do that. Oh, and this configuration settings no longer call this, it’s called that,” you start getting into this “little things are changing because it’s Angular alpha”, but TypeScript features that are supporting it aren’t fully released yet. And then, some of the stuff with just setting up how they all connect together isn’t exactly be.

So, it’s not just that the tutorial of many things, it’s also hard to find a running sample because a lot of the samples out there, the syntax has changed so much, it’s hard to do that!

WARD: I thinks it’s also only fair to say that I don’t think all of these can be laid at the doorstep of Angular 2. I just went over to the Aurelia Getting Started — well, I’m one of those people who thinks Aurelia is pretty elegant — and it too, is a long scrollable page involving many of the same technologies that we’re talking about, there’s no just dropping something into an HTML page and executing it.

And I think, what we have to face here is that we are in making these moves to these new frameworks. We’re simultaneously committing ourselves to dealing with things like ECMAScript 6 — we all then only support ECMAScript 5 so you have to do transpiling, which immediately gets you involved with some clients’ side server technology like Node. We’re choosing this complexity by virtue of trying to move on many fronts forward into a world that isn’t here yet. And I just don’t know that there’s an easy way to cross that bridge yet. What do you guys think?

JOHN: I agree. I mean, I’m saying these things and there’s friction. The facts are, today, whatever you think of Angular, whatever you think of all the module loaders, and all the other Tools that are out there, there’s friction as a fact. I don’t know if you can avoid it, though, because whether you do Angular, or Aurelia, or React, or any of the new modern technology frameworks that are coming out, learning these things is inevitable. And I think, transpiler is just something we all have to get used to, but it doesn’t change that there is friction. And I think, there is a huge opportunity here, and I think the Angular team is willing to do this (I know they are) to find a way, and I’m sure Aurelia is, too, to polish it, to make it easier. Let’s first get it working, I mean its alpha, and then let’s polish it so that a lot of the ceremony that you had to do to set this up is easier.

So, I think that’s going to happen. I’m confident it’s going to happen. If it doesn’t happen, then we’re all in trouble [chuckles].

WARD: Well, they seem to feel that that’s going to be the case because they have a big blue box that begins “This quick start does not reflect the final development process”. So I don’t think this is the way we’re going to roll, either.

CHUCK: Yeah. But the one thing that I am seeing here is that this is the kind of thing they want people to be doing. In other words, they want people to be writing TypeScript. They expect people to be doing a lot of these other things we’re talking about. If they were concerned about adoption or people being able to just reach in and approach it, then they’d be writing it in ES5, and then there wouldn’t be all these extra steps; there would just be, “Okay, you include Angular 2, you include your JavaScript file that has your other Angular code in it, and then off you go!”

WARD: No question.

JOHN: Yeah, because say there’s — it’s the onboarding process — someone to learn Angular, everything’s fine, right, so it’s just like Angular 1. Once you learn all these things, everything’s fine. And people would say, “Well, Angular 1 was hard.” It’s not as hard as Angular 2 in the beginning, I’m going to say it’s another way. Getting started with Angular 1, I can teach any developer in under an hour the basics of Angular 1 to get him functional. Dan have this wonderful Angular 20 minutes video that he does, Dan Wahlin, that you can really get the basics out of there.

Angular 2 is not there yet. And it’s not just Angular 2, it’s all the new frameworks. The better side of that, though, I think and I’m sure you guys think is, what do you guys feel about this new frameworks moving towards more structured languages like ES6, TypeScripts, Annotations, and Module Loaders?

LUKAS: If I can make a comment to that real quick, John because I think it’s a good segue is, JavaScript development as a whole has actually changed the corner where not too long ago, it was just HTML and JavaScript you load it in a browser. But I just went to the React site under space at command-line tools, if you go to the Aurelia site, there’s command-line tools, Angular.io command-line tools, so to do any kind of modern JavaScript developemnt, is you have to actually learn some of these additional tools in the ecosystem to be effective. So this is not Angular-specific; this is JavaScript development is turning a corner. It’s kind of growing up if you want, and I think it’s a very good thing. But I think you have to be cognizant of the fact that the landscape is changing very quickly around these things.

JOHN: Somebody moved our cheese, man.

CHUCK: [Chuckles]

JOHN: You’re absolutely right. And, it’s okay! I’m actually excited. I was up until 2 in the morning last night with Dan Wahlin playing around with some Angular 2 stuff or TypeScript and ES6, and we were having a blast, but we’re also wanted to [incomprehensible] at certain points or some things. It’s fun. And I think, people need to realize that it doesn’t matter if you go to Angular 2, like you said, Aurelia, or whatever is the next, the Lukas Ruebbelke framework, whatever comes out, man, this world is changing. It is no longer “write a JavaScript, stick it in file from run”. Absolutely correct.

LUKAS: Yup.

CHUCK: So the thing that I’m wondering then is, does this take this out of the hands of the casual web developer? Or, are we leaving behind the casual web developer by assuming that they understand and will use these tools?

WARD: I think so. I don’t think that…

JOHN: I agree.

WARD: I don’t think that this client’s side application development world, I think that train left a long time ago. As soon as you stopped being a script kitty and just making your page a little more lively and enter the world of trying to build on application that lives on the client versus staying period of time, you entered the world of professional software development, and it’s goodbye to the old script stuff.

CHUCK: So the thing that I have to wonder then is, what do we gain by that and what do we lose?

JOHN: Ah! So let’s think that “why we’re going there”, right?

CHUCK: Uhm-hmm…

LUKAS: Pretty much.

JOHN: In modern web development, we’re doing a lot of web development lately with JavaScript and SPAs (Single Page Apps) and all these in the last couple of years. What’s happening is, that has really supplanted the standard Enterprise desktop application in a lot of ways. So by doing that, we need to have like DevOps, we need to have BuildTools, and we need to have Type Jacking, or something that does seem kind of code quality or limiting upfront. We need all these things that package our modules together and load them on time. And, we need quality code. To do that in the Enterprise, I think that’s where a lot of these things have really evolves in my mind. It’s not for the script kitty. I think, that’s why these things are here, evolved, and the Tooling has following behind it, and I think it’s a good thing. But it has absolutely changed and it’s no longer, “Hey, I can learn JavaScript in a week and then I’m a developer”.

LUKAS: And not only that — I think definitely code quality and having some hooks into the basic continuous integration, etcetera, but also for, I think, productivity and the ability to actually create things; it’s just a break neck pace so I’m a big fan of ionic. So lay hook in the Grunt and different things as you can generate a mobile app from the command-line in just seconds where years ago, that would have been just impossible so then being able to deploy this and push this out to build server or a web server somewhere. And so one code quality, but definitely I think the speed of development has just exponentially increased as a result of this new and improved tooling, which is really exciting.

CHUCK: So, that’s the upside, right? In fact, if you go talk to anybody business, their cost is going to be in their people. And so, if you can cut down an hour a week even on a large enough team, you’re going to save the company a significant amount of money. Furthermore, developers feel like they get more done. I mean, we’re gaining by having these kinds of set ups, but we’re also adding complexity. I think the tradeoff is worth it, but I also want to explicitly call it out.

JOHN: We should talk about what are some of the tangible things people can start with right now to get started. We tossed out some terms, but for me, the first step in learning Angular 2 should be still to go out to that Angular in 5 minutes on angular.io. Do you guys agree with that?

LUKAS: I agree.

CHUCK: Yeah. At least you have something you can set up.

JOHN: Yeah, and that’s the one demo that you know will be updated to be compliant and compatible, has the alpha evolves into a beta.

The other thing I would recommend (which helps me the most) is, I saw the terms lying around the SystemJS and JSPM and TypeScript and Babel and all these, what I wanted to figure out is, before I do Angular 2, the first thing I wanted to make sure I’ve got was, what if I just try to do Angular 1 with TypeScript or ES6? What would that look like? And not just do it in those things because I’ve been there, but do it such that I could build that code using modules that ES6 and TypeScript both like so that when I did go to Angular 2 as my code — I need to be rewriting because the syntax is different — but when I go to Angular 2, I’m not coding differently. In other words, use Classes, use Exports, use Modules, use Functions inside of Es6 or TypeScript, and see how all those work in Angular 1 today so at least that’s something that’s baked and you can learn it and try it now so that’s the one last thing you have to learn when you go to Angular 2.

LUKAS: That is excellent advice. And to that, I’m just adding a little story, Scott Moss actually writes all of his JavaScript Angular 1 in ES6 using Babel. As a result, his transition to Angular 2 has been pretty easy to where him and PatrickJS, Patrick Stapleton, they were actually showing me where they were able to use a single TypeScript service or service they wrote in Angular and TypeScript for Angular 1 and Angular 2, which I think is really, really interesting, and I’m going to ask to be blogging about this very soon. But moving to either writing, just moving yourself into TypeScript or ES6 using Babel and just learning how that works and that flow is going to make it just much easier to transition into Angular 2.

WARD: Well, Lukas, you’re just like you’re heading into one of the things that has got me confused, which is TypeScript does it this way and has its own transpiler to ES5 or whatever. And then you’re talking Babel and you’re talking Scott and those guys are doing a combination of TypeScript and Babel (I’ve seen that in others, too), and I don’t know what that means. That sounds like clashing tool sets, is that not the case? Is there way through that more as?

LUKAS: I have not heard a definitive answer on ES6 first TypeScript. I know they use them both. I know Scott personally prefers ES6. But in this particular example, Patrick was showing me is, it was the TypeScript. Example were an Angular 1 app and Angular 2 app was using the same service which is interesting.

So some of these things, I think even people like Scott and Patrick are still trying to figure out what they like best, and they don’t have formed opinions either so they’re in the same boat as us. It’s that everybody is a new Angular 2 developer, and trying to figure out what works and what’s the best and how it’s going to look as we drive this forward.

JOHN: One of the things that I have complain with, too, is trying to figure out can I do ES5 with Angular 2? Have any of you tried that?

LUKAS: Nah.

WARD: No, but it looked easy.

JOHN: Where did you see that? You talking about ng-conf?

WARD: I was joking, John.

[Laughter]

LUKAS: Troll!

CHUCK: Well, I’m assuming that it compiles down, but I have no idea how clean that code is because I just run it through the build process and then see that it works.

JOHN: The reason I bring that up is, I remember hearing at ng-conf they were talking about how you can do that, and I haven’t seen any substantial app doing that yet. Brian Ford had a really interesting slide about how you can take your Angular 1 app and then start slowly adding in modules in Angular 2. I’ve yet to see that, but that really intrigues me because that can be an interesting migration story.

CHUCK: Yeah.

JOHN: But for today, I think I can’t imagine writing Angular 2 and ES5 and the reason being is, a lot of this stuff is depending upon the Annotations and the Classes and how that’s working. To me, if I’m going to go to Angular 2, I’m going to go to ES6 or TypeScript, one or the other.

WARD: Yeah. All of it, obviously, it transpilers to ES5 so one could do, you just simply look at ES5 and say. “Why didn’t I write that the first time?” But when you do look at it, what you’re essentially doing is taking the function that would have been embedded, that you would write in lieu of the Class and then sticking stuff onto it, and that just looks so painful relative to having some tool and do it for you that I wouldn’t know why you didn’t try it.

CHUCK: Yeah. I’m assuming the overheads got to be killer and all the ceremony to make it behave the same way.

JOHN: Well, I wrote an app last night using ES6 with Angular 2, and things worked out. If there were struggles, it wasn’t Angular; it was trying to get JSPM to behave and SystemJS — I didn’t need JSPM, but I want to try it, and getting things to work properly with it and transpiling properly. But once I got it, it was okay and things were fine. Then I tried going over TypeScript to do it, and I actually found that doing it in TypeSCript, I like the code better; it felt more natural for me to do that. I felt like if I was going to use Classes and these structured languages anyway, I might as well throw Types and Annotations in.

WARD: Well, then you get a [incomprehensible], right? Not only do you get the transpiling, but you get the design time assistance that comes with having Types and Tools that understand those Types.

JOHN: Exactly. The Tooling experience was much better, in my opinion, using the TypeScript to do it at this point to move that forward. I think I read this, I may get this wrong but one of our readers  or viewers can correct me, TypeScript 1.6, I believe, they have a road map to or have an option for transpiling and working with the Module Loader or SystemJS. Right now, it’s just CommonJS or AMD, I believe SystemJS is on their list.

CHUCK: I do have to say that you saying that you had to angle things to get JSPM and some of the other Tools to get into line, it does make me worry a little bit. How hard is it going to be to pull in other Tools?

JOHN: I wish it was easier. Every blog post I read or somebody’s trying it or some demo that I fall down, they all have something different that they’ve done, and they might be subtle things. First, you think this guy is saying the same thing that lady is saying, but then you actually look at the code and one line, some very important line, is very different. And for some reason, because of the point of time or each person grab the alpha, it both worked. For example, the way that the Annotations are exposed from the Angular library, and supposed you don’t know Angular is written in TypeScript if you go look at source code, the way the Angular Annotations are exposed actually changed at one point on the alphas and one sample I ran was working because of that, the other one wasn’t although I could clearly see that the source code the person wrote the blog post in it worked at the time when you get back at the GitHub history, which brings me to my next tip. If you’re doing Angular 2 right now, you can almost forget looking at the documentation you might had. Go to the source code, go right into GitHub repo, look at what the files are doing and exposing, that’s the source of truth. It’s saved me many times when I was reading someone’s sample trying to figure out how they got it to work. It’s because when they wrote it, it looked different. So the source code has helped me out a lot.

LUKAS: Pro tip!

WARD: Do you have a feeling that that’s settling down at all, John? Or, do you feel like all you see is stuff on the move? Like last week, we learned that ng-model is back. What’s your sense?

JOHN: I’d love to say it’s settling, but I don’t get a good feeling yet. Again, it’s still alpha, and I’m just being honest. I love Angular, I love what the team is doing. I just feel like, and rightly so, they need to get it right before they go live. So I’m willing to give them that flexibility now saying, “You know what, let’s change the API, make it better, reduce the friction.”

For example, having to list that every Directive that I have on a View, I have some Views that have 20 Directives on it, and I’ve got to list 20 Directives on my View, on my Component. That’s a pain!

WARD: I heard they had something where you could refer to something that itself wrap those up sort of nested, does that not yet available?

JOHN: I’ve also heard that. I haven’t seen it, though.

WARD: So you’re scaring me, John…

CHUCK: [Laughs]

WARD: And well done! But I’m going back to your sort of “how to get best prepared for Angular 2” and you’re leaning me back towards “maybe what I should try and see is what’s some of this new world looks like as I try and write NG1”. Maybe that’s the place, if I’m coming through this, I should be thinking about in terms of preparing myself for NG2, rather than trying to both master the Tooling and disable the moving target. What’s your sense on that?

JOHN: I think, to me, that’s where it’s gone. I dove head first. Let me try to share learning lessons with Angular…

WARD: With no water at the bottom of the pool, you dove head first in an empty pool [laughs].

JOHN: [Laughs] I did! I’m like, “Hey, I’m an Angular experienced dude, I can just take this stuff and run. Throw it at me! JSPM, SystemJS, I got Ward Bell with me, I could do anything!” Yeah, it’s diving head first. And I’d say at first “throw it all at me, let me try it out, experienced Angular guy”. I went down there, I’m like, “Alright, I know TypeScript, I’ve done this for years.” And TypeScript recently changed because it absorbed AtScript so there’s things there that I had to go figure out how to use. And then that’s still evolving coming out. And then SystemJS was brand new to me so I had to figure out how to use that. And then how to connect those two to the evolving APIs of Angular, and then really understand it’s not the syntax that’s hard, it’s the “what is it I’m supposed to be doing to do what I used to do?” There’s no Controller or Scope so how do I get a Class so the Component and the View work together.

The mistake I think I made was trying to get it all to work at the same time. So, what I would do in hindsight is what I’m doing now. It’s “Hey, step back, let me make sure I’d rock ES6 and TypeScript modules first,” because that’s the hard at a lot of the stuff. Once you get that, I think, you can do that with Angular 1 now, I know you can. I’ve got some repos that we can share on the show notes to do it. The next step is, go look up SystemJS and how it works. It’s pretty baked. It’s not too hard to learn on it’s own and a lot of different libraries are using it. I think Aurelia is using it, isn’t that, Ward?

WARD: Yes, it is. Yeah, we’re using JSPM and I’ve had no trouble making existing breeze and PM modules accessible to JSPM, too. The good news there is that it doesn’t cut you off from everything that already exist; it incorporates it, which is a little boost here and there.

JOHN: Yeah. So I think I’d learn each of these one at a time and look at them separately. None of these are tied directly to Angular, but I think this is the new environment, just like think about 2 years ago when people were still learning what Gulp were and npm and Node. It’s been around for years, but mainstream like 2 years ago, this was really hit. So I think, even people who learned Angular, they had to learn something else along the way so I was looking at this “learn one thing at a time”.

I was going to ask you guys, would you guys recommend building an app with Aurelia, Angular, any of these new, Angular 2 for example, now? If you’re starting an app now, what would you guys do?

CHUCK: For me, I have to say that I’m actually tempted to try and build an app with Angular 2, but I’m not going to do it for any of my clients. For me, it’s going to be what does this look like, it’s going to be an experimental case. If I were going to go into client stuff, I’d stick with Angular 1 at this point. I might be tempted to try and do it in TypeScript or something like you’re talking about. But overall, I just don’t fell like Angular 2 is quite production ready and I don’t want to hold up any discussions of what value can be added because there’s something that’s not quite right in Angular 2.

JOHN: I think that’s a good plan and approach. To back it up, things like just making an HTTP request from Angular 2 right now, from the notes I’ve read and the things that I had to do, it’s not as clean as it’s going to be. They’re still evolving that piece. So I think it’s a great time to experiment to get ready, whereas 3 months ago, I don’t think I wouldn’t have recommend it to look at what’s going on because they’re too much evolving. I think it’s settled down enough at this point where anybody who has serious thoughts of getting into Angular 2 in the near future should at least grab the sample codes, go through that 5-minute quick start, and start getting yourself familiar with ES6, TypeScript, and SystemJS.

CHUCK: I have to wonder a little bit and maybe some of you guys can speak to this, but if I have some time that I can dedicate to getting ready for Angular 2, how much time do I spend on the current iteration of Angular 2 before I’m wasting my time versus doing something like Angular 1 and TypeScript or some of the other ideas that we’ve had?

JOHN: I guess it all depends on how much time you have, right, Charles? [laughs].

CHUCK: Yeah, ultimately yes, but I mean I can get in and start building something with Angular 2, but if half of what I learn changes up from under me by the time they’re done, then I don’t know if that’s really necessarily a great use of my time.

LUKAS: I think learning the ecosystem and some of these things surrounding Angular 2 is definitely not going to be a waste of time. So learning ES6, learning TypeScript, learning how JSPM, I think those are good investments for things that are going to happen in the future. So I would say if somebody is leery about starting Angular 2 right now, I would confidence can say, “Well, that’s fine” but definitely ramp up on ES6, TypeScript, and some of the philosophies around them and some of the programming decisions that you’re going to have to learn and start to implement. And that will better prepare you for when Angular 2 is a place where you feel it’s stable and you’re comfortable enough to start actually writing in it.

WARD: Systems things are sort of, or [incomprehensible] to the choice between Angular 1 and Angular 2. I say sort of. Would you then recommend learning those things in the context of an Angular 1 app?

LUKAS: Yup, I think that’s a great… I think you can start writing Angular 1 apps and ES6 for TypeScript right now and I think people should start doing that.

JOHN: Yes, absolutely. We had a great show with Dan Wahlin when we talked about that, and one more, Scott Moss, too, from different on Angular, TypeScript, and ES6.

Let me flip the bit a bit, meaning instead of railing on what’s wrong with it right now, let me tell you what’s right. I do think learning Angular 2 right now is a good thing. I don’t think it’s a waste of your time, Chuck. The things I’ve been learning in Angular 2 are what are the concepts. There’s going to be something that’s going to show of View, there’s going to be things called Components which are basic Classes. So learning how those things work together, that, I don’t feel is going to change. Learning how the Annotations work and why they’re there and how they met on those Components, learning how the Directives tie into the Components in Angular 2, forgetting about the exact syntax because syntax is going to change and who cares, man, syntax change as we evolve with it, but that’s the part to expect to be different and evolve. What I don’t expect will change — and the value that I’m getting out of my experimentation and having fun is, I’m learning what these concepts are, and overall, I like the vision of where it’s heading. I like the idea of what it’s doing because in the end, we’re going to get a more performant application and I feel like it’s going to be something that I will be able to write at design time and no one’s going to work without having to press run to go, “Oh my gosh, and now I get an error in the console window.”

So, I do think there’s value here, but you have to be prepared to be [incomprehensible]. There’s things that are not going to work.

WARD: John, let me push on this a little bit. That all sounds great for personal growth and many of our listeners are interested in growing their technical jobs and being on the front line and all that; Charles’ ways “Hey I got to make a living here”. Is there a way in which what you’re doing here, it has even a halfway justification in terms of View like going to your boss and saying, “This has value to you, boss, the fact that I’m doing this.” How might you explain that?

JOHN: I think the stuff that, the way you plan that is, I think the stuff that Lukas just pointed out. That works whether you’re in Angular 2 or not, I think that’s where you start. You learn the ecosystem,  you learn the concepts, you learn those tools in ES6 and TypeScript, that has value today in your corporation, a lot of value. There’s people like good friends like Jeremy Likness, Dan Wahlin, and myself leaning TypeScript for years with Angular, and it works!

I think the second step of, “Hey, boss, can I go write an Angular 2 app and learn Angular 2 because that’s going to give value to us in 6  months or a year,” I think that one is a little more edgy at this point. It’s still to be seen what the end product is going to be, but I think you can easily make the business case to say, “We need to start looking at ES6 now, we need to look at TypeScript, we need to understand SystemJS, we need to know what Gulp and Grunt and Node are.”

CHUCK: Yeah, I have to agree. I mean, you’re going to come out of it at least with some nice power tools, right? This is the way I look at it.

JOHN: Yeah!

CHUCK: You’re going to have your power drill, you’re not going to have to hammer anything in anymore because you’ve got an air compressed nail gun or brad gun. I mean, you have the power tools. And then I reallly liked your point that we can learn new APIs. I remember when they first announced that they were moving away from certain aspects of Angular 1 and Angular 2 at ng-europe and people were all up in arms because it was all changing.

The thing is this, a lot of the concepts are saying the same. They’re just functioning a little bit differently and some of them are more explicit and others are less explicit than they used to be. But yeah, we’re smart people. They’re listening to what we have to say. So if the APIs change, we can pick that up.

JOHN: Yeah. And the good news is this, there’s people out there like Dan Wahlin. We’ll keep leaning on him because I think there’s people like him that we can look to. As an average developer doesn’t have time to look at any of this stuff, there are plenty of people like Joe Eames or Dan or some of us who are exploring these and over the next couple of months, we’re going to have blog posts and articles and videos on showing people, “Okay, this video I’m making that’s an hour long, I spent a hundred hours trying to figure out how to get here. But here’s a one hour example of how you can do this.”

CHUCK: Yup.

LUKAS: Yeah.

JOHN: So there’s people smoothing the roads for you for those of you who don’t have time to get into it.

WARD: Let me try this a little business case for why your boss should empower you to look at that, at NG2, at least to some extent. It’s the same one that I use for why I’m looking at Microsoft’s ASP.NET 5. Mainly that, at every point, my busines is trying to figure out whether it should stay the course, how long it should stay the current course, and when it should be planning to make the move.

Now, I can wait for somebody outside to tell me. But my organization trust me to give them the real skinny on where does this stand, how close is it, when should we think about making the move. And the only way I can answer that is, as much as I love all the guys that you’re talking about, I’m going to read all their stuff, I wouldn’t feel comfortable going to the boss and say “Well, Dan or John says…” without having a taste of it myself. So that maybe how you can justify to the boss that they should give you at least a certain amount of time to be on that stuff.

JOHN: Yeah, and I agree. You should never just read somebody’s post and say, “I’m going to do this because someone did it.” You should read the post then you should go try it yourself and then make your own determination.

CHUCK: In poker idea, just of it a little.

JOHN: But I don’t think that everybody has the luxury of — I’m playing both sides of this coin on purpose — I don’t think everybody has a luxury today of saying, “Hey, I’m going to go spend 20 hours or 40 hours this week playing with the technology we may never use.” I wish everybody could do that. And that’s part of my job at my location where I do, so it’s fun. But, man, that’ll be awesome if you’re all going to do that.

WARD: No, I’m totally agreeing with you. But I do think some of us aren’t tasked with knowing where the frontier is…

JOHN: Yes.

WARD: And yet, we can’t… Like there was a time, even though I’m tasked with knowing where the frontier is, I wasn’t on attached at NG2. Even though I know what the front tier is, I wasn’t messing around with ASP.NET 5 because that was a total waste of time. Now, what I’m hearing is, “Okay, it’s close enough that we would actually be able to report back or something with some useful knowledge.”

JOHN: Yes. Early on, just a couple of months ago, maybe 5 or 6 months ago, the Router wasn’t working and the Data Binding wasn’t working and we couldn’t make HTTP calls, it’s like when you’re breaking all the pieces, not breaking, but when they’re not there yet, it’s hard to look at something fairly evaluated.

Now, enough of the framework is in place where I feel like you can make enough of a judgment call to get an idea of how is this thing going to form. It’s like one of those you’re seeing one of those pictures where somebody like starts materializing a picture in front of you, like on a video screen, and you’re trying to guess what this thing is going to be and when it’s fully formed like, “Hey, that’s Ariel from Little Mermaid,” or whatever it is. So they’re pieces falling into place for this diagram, and I think there’s enough of those pieces there now where you can make your own evaluation and say, “I know where this is heading and it interests me.” Or, “I know where it’s heading and it doesn’t interest me.” And then, you can go play with it.

WARD: So if I can’t because I know our time is moving, I’d like to think about how we can take this discussion on the things we kicked around here and make some proposals about what we would do if we came back in a week or two and told everyone at home what we have learned about these two directions. The one being making TS and some of the modern tooling together with Angular 1, and then first steps in Angular 2. Do we want to say anything about what we think we’ll come back within a week or two? What kinds of things we’ll be able to talk about?

JOHN: I think, it’d be great for us, I know personally, I’m going to be exploring TS, TypeScript, with Angular 1 a little bit more and I can report back of not just using of a TypeScript, but also using it with the mindset of how would I also adhere myself to go to 2 and how are the modules work, how would I architect my Angular code, get away from functions so much and move more to Classes with it. But also, I want to look more into how can I get TypeScript, how can I write TypeScript with Angular 2 now with SystemJS and connect all the dots better, easy way that isn’t a scrollable long webpage. That’s my short term goal.

WARD: I like that, John. I like to be able to come back and say, “Here are the top 5 lessons learned for going Angular 1 with the new set and here are the top 5 lessons learned just to try and bring up a to-do sample in Angular 2.” I don’t know about you guys, but I’d love to come back and be able to report what we know and don’t know as a result of those exercises.

LUKAS: My goal would be to take the ecosystem that exist around Angular 2 and apply that to an Angular 1 app and then establish to point A to point B from an NG1 app to an Angular 2 app. So for me, I’m interested on how can I take these concepts and use these right now? I think, just learning some of the tooling around it and applying it immediately is pretty compelling to me.

WARD: Alright people, you’ve heard it. We’re going to come back here with how far we made it down this road [laughs].

CHUCK: Yup.

WARD: So stay with us, right, Chuck?

CHUCK: Yeah, absolutely. I don’t have this deep experience as you guys, so I may come away with some different take aways than you do. But I’m planning on doing more or less with John and Lukas said.

WARD: I’m planning on listening to what they have to say.

[Laughter]

LUKAS: Or, a repo or something you can download and actually touch it.

WARD: Yeah, yeah.

CHUCK: Yeah.

WARD: Hoping we’ll have some repos and I’m hoping that we’ll have some side conversation so that you’re able to say something fruitful.

JOHN: Yeah, if anybody is looking in the meantime, I already got some repos up there if you go to github.com/johnpapa. There’s a couple of repos, they’re totally playgrounds. One of them is called “hottowel-angular-typescript”, and I’ve got a couple of branches on there with variations of those very simple app that I’m writing for Angular 1 with TypeScript. And then also, I’ve got one called “ng2play” which is completely raw and unfiltered. It’s me playing as I go with various used cases.

So I definitely recommend people, if you’re doing this stuff, put it publicly up in GitHub, too, and let’s all think here together.

CHUCK: Alright! Well, let’s go ahead and do some picks. Lukas, you want to start this off with picks?

LUKAS: Sure! I recently read a book called “The Phoenix Project”, which if anybody has ever read The Goal by (I’m not going to say his name right) Eliyahu M. Goldratt — it’s a seminal business book on lean production and he introduced the three constraints in this book. Well, The Phoenix Project is essentially like an IT DevOps version of this book, and it’s super fascinating. I just finished it. I think it’s good for anybody who works with a large team, especially on like Enterprise type software. It was definitely interesting.

CHUCK: Alright, John, do you have some picks for us?

JOHN: I think we’ve had plenty of technical picks today so I’m going to lay off of those ones and just pick my favorite pick here which is my favorite TV show lately, and it’s called “Arrow”. I really got into it last year. I’m not a big DC fan, but I’ve always been a fan of Arrow. The TV show is really good! It’s been interesting for me to get through, and it’s definitely a little dark at times, but definitely really intriguing. If you’re looking for something that kind of keeps you moving, check it out!

CHUCK: Alright, Ward, do you have some picks for us?

WARD: Yeah! By the way, wasn’t The Phoenix Program some kind of slash and burn thing that we did in Vietnam? It’s freaking me out to hear that there was some neutralizing to Vietcong thing, which maybe you just have to be of a certain age to remember that.

LUKAS: Yeah, that’s what’s freaking me out. It’s you said that “We did in Vietnam”…

JOHN: I’m like, “Yeah, WE weren’t there.” [Chuckles]

LUKAS: Yeah, sorry, I wasn’t around, but you did.

WARD: Well… [Laughs] I’m..

JOHN: Ward, thank you for serving.

WARD: Oh! God!

[Laughter]

WARD: Anyway, shifting gears, I want to talk about my favorite sci-fi movie of the last 6 months, which is, well I pronounce it as “Ex Machina”. I saw it with Dan, actually, Dan Wahlin. It’s a brilliant psychological drama around AI and touring question, is this machine human or not, where all the characters are lying and you know that, but how much are they lying and what are the consequences. It’s not a shoot ’em up, it’s really a tight taught psychological drama with lots of twist and turns, and I highly recommend it. Ex Machina.

CHUCK: I have a pick this week, and it’s kind of a short rant and mainly, it just comes out of me thinking about things in life.

Basically, I’ve been in a couple of situations where people have sort of gone on this rant “I don’t want to have anything to do with such and such of person because they are affiliated or believe such and such of thing.” I just want to encourage people instead to go ahead and take the opportunity to talk to people who have opinions that are vastly different than yours. I feel like we all learn and gain ground from those conversations. A lot of times, we’ll find that we have things in common. And then we come from there, it is a part of the differences that we have realize that maybe neither side have all of the answers, but at least we can recognize each other as human beings and also see that, “Okay, well, given their background or given their value set that they may have a reasonable way of reaching to a conclusion they didn’t even know I don’t agree with it.”

And especially where things are starting to heat up in the US for presidential campaigns, we have a whole bunch of people throw their hat in the ring for that. I also hear people having conversations about religion and screaming and yelling about people’s religious or non-religious beliefs, I just feel like that there are some conversations that can be had there that making us closer to finding resolution to that instead of insisting that we must be right and they must be wrong.

Anyway, that’s kind of what I’ve been thinking about. It’s a little bit deep for a tech podcast, but don’t sell yourself short by just talking to people you agree with. Go find some people who you disagree with and find out what they’re about and why they think and believe the way that they do.

LUKAS: Whoa! Whoa! Whoa! I’m totally cool that you’re a Rails developer.

CHUCK: [Laughs]

LUKAS: And so like literally, I’m cool with that, bro.

CHUCK: Alright, well, I’m glad you could look past that.

LUKAS: Alright, let’s talk about it.

CHUCK: Yeah. Anyway, that’s my pick. And yeah, I guess, we’re done. We’ll look forward to talking about this again in a week or two or three. We’ll wrap up the show, we’ll catch you all next week!

[This episode is sponsored by Mad Glory. You’ve been building software for a long time and sometimes it gets a little overwhelming; work piles up, hiring sucks, and it’s hard to get projects out the door. Check out Mad Glory. They are a small shop with experience shipping big products. They’re smart, dedicated, will augment your team, and work as hard as you do. Find them online at madglory.com or on Twitter at @madglory.]

[Hosting and bandwidth provided by The Blue Box Group. Check them out at bluebox.net]

[Bandwidth for this segment is provided by Cache Fly, the world’s fastest CDN. Deliver your content fast with Cache Fly. Visit cachefly.com to learn more.]

[Do you wanna have conversations with the Adventures in Angular crew and their guests? Do you wanna support the show? Now you can. Go to adventuresinangular.com/forum and sign up today!]

x