Angular 2.0 with EC5?

180 views
Skip to first unread message

Dawn Wolthuis

unread,
Jul 20, 2015, 4:08:34 PM7/20/15
to ang...@googlegroups.com
I would like some help understanding where ES6 fits in the Angular 2.0 picture. It is not yet "perfectly clear" to me whether folks who will are learning Angular 1.4 today with ES5 will be compelled to learn ES6 in order to transition to Angular 2.0. I have heard (here, I think) that it is not required, but I have also seen no evidence that there will be a lot of ES5 materials for those doing Angular 2.0 with ES5 in the future. 

Given that some folks moving to Angular 1.x today are highly proficient in other non-OO programming languages but have little to no OO experience, I would prefer that they could learn ES5 and keep going with that in a transition to Angular 2.0. I would definitely prefer that I could at least tell them this is likely a wise scenario. ng-1.x/ES5 -> ng-2.0/ES5 -> (someday maybe) ng-m.x/ES6.

I am hopeful that we can decouple Angular 2.0 training and migration (in the future) from ES6 training and migration -- preferring to put off the latter indefinitely or at least until it can be expected to run in the browser. However, we do want the wealth of training materials available in videos etc from the web for our Angular 2.0 training. We would like to use commonly accepted approaches for this development. At this point, it seems that most (all?) examples have the two tied together -- the developer must leap from Angular 1 to Angular 2 while also jumping through OO hoops to adopt OO patterns (for no highly apparent reason -- perhaps it is the notion that after a half-century of developers writing applications without OO, it is now essential in any language or else that throwing everything into one language is better than keeping it simple?). [I might not really be a snarky person outside of my Angular 2.0 distrust, smiles.] With a few exceptions, as someone else here mentioned, ES6 solves a problem that does not currently trouble us. It introduces a problem that does -- lack of OO experience by some, not all, LOB developers.

Please help me understand whether it will be wise to couple Angular 2.0 with ES6+transpiler, rather than coding in the same language we must debug in within the browser. Obviously, a developer would then need to understand both ES6 (for the source) and generated ES5 (which will run in the browser).

Please clue me in on a) whether ES6 will, for all intents and purposes, be required in a move to Angular 2.0 b) whether it will be more difficult, perhaps due to lack of materials, for a site to move from Angular 1 to 2 without also moving from ES5 to 6 and c) whether you think that it would be wise to bite the bullet and do the move from Angular 1 to 2 and from ES5 to 6 all at the same time.

Thanks.  --dawn

Mark Volkmann

unread,
Jul 20, 2015, 4:18:17 PM7/20/15
to ang...@googlegroups.com
I recommend starting to use ES6 now with Angular 1. You can use Traceur or Babel, both excellent transpilers. Automate their use with gulp or Grunt. Both can watch for code changes made by any editor/IDE, transpile on the fly, and reload the web browser where the app is running. 

I don't think the learning curve is very steep for the basics. Start with arrow functions. Add in things like destructuing, default parameter values, and enhanced object literals. Then learn about new new class keyword. You'll be in much better shape by the time Angular2 is ready for production use.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.



--
R. Mark Volkmann
Object Computing, Inc.

Dawn Wolthuis

unread,
Jul 20, 2015, 5:21:03 PM7/20/15
to ang...@googlegroups.com
Thanks Mark, but the response here is disappointing. There has been a significant investment in learning ES5 with Angular 1.x, and it does not sound wise to do a move to ES6 so that it can transpiled back to ES5, when all existing code at this organization is written in a non-OO language. They are about to launch into a rewrite of an app written some time ago, so if it would be a really bad idea to write any app in JavaScript now, without first writing OO stuff to be transpiled back to ES5, then I would not be surprised if that were the last straw in their decision to go the Angular route. This was a very discouraging response, as you might imagine.  

Are there some good options out there for ES5 frameworks that are likely to continue into the future? Please advise.

Thanks. --dawn

Mark Volkmann

unread,
Jul 20, 2015, 6:29:16 PM7/20/15
to ang...@googlegroups.com
One thing to keep in mind is that ES6 is not an all or nothing proposition. You can start using an ES6 transpiler without changing any of the existing ES5 code. Then as existing files are modified, maybe for bug fixes or to add new features, you can start inserting use of ES6 features gradually. The benefit is that by the time you are able to use Angular 2 you will already be comfortable with many ES6 features.

Sander Elias

unread,
Jul 21, 2015, 3:14:30 AM7/21/15
to ang...@googlegroups.com
Hi Dawn,

You can use NG2 with ES5 without issues. Here I created a small plunk that does just that. You can play with it as much as you like. How much I do like to play and program in ES6, I dislike the transpilation step. It feels like an build-in code-dept. If you need to do production now, you are better off learning ES5, and use the styleguide to build an NG1 application. Most of what you learn will pay of if you are ready to move to ES6 and/or NG2. 

