Angular gives a lot of flexibility in code style and structure. You can componetize everything and have all your component files in one folder. You can inline it. Or you can go more MVC style folder structure like I do.

I personally like my html being approachable to junior devs and not being so chopped up and abstracted away from static HTML markup like it might be with React. Not sold on the new tag styles of A2 but I suppose it will just take some adjustment.

Not even remotely the same thing. HTML has a hierarchical structure which isn't a particularly good structure for a web application. Javascript syntax allows far more control over the hierarchy.

Your example is akin to saying putting a tank in an airplane is the same thing as putting an airplane in a tank.

> You can inline it.

Pretty thin separation between inline templates and JSX. But then, I've never understood why people think putting their template in a different file is somehow separation of concerns.

> I personally like my html being approachable to junior devs and not being so chopped up and abstracted away from static HTML markup like it might be with React.

Oh it's abstracted, with completely invalid HTML syntax and template variables. That's not to say that it's bad, I quite like the simplicity of the event/binding syntax of Angular 2. But JSX and Angular Templates are just two sides of the same coin.

I agree with you on the control but my point was that a lot of people that dislike Angular don't like the idea of putting tags on HTML elements which is very reminiscent to inline onclicks and the hackish approach to apps from yesteryear.

onclick="doSomething()" versus ng-click="controller.doSomething()"

Sure, there's a lot more under the hood with Angular but it looks and feels similarly and it scares some people away toward other approaches.

JS used to have a lot of inline code back in the day. Then jQuery came along and devs moved their JS into separate files but everything was still tied to elements and very frail. It was terrible for apps of any complexity. Now we have a ton of options and there is no consensus. However, maintainability is easier and building robust front-ends that don't break when someone moves a div or renames a class is not difficult anymore.

Angular is my favorite but I'm also liking what I'm seeing from Vue for a lot of applications.

We can point our UX designer at this separate file and he can understand it, which would not be the case if it's buried in JS?

Is there a "good" structure for a web application that jumps to your mind?

Throwing on click tags or jquery selectors on a huge HTML document is not a good structure.

And React doesn't use HTML either. It uses function calls that can be made to look kinda like XML by using a transpiler.

Neither puts HTML in JS or JS in HTML because neither actually uses HTML. Both build a virtual DOM: React does it explicitly with nested function calls, Angular does it implicitly using flat pseudo-HTML templates as strings.

React is really just a DSL for components that looks kinda like XML but if you consider React Native it is apparent that being able to render those components to HTML (on the server) or to the DOM is just an implementation detail of the renderer (i.e. ReactDOM, React Native, React Windows, WebGL, etc).

A component model is great though. Wicket is the library that gets it. Whenever I write Angular (or Django, or anything) I wish I was writing Wicket.