News for hackers. Stuff that matters.
Re:Comparison with Other Frameworks by g00gler on Saturday October 22, 2016 @09:58AM (#12768683)
How do you mean, "templates for non-programmers"?

I see Angular's directives as a pure convenience compared to most every templating engine I've used across languages, never considered it something that makes it accessible to non-programmers. I'd actually think someone who only knows html/css would be more thrown off from a page with random, unsanctioned (by W3C), tags and attributes that may or may not reveal what they actually do.

As a programmer I don't want to write long templates, I seriously prefer Jade/Pug for that reason. When I can't use them for a client I typically use them to do all initial work, compile them to HTML, then make whatever minor changes from there.

Consider ng-for:

  <div data-ng-for="y in x">
    <h1>{{y.title}}</h1>
  </div>
The ASP.Net solution is a pain, a function with HTML string template to dynamically add elements to a "runat" div.

This PHP example seems more idiomatic, at least to me, yet takes more to write

  <?php foreach($x as $y){ ?>
    <h1> <? echo $y->title; ?> </h1>
  <? } ?>
The JSP style is kinda similar to Angular, again maybe more idiomatic at first glance but still not as quick/simple to write

  <c:forEach items="${x}" var="y">
    <h1>${y.title}</h1>
  </c:forEach>

The jQuery/plain JS solution, especially before ES6 is not preferable by any means, especially beyond this simple example.

  var body = document.getElementsByTagName("body")[0];

  [...].map(function(y){
  body.innerHTML += 
    "<div>"+
     "<h1>"+y.title+"</h1>"+
    "</div>";
  });

Unlike all the other solutions, angular has 2 way data binding so when you programmatically add elements to the array in ng-for, they are added to the DOM without a reload.

So, is the goal of a programmer to simply write more code? If so, then Angular is definitely not for programmers.

Is the goal of a programmer to solve problems? If so, Angular is definitely a tool for programmers.

Re:Comparison with Other Frameworks by pluma on Sunday October 23, 2016 @09:38AM (#12773504)
JSX:

    {x.map((y) => (
      <div key={y.id}>
        <h1>{y.title}</h1>
      </div>
    ))}
Aside from the HTML-like syntax this is vanilla JS. And "y.title" is already auto-sanitized so you don't have the XSS vulnerability as in your jQuery solution.

Need to output trusted HTML?

    <h1 dangerouslySetInnerHTML={{__html: y.titleHtml}} />
Yes, that's intentionally verbose, making you aware that this is a potentially dangerous. But to paraphrase the old saying: make the safe things easy and the unsafe things possible.

Angular and friends require context switching. Good luck if you're using non-standard data structures or need slightly more complex filter or iteration logic. And especially in Angular (1 more than 2) you also need to keep in mind the variable scope within the DOM tree and which variables, directives and components you can use where.

With JSX it's just JavaScript and the scope is just your local JavaScript scope. Instead of having to remember all the idiosyncracies of the framework's own implementation of a for-loop[0] you just have to know JS.

I'm not saying Angular is not for programmers. I'm saying the design goal of Angular1 was to make it easier for non-programmers to write views/templates. It's even in the name: as much fun as controllers, components, directives and two-way bindings may be, the raison d'etre of AngularJS resides between the angle brackets.

[0]: https://angular.io/docs/ts/latest/api/common/index/NgFor-dir...

Re:Comparison with Other Frameworks by justinsaccount on Saturday October 22, 2016 @01:37PM (#12769631)

    <h1> <? echo $y->title; ?> </h1>
You forgot htmlspecialchars and now you have XSS. Which is why facebook built XHP originally:

https://www.facebook.com/notes/facebook-engineering/xhp-a-ne...

Re:Comparison with Other Frameworks by g00gler on Sunday October 23, 2016 @03:10PM (#12774919)
Could've sanatized the input before saving it to the database :p
Re:Comparison with Other Frameworks by raboukhalil on Saturday October 22, 2016 @11:21AM (#12769020)
PHP also offers a nice way to write templates without even having to use echo and without braces:

  <?php foreach($x as $y): ?>
  <h1><?= $y->title ?></h1>
  <?php endforeach; ?>
Re:Comparison with Other Frameworks by combatentropy on Saturday October 22, 2016 @01:45PM (#12769675)
Yes, that's what I do. I also think it's fine to use omit trailing semicolons and to use short-open tags (I already labelled the file .php --- why do I have to keep saying "php" all over it? And I'm not usually outputting XML.)

  <? foreach($x as $y): ?>
      <h1><?= h($y->title) ?></h1>
  <? endforeach ?>
You just want to make sure to escape all output with htmlspecialchars, or define a shorter function like I did ("h").
Re:Comparison with Other Frameworks by raboukhalil on Saturday October 22, 2016 @04:48PM (#12770495)
I agree!
Re:Comparison with Other Frameworks by bluejekyll on Saturday October 22, 2016 @11:31AM (#12769066)
PHP can only be used serverside, no? Can't write single page apps.
Re:Comparison with Other Frameworks by goatlover on Saturday October 22, 2016 @05:50PM (#12770716)
You can't do SPAs with ajax calls?
Re:Comparison with Other Frameworks by bluejekyll on Saturday October 22, 2016 @10:47PM (#12771623)
Huh? I'm asking how with PHP. You would write a 100% client side app.
Re:Comparison with Other Frameworks by g00gler on Sunday October 23, 2016 @03:12PM (#12774927)
You can't use JSP to make a SPA, either. I was replying to the statement "Angular is for n00bz"
Re:Comparison with Other Frameworks by michaelcampbell on Saturday October 22, 2016 @10:55AM (#12768900)
Unrelated question: was there a reason you swapped the iterator and container (x and y) in your angular example compared to the others? Just to keep 'x' before 'y'? It confused me a bit.
Re:Comparison with Other Frameworks by g00gler on Saturday October 22, 2016 @11:17AM (#12768999)
No, I wrote it on my phone and didn't double check the angular example. I noticed another little mistake so I'll edit it