FYI: ES6 is not an OO language. The OO part is just a nicer syntax for what is available in ES5. It is a mistake to take the OO principle as it is for example in JAVA and apply that to ES6. It will mostly work, but it will repeat the big mistake that is in there (google for the gorilla/banana problem)
ES6 is mostly a slightly nicer ES5 with some of the pain-point released, and some great productivity assets. But it is not a new language. You don't need to learn another paradigm. Everything in there is complementary to ES5, meaning, you get a few extra tools in your toolbox to choose from, not an entire new toolbox with different tools. For a job, you now can choose to use a new (perhaps better suited) tool, or continue to use your old tools, until you are familiar enough with the new ones.

Regards
Sander

PS, NG2 is not ready for production by a long shot! play with it, learn it's concepts, but don't build anything serous with it yet. It is in way to much flux. (unless you like to rewrite your entire app a dozen of times ;) )
Message has been deleted

Dawn Wolthuis

unread,
Jul 21, 2015, 10:39:56 AM7/21/15
to ang...@googlegroups.com
Once again, very helpful, Sander. Thanks. As you can tell, I'm trying to have both good decisions and good responses to questions from professionals who already know how to develop solid, lasting software with other stacks. If those stacks do not get them handily to good UI in a cloud/web/mobile app, they are looking for other options.

I will continue to plan on moving to Angular 2.0 while retaining ES5, and I really hope that there will be plenty of resources for that approach. I noticed that the John Papa standards changed a bit in prep for 2.0 (with $inject, for example). It's hard to keep up, but I'll try to balance ignoring the not-ready-for-prime-time Angular 2.0 (the marketing is still very troubling and definitely keeping people from adopting Angular right now) and preparing for it.

Transpilers: I like transpilers a tad bit more than "code generators" where you do clicky-clicky things and then it generates code. However, I do not like the additional complexity of having a transpiler in the mix, and I would rather that we are debugging the JS we write rather than a generated version, unless there are some huge advantages. The html in the browser is already generated/rewritten by Angular (at this point we are using jade too). We are working with css, but as soon as there is a css-related designer on the team, they might want sass (or less or sylus or scss or whatever is on the horizon). It seems so unnecessary to add in another transpiler/code-generator into the mix -- although this is somewhat amusing --> https://github.com/jashkenas/coffeescript/wiki/list-of-languages-that-compile-to-JS. JS seems to be the new p-code. Of course, I'm suggesting to my friends that they write a transpiler for MV BASIC (Data/BASIC) too as there are only 3 flavors of BASIC in that list at this point.

OO: I love the gorilla/banana problem -- thanks for pointing me to that and some great quotations regarding OO. Both OOP and RDBMS's contributed in various ways to software being harder to write, more bloated, and less fun for individuals and teams to develop. There is still plenty of development done in COBOL, FORTRAN, and one of the 100+ flavors of BASIC (https://en.wikipedia.org/wiki/Category:BASIC_programming_language_family), not to mention C. JavaScript is relatively easy to pick up by folks working with these languages, with additions like prototypal inheritance, objects, and closure as topics to cover when introducing JS. 

There are definitely some things not to like about ES5, but I don't want to do the two-punch of a transpiler in the mix (debugging generated code and having another moving part on the server) and a flood of unnecessary classes in the source code. When I saw an example of ES6 code with class declarations, "let" statements, arrows, ellipses, and the like, I did not want to give it another thought (OK, that's not true, I gobbled it up, then spit it out and got back to work). smiles.  --dawn

Dawn Wolthuis

unread,
Jul 21, 2015, 10:52:05 AM7/21/15
to ang...@googlegroups.com
Good to know. Thanks Rick.  --dawn

On Tuesday, July 21, 2015 at 9:19:30 AM UTC-5, Rick Tessner wrote:
Hi Dawn,

The egghead.io folk have been doing a few videos on Angular 2 using ES5. Definitely more template code than if you're using ES6 but it does show that it is quite possible to write Angular 2 with ES5.

I believe those videos are for pro-subscribers only but I've found it worth the money.


--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.



--

Dawn Wolthuis

unread,
Jul 21, 2015, 10:56:59 AM7/21/15
to ang...@googlegroups.com
Thanks Mark. It might make sense at some point to configure the most popular Angular 2.x development environment, whatever that might be, even if it includes an ES6 transpiler. We could then use standards, such as favoring functions over classes in most cases, to keep the added complexity of the extended language from making the software more difficult to develop and maintain.  --dawn

Mark Volkmann

unread,
Jul 21, 2015, 12:39:11 PM7/21/15
to ang...@googlegroups.com
I know this is getting a little off topic, but I think we need to accept that transpilers are here to stay. With the move to annual updates to the ECMAScript spec, browsers will always be chasing the standard. If we want to wait until all the browsers we need to support in our web apps have support for a feature we want to use, it will be a long wait. I'm not willing to wait to be able to write more concise code.

