News for hackers. Stuff that matters.
Re:Angular 2 – Best Practises by cies on Monday June 27, 2016 @07:11AM (#11985397)
Could someone tell me one-or-more reasons to choose Angular for a new project, now that the React ecosystem is mature enough to compete with it?

As I feel that from a conceptual/architectural point of view Angular is simply on a loosing path.

https://www.google.com/trends/explore#q=angular%20tutorial%2...

Re:Angular 2 – Best Practises by ta_donk_gt on Monday June 27, 2016 @10:28AM (#11986331)
Essentially it boils down to whether you prefer a cohesive all-in-one framework/platform (angular2) or a collection of semi- and fully-independent libraries (react). Pretending that one of those options is the right fit for everyone is not productive.

The only thing really missing from Angular 2 compared to the React ecosystem is jsx. Angular 2 and RxJS (and if you want throw in ngrx/store) allows a heavy focus on immutability, unidirectional data flow, centralized state, etc. that ends up very similar to the React ecosystem conceptually.

Both allow native cross-platform mobile with React Native (react) and NativeScript (angular2), and Angular 2 also gives you a nice hybrid/webview option with Ionic 2. Angular 2 also gives you a bit tighter integration with TypeScript, if that is your preference (which it is mine).

Personally, for me, I like both a lot but the full-framework and tight TypeScript integration fit my use cases and personality better.

Re:Angular 2 – Best Practises by rubber_duck on Monday June 27, 2016 @11:08AM (#11986627)
I don't think JSX fits Angular 2 - it sticks to "views are markup based and code is in controller" traditional MVC which I prefer to JSX.

You mentioned TS but I feel like you understated it - it's the selling point for me. I have used TS + React but it's not the same thing - Angular was written with/for TS and it uses it to leverage all the advantages. React migrated from ES5 to incrementally add ES6 support and it shows. Also nobody uses flow outside of React unlike TS which has a decent community even outside of Angular and plenty of 3rd party type definitions.

Re:Angular 2 – Best Practises by ta_donk_gt on Monday June 27, 2016 @11:17AM (#11986703)
Definitely agree about the deep TypeScript integration with Angular 2 due to it being written in TypeScript. That is the core reason I prefer it, it is absolutely awesome in that regard. (And the same is true with RxJS).
Re:Angular 2 – Best Practises by lloyd-christmas on Monday June 27, 2016 @02:50PM (#11988475)
> TS which has a decent community even outside of Angular

We've converted all our node backends to typescript. It's been a game-changer in productivity.

Re:Angular 2 – Best Practises by devdoomari on Monday June 27, 2016 @11:08AM (#11986628)
I'm using typescript with React right now...and typescript does a decent job with jsx checking. (saved me from a lot of missing / wrong prop name errors)

anyway, does typescript support some kind of template-string validation for angular2? If so, I'm going to really re-consider angular2 for my next project

Re:Angular 2 – Best Practises by robwormald on Wednesday June 29, 2016 @12:55AM (#11999576)
Typescript doesn't directly, but Angular2 does (or will, this is just coming online) - our offline compiler converts your html templates into TS, and then regular TS typechecking can take over.

See https://github.com/microsoft/typescript/issues/6508 (and the GIF!)

Re:Angular 2 – Best Practises by ta_donk_gt on Monday June 27, 2016 @11:15AM (#11986689)
> does typescript support some kind of template-string validation for angular2

No, and that's the reason I mention jsx as a missing feature from Angular 2. There is no compile time or refactoring support for templates, whereas with TypeScript and jsx you get that.

Re:Angular 2 – Best Practises by rtpg on Monday June 27, 2016 @09:42AM (#11986091)
I've found it more straightforward to transition to Angular over from a more server-side setup gradually. The template language is at least in the same general area as template languages for Django, Rails, etc.

The general tooling process is pretty simple, no need to convince people of the merits of JSX.

Architecturally speaking many people still like separating presentation from business logic.

Angular has a lot of mature tooling and wrappings around current libraries. Angular also offers a lot more tooling on the side, React is much smaller.

On an architectural side, while React keeps states in components, the state update mechanism is a bit obtuse compared to Angular's "scopes are just objects" philosophy.

It's dependent on how you view things, but if you're working on things where strict component decomposition is hard, and you "like global state in your views", then Angular's state mechanism (controllers) could work better for you.

Some would also declare that the non-turing-complete-ness of the template language in Angular is a feature, not a bug.

Re:Angular 2 – Best Practises by woah on Monday June 27, 2016 @11:29AM (#11986793)
You separate your presentation from your business logic in React. What React gives you that Angular doesn't is the ability to separate your presentational logic from your business logic. Angular makes you put presentational logic in with your business logic because presentational logic simply cannot be expressed with the templating format.

I would argue that a distinction that you make yourself, based on your application's architecture is more meaningful and useful than one made by some arbitrary separation of source file formats.

Re:Angular 2 – Best Practises by RodericDay on Monday June 27, 2016 @12:33PM (#11987297)
All the React stuff is starting to sound a bit to me like "MongoDB is web-scale"
Re:Angular 2 – Best Practises by dev360 on Tuesday June 28, 2016 @07:47AM (#11992911)
Not really. I think a key distinction is summed up in this quote:

"Angular 2 continues to put “JS” into HTML. React puts “HTML” into JS."

See: https://medium.freecodecamp.com/angular-2-versus-react-there...

This influences to some extent what you can do with the frameworks and how your code is organized. I like the fact that since my rendering is essentially JS in React, then I can structure my code better with OO to solve problems (inheritance where appropriate, helper classes, patterns etc). In Angular, its just a awful mess of ng-* statements for flow of control. All you can really do to tame it is to use composition or to mix-in behavior via directives.

Re:Angular 2 – Best Practises by cies on Monday June 27, 2016 @10:09AM (#11986208)
Thanks for this!
Re:Angular 2 – Best Practises by chvid on Monday June 27, 2016 @07:28AM (#11985469)
My impression is that a lot of "mature" (aka boring old) companies like Angular 1 and the sound of Angular 2 over React.

For a number of reasons:

- In general Java and C# programmers like it.

- It is made by Google (perceived as more "mature", business like) rather than Facebook (young kids).

- It takes a lot of inspiration from server side development with its dependency injection and general terminology.

- And TypeScript is very similar to Java and C#.

(The list is a slight caricature but I hope the general point is clear.)

Re:Angular 2 – Best Practises by fchopin on Monday June 27, 2016 @08:05AM (#11985605)
> My impression is that a lot of "mature" (aka boring old) companies like Angular 1 and the sound of Angular 2 over React.

React has been around for a while, but it is still only a library. Angular 1 and 2 are frameworks. Also Angular 2 is a complete rewrite and not even in final release. I'm not sure how that is boring or old.

As with Angular 1, Angular 2 aims to be opinionated, so it should be clearer how to do things than with React. Especially now with the move to components, Angular should be easier do more with, without as much confusion. And Angular 2 is much faster, if you do it right, which was one of the reasons Angular 1 was left for React.

React is fine for what it is. It's somewhat "matured" for a few years and is not a bad decision if you go with it.

I don't think that you should just jump on the latest JS bandwagon, but Angular 2 is more than just "for mature companies" and "similar to Java and C#".

Really, the only frustration we've had with Angular 2 so far has been that it has been changing so quickly, but it's starting to settle down now.

Re:Angular 2 – Best Practises by chvid on Monday June 27, 2016 @08:40AM (#11985751)
The places I am referring to are not actually using Angular 2. They are using Angular 1 but like "the sound" of Angular 2.

Where the sound is the promise of a better tomorrow without actually looking at alternatives.

Re:Angular 2 – Best Practises by dev360 on Tuesday June 28, 2016 @07:51AM (#11992929)
> React has been around for a while, but it is still only a library.

You probably knew this already, but worth to point out that React never intended to be a framework.

This is a really interesting talk: http://2014.jsconf.eu/speakers/sebastian-markbage-minimal-ap...

Re:Angular 2 – Best Practises by nothrabannosir on Monday June 27, 2016 @08:06AM (#11985610)
> - And TypeScript is very similar to Java and C#.

react and typescript go hand in hand, now that typescript has .jsx support (as .tsx files)

Re:Angular 2 – Best Practises by nojvek on Monday June 27, 2016 @10:33AM (#11986356)
Typescript really has more to offer with react. It type checks the jsx(tsx), Offers code completion on components and their properties, you can refactor/rename properties and components throughout your project without side effects. Typescript is kind of blind to angular templates.

React offers ability to use same code on server side and client side. Easier to test a Vdom library. It's a lot less complex, it's perf is a lot better, you can live edit. The biggest selling point is you can create native apps using native ui with a lot of code re-use.

React + ts definitely give you a bigger bang for buck. I spent 2.5 years of my life writing angular code. It definitely has some good ideas but I won't be investing so much of my time in angular 2 anymore.

Re:Angular 2 – Best Practises by jpkeisala on Monday June 27, 2016 @11:02AM (#11986589)
I totally agree on "mature" (aka boring old). I make my income on enterprise and recommending React here would be like recommending Rails over Java or C#. Meaning possibility of landing contract would be significantly lower.
Re:Angular 2 – Best Practises by laurencei on Monday June 27, 2016 @07:50AM (#11985550)
One specific reason I am personally choosing Angular 2, is that the Ionic2 Framework also uses Angular 2 [0].

So I can re-use code from my front end website on my native mobile apps for the new startup I'm launching. Much less code = quicker time to MVP, and lower cost of development.

[0] http://blog.ionic.io/angular-2-ionic/

Re:Angular 2 – Best Practises by mbesto on Monday June 27, 2016 @10:43AM (#11986444)
> So I can re-use code from my front end website on my native mobile apps for the new startup I'm launching.

Just to be clear, Ionic is _not_ native.

Re:Angular 2 – Best Practises by mkolodny on Monday June 27, 2016 @02:25PM (#11988267)
While Ionic's not native, even Ionic 1 is close enough for most apps. Ionic 2 is supposed to be 3-5 times faster. So for startups that need both iOS and Android support, but have small teams, Ionic's 100% iOS-Android code reuse remakes a lot of sense.
Re:Angular 2 – Best Practises by petetnt on Monday June 27, 2016 @07:55AM (#11985564)
Have you tried React with React Native[0]?

[0] https://facebook.github.io/react-native/

Re:Angular 2 – Best Practises by Secretmapper on Monday June 27, 2016 @08:22AM (#11985683)
BTW to parent, one big advantage of react-native over ionic is that it's not a wrapped web app, but a javascript/react app that compiles to an actual native app.

The performance difference and development experience (no silly css hacks) is very noticeable.

Re:Angular 2 – Best Practises by nbclark on Monday June 27, 2016 @09:42AM (#11986088)
Not to nitpick, but I don't believe react native "compiles" to a native app. The evaluation of the JS in JavaScript Core is passed of to native code to layout native views. The interactions are then posted back into jscore. So while closer to native compiled code performance, it's still a bit different.
Re:Angular 2 – Best Practises by Secretmapper on Monday June 27, 2016 @12:34PM (#11987303)
Fair enough, I'm afraid I didn't explain it properly
Re:Angular 2 – Best Practises by madeofpalk on Monday June 27, 2016 @08:23AM (#11985685)
In my experience code-share between React and React Native is extremely difficult as your UI code is so significantly different with native components and what not.

At least with Angular/Ionic you can directly share UI code between the two as its all HTML and CSS.

Still, I really enjoy working with React and React Native because I it's one API and mental model to learn.

Re:Angular 2 – Best Practises by lacker on Tuesday June 28, 2016 @01:12AM (#11991613)
You might want to check out https://github.com/necolas/react-native-web - that has implementations for a lot of the React Native primitives on the web, to make code-sharing easier.
Re:Angular 2 – Best Practises by Secretmapper on Monday June 27, 2016 @12:35PM (#11987314)
Have you tried it recently? I don't think I've had this problem with recent versions.
Re:Angular 2 – Best Practises by pbhowmic on Monday June 27, 2016 @10:57AM (#11986543)
As did I and for the same exact reasons. I am the only dev on the project (it is a startup) and we need to get to MVP fast.
Re:Angular 2 – Best Practises by Bahamut on Monday June 27, 2016 @09:41AM (#11986084)
For Angular 1 vs. React, I would just say depending on the resources you have - for example if a team is very productive with Angular 1 & there isn't enough time to get a team to pivot skills, then it may make more sense to go with that from a business perspective.

IMO there is one main reason to choose Angular 2 over React currently - perf. Angular 2 has significant perf improvements over the other libraries/frameworks out there, and supports incremental rendering as opposed to React's render all at once model. Angular 2 also will have the best built-in animation support of the various libraries/frameworks out there, in part due to the Angular team's collaboration with the Chrome team (this is true with Angular 1 as well).

Otherwise, React is more mature than Angular 2 & has a simpler API. Conceptually, Angular 2 and React share much in common, and architectures should look similar between well written apps in both.

Re:Angular 2 – Best Practises by 0xfaded on Monday June 27, 2016 @10:03AM (#11986188)
I'm trying to find more info on angular 2 incremental rendering that you've mentioned.

I've despised angular since pre-1.0, mainly for performance reasons. Once the number of watchers hits 1000 or so, a browser will noticeably lag. A compete rerender will cause a noticeable freeze up.

I'm not currently using react either, but it's possible to do an incremental render through code, only rendering what needs rendering. React-dom will be needed to plug the result in the right spot.

Re:Angular 2 – Best Practises by bradleyprice on Monday June 27, 2016 @09:56AM (#11986154)
What's the difference between Angular 2 and Reacts rendering? I was under the assumption that Angular 2 had implemented a shadow dom or something similar.

Not arguing that you are wrong, I just haven't kept up with any of Angular 2 and am genuinely curios.

Re:Angular 2 – Best Practises by Bahamut on Monday June 27, 2016 @10:10AM (#11986210)
Both Angular and React rely on an AST - React uses jsdom, while Angular has a template compiler which constructs an AST from the template, and the renderer then can render from the AST as it determines. Angular can render templates with the inert template tag - this allows it to leverage browser caching for browsers supporting the template tag.

It also supports the shadow DOM through its style engine with the component decorator. One can either use native shadow DOM (and use a polyfill for the functionality), or use Angular 2's built-in virtual shadow DOM where it randomly generates unique attributes to style off of with the component decorator.

Re:Angular 2 – Best Practises by sakopov on Monday June 27, 2016 @08:31AM (#11985719)
I'm not sure I'm on the bandwagon that believes that commingling JS, CSS and HTML into a single "component" is a great thing. I just don't understand...
Re:Angular 2 – Best Practises by scarlac on Monday June 27, 2016 @09:33AM (#11986045)
There's a lot to be said for separating concerns and it's still good practice within your component. No-one is really disputing it afaik, but the way we are/were creating web pages are based on a document-centric paradigm.

Single Page Apps (SPAs) are more app-like than webpage-like and if you're really going for reusability then your components need to have a say in how they are rendered. That means they need to provide /some/ HTML.

You can still create components without including CSS but you'll likely need to provide structure (HTML) in order to bind behavior/callbacks/events to it. It's still good practice to separate rendering (HTML/JSX/NG) and behavior.

Re:Angular 2 – Best Practises by SonicSoul on Monday June 27, 2016 @11:10AM (#11986644)
This might have been mentioned already, but I do like that they're not reinventing the wheel with ng2 on every front and instead leveraging libraries that are either mature or likely to be the direction that web is heading. If you follow their quick start example you'll get Typescript, RxJS, SystemJS. RxJS is a very interesting beast that has been around for a long time in c# world and recently gained popularity in Javascript and implements what may be a precursor to browsers Observable() object and anything-as-a-stream management. Not sure how React is solving these problems but probably a good idea just to go through a few simple examples to see how they work.
Re:Angular 2 – Best Practises by laurencei on Monday June 27, 2016 @07:14AM (#11985408)
If you run that some trends report - but with "Angular 2" - that shows a much higher uptake:

https://www.google.com/trends/explore#q=angular%20tutorial%2...

Re:Angular 2 – Best Practises by Secretmapper on Monday June 27, 2016 @07:28AM (#11985470)
The takeaway of course is that most of those probably want to pick up Angular 2 because they used Angular.

I made a conscious switch from Angular to React because React (and the flux pattern) really did reinvent how web components are built and it's incredibly intuitive. I simply don't see the same innovation in Angular 2 apart from 'we made Angular more modern'

Re:Angular 2 – Best Practises by travmatt on Monday June 27, 2016 @08:14AM (#11985640)
I'm learning front end dev for the first time, and I chose React - it didn't make sense to learn angular when react borrows so much from html that I can apply some concepts more directly.
Re:Angular 2 – Best Practises by dev360 on Tuesday June 28, 2016 @08:09AM (#11993024)
Re:Angular 2 – Best Practises by EugeneOZ on Monday June 27, 2016 @08:59AM (#11985841)
Your link proves controversial point :)

Please stop wars "a vs r" - it's counterproductive. Knowledge sharing is much better. If you don't trust me - read Twitter of Dan Abramov.

Re:Angular 2 – Best Practises by ken47 on Monday June 27, 2016 @03:44PM (#11988899)
I love the direct integration of async support in templates. You can extract the value of promises and observable directly in templates using the async pipe, which cuts down on a lot of boilerplate. That means your templates can directly subscribe to observables and auto update on changes. Awesome.

And there is first class support for component-scoped css, aka emulated shadow dom, which is great for large codebases.

Re:Angular 2 – Best Practises by david_p on Monday June 27, 2016 @07:23AM (#11985442)
It's more mature now that the Angular 1 experiment is over

It's written in TypeScript, so you can write your frontend in TypeScript. Many bugs averted.

You can use a real reactive model (http://victorsavkin.com/post/137821436516/managing-state-in-...)

Re:Angular 2 – Best Practises by Murkin on Monday June 27, 2016 @11:48AM (#11986949)
The only reason - if you want to bet the future of your project on an untested framework, that seen no real world use and is still changing during its RC.

Or simply put. If they named "Angular 2" by its real name "Some other cool framework name" - you would not use it. (e.g. Polymer 2)

Re:Angular 2 – Best Practises by ionwake on Monday June 27, 2016 @08:08AM (#11985619)
Re:Angular 2 – Best Practises by david_p on Monday June 27, 2016 @11:06AM (#11986610)
Actually this seem to depend a lot on the exact search term, look: https://www.google.com/trends/explore#q=%2Fm%2F012l1vxv%2C%2...
Re:Angular 2 – Best Practises by spdy on Monday June 27, 2016 @07:31AM (#11985487)
The only decision you have to make if you like opinionated frameworks or not.

Both ecosystems are vibrant enough to stay for the foreseeable future.

Re:Angular 2 – Best Practises by _RPM on Monday June 27, 2016 @09:23AM (#11985979)
I'm honestly not sure why React being more mature now would be a reason not to use Angular for a new project.