Update Octane guides section: Templates

[MelSumner]

From the RFC:
Templates come before components, since it is possible for someone to not know JavaScript/Handlebars and still contribute to Ember apps. For example, designers could effectively work in only templates, using plain HTML. To make Templates work as the opening topic, additions are necessary in the introduction.

Template Syntax will cover Ember Handlebars basics and built-in features like {{#each}} and {{#if}}. It will take care to make it clear that Ember uses its own implementation of Handlebars. It will clearly differentiate between control structures (loops and conditionals), inline vs block styles, component invocation, and helpers.

Template helpers are split out and moved to "Leveling Up" because developers do not need to use them to write basic Ember apps (they are not a prerequisite). This section includes writing custom Helpers and using built-in helpers like get, let, and array. Although helpers themselves are not considered a difficult topic, they are used most often when developers understand their app's architecture and the flow of data. Also, template helpers have more in common with JavaScript functions than concerns relating to layout and data flow.

Lastly, another reason to split out Template syntax from Template Helpers is because the syntax section is expected to expand with the addition of Octane content.

From the Analysis project:

• Introduction (PR)
  • Generally needs to be more like Jen's PR 😛
• Templating Basics
  • "Binding Element Attributes" feels like it should belong here
  • Could be merged into the introduction, or parts of the introduction could be split out into a separate section that focusses just on the templating syntax.
  • Should cover:
    • Template bindings/interpolation
    • Attribute bindings
    • Interpolation within attribute values (e.g. class="foo {{dynamicClass}}")
• Helpers
  • "Built-in Helpers", "Conditionals", "Displaying a List of Items", and "Displaying the Keys in an Object", and "Writing Helpers" could all be handled better by a single unified helpers section
  • Show be about how to do programming logic in templates
  • Should emphasize that it's not JS in templates, but it does allow you to do as much or as little as you want. Definitely should mention the "logicless-templates" pattern, and compare to "template-heavy" patterns (both are options)
  • Comparisons to Lisp/Clojure?
  • Functional Programming!!!
  • Should cover
    • Built in helpers: each, each-in, if, get, let
    • Writing and using your own helpers
• Actions
  • Should be updated to use onclick= style actions
  • Should be updated to use the @action decorator instead of the {{action}} helper
  • This still belongs in templating in general, since bound actions need to be assigned to an onclick handler or a modifier to work correctly.
• Links
  • Update to refer to the link-to component as a helper, I think this will be less confusing than explaining that some components must be invoked using curly syntax.
• Input Helpers
  • Update to refer to these as components, since they can (and generally should) be invoked with angle bracket syntax now.
  • Update to angle bracket syntax.
• Development Helpers - stays the same

[ppcano]

I write it down on this issue, because I didn't find the Leveling Up one.

Template Helpers API has changed for the Octane/MU layout, see for reference:

emberjs/ember.js#16361

emberjs/ember.js#17556

[jenweber]

I have a very rough draft, #477. It is not feature complete but I wanted to get it up ASAP.

[locks]

Considering the Templating section was subsumed by Components, how should we move this work forward?

[jenweber]

Closed - Any remaining updates to the Guides should be handled in new tickets.