There are all kinds of things that need to be automated in a client-side build process like running JSHint, running LESS, and running a transpiler. I have been doing this for a production app for seven months now. It is not painful at all and it is quite fast.

Dawn Wolthuis

unread,
Jul 21, 2015, 2:29:56 PM7/21/15
to ang...@googlegroups.com
What are the limitations of ES5 that are the most troubling to you when writing Angular apps?

As I mentioned, I like transpilers better than "code generators" of a different ilk, but the new language has to give us enough to make it worthwhile to be writing in one language and debugging in another. At this point, I'm likely doing simple things, but I am not hitting the limits of the language. There are a few nice things with ES6, no doubt (I watched a Crockford video on it earlier this year after being concerned when seeing class declarations in the code). 

Also, what should we pick - typescript, atscript, dart, es6, es6-just-the-good-parts (it will be interesting to see jslint/jshint with es6 -- it is likely at least an option to have it bark if you use a class declaration). Ecmascript 5 is working for my purposes today, but it will be good to get enhancements too at some point, no doubt. I just haven't hit that wall yet, so I'm curious where you have hit it. What have you encountered that will we need to do for typical business data processing that is really difficult or error-prone in ES5 (Crockford does give some examples). --dawn

Sander Elias

unread,
Jul 21, 2015, 3:51:40 PM7/21/15
to AngularJS
Hi Dawn,

With sourcemaps and the right tooling, you can debug ES6 in the browser(even when in the background there is es5 going on). But it still adds a code-dept. If you move to your next project, the current will keep on working in (more then a bit) less efficient ES5. Even if by that time all browsers will support ES6. Your source is compiled to es5, and will not profit from extended ES6 support in browsers. I don't like that idea.

However, ES6 is very tempting, and I like the way the current batch of transpilers work. Perhaps I switch to TS once 1.5 is out of beta. The jury is still out for me.

Regards
Sander

Mark Volkmann

unread,
Jul 21, 2015, 4:13:00 PM7/21/15
to ang...@googlegroups.com
Sander, TypeScript 1.5 reached a stable release yesterday. 


R. Mark Volkmann
Object Computing, Inc.
--

Mo Moadeli (CREDACIOUS)

unread,
Jul 21, 2015, 4:27:25 PM7/21/15
to AngularJS
Dawn, I also want to note that the extended feature set and added syntactic sugar in ES6 are separate topics from the the notions of OO and prototypical constructs of ES5 or ES6.

Given that, a simplistic evolution into ES6 is first leveraging the syntactic sugar and then leveraging the truly new features.  This applies regardless of whether indigenous OO skills exist or those language features have been implemented -- although better if they have. 

Mo

Sander Elias

unread,
Jul 22, 2015, 3:44:42 AM7/22/15
to AngularJS
Hi Mark,

Thanks for the heads-up, I'll check it out :)

Regards
Sander

Mark Volkmann

unread,
Jul 22, 2015, 7:16:37 AM7/22/15
to ang...@googlegroups.com
Dawn,

There are no limitations in ES5. Everything you can do in ES6 can also be done in ES5. The code just looks different. Many things are more concise in ES6. After using ES6 for the past eight months, it's now painful to look at ES5 code. The thing that stands out the most for me is arrow functions, but I also use many of the other features.

I believe AtScript has been abandoned in favor of TypeScript.
Opinions vary, but I think Dart will fade away soon.
TypeScript looks promising to me. I like the gradual typing.

---
R. Mark Volkmann
Object Computing, Inc.

Dawn Wolthuis

unread,
Jul 22, 2015, 9:07:49 AM7/22/15
to ang...@googlegroups.com
That is helpful info. Thanks Mark. Syntactic sugar in some cases should be good. The arrow notation might make the language look more cryptic at first glance for those coming from some language families, but I know it would be helpful.

The idea of typescript is likely more problematic than the language itself. I'm thinking of colleagues who have avoided C# and Java because of the strong typing. Just the thought of taking a very usable language that is easy to teach and adding conceptual complexity and more ways of doing the same things is disturbing.

I just noticed the subject says EC5 instead of ES5. Sheesh. I would like to call it "JavaScript" and abbrev it as "JS" and stick with JS for the next few decades, adopting new versions as the containers it runs in handle such. I am happy to stick with that and upgrade as the browser does, recognizing that is a slow process. However, I also want to use a language that will have a lot of educational materials, videos, examples etc with Angular. If angular 2 is throwing out controllers, directives, scope, respect for the importance of backward compatibility AND JavaScript, that would be going way too far. Smiles.  --dawn

Sent from my iPad
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/1OPcw8cxORI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages