# Ember template convention

**URL:** https://meta.discourse.org/t/ember-template-convention/51954
**Category:** Development
**Created:** [October 24, 2016, 12:16pm UTC](https://meta.discourse.org/t/ember-template-convention/51954 "2016-10-24T12:16:09Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![sevenmaxis](https://avatars.discourse-cdn.com/v4/letter/s/bbe5ce/32.png) [@sevenmaxis](https://meta.discourse.org/u/sevenmaxis)
#### Post date: [October 24, 2016, 12:16pm UTC](https://meta.discourse.org/t/ember-template-convention/51954/1 "2016-10-24T12:16:09Z")

</div>

I’m trying to understand EmberJS template convention in Discourse.  
Here’s a snippet from `app/assets/javascripts/discourse/templates/discovery/categories.hbs`

```
{{#discovery-categories refresh="refresh"}}
  {{component controller.categoryPageStyle
              categories=model.categories
              latestTopicOnly=controller.latestTopicOnly
              topics=model.topics}}
  {{!-- my-template --}}
{{/discovery-categories}}

```

What is the meaning of `discovery-categories` and `component`?  
For example I want to insert `my-template` to extend `categories.hbs`, what is the convention I should use to create file with template?

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [October 24, 2016, 1:31pm UTC](https://meta.discourse.org/t/ember-template-convention/51954/2 "2016-10-24T13:31:36Z")

</div>

> [@sevenmaxis](#):
>
> What is the meaning of `discovery-categories` and `component`?

`discovery-categories` is this [component](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/components/discovery-categories.js.es6). It’s used to display categories in the home pages.

`component` is an [Ember helper](http://emberjs.com/api/classes/Ember.Templates.helpers.html#method_component) which allows to insert components **dynamically** 😉

---

<div class="post-metadata">

### Author: ![sevenmaxis](https://avatars.discourse-cdn.com/v4/letter/s/bbe5ce/32.png) [@sevenmaxis](https://meta.discourse.org/u/sevenmaxis)
#### Post date: [October 24, 2016, 2:15pm UTC](https://meta.discourse.org/t/ember-template-convention/51954/3 "2016-10-24T14:15:18Z")

</div>

Could you explain more explicitly? What is the block style {{#d}}…{{/d}}?

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [October 24, 2016, 2:16pm UTC](https://meta.discourse.org/t/ember-template-convention/51954/4 "2016-10-24T14:16:40Z")

</div>

That’s the block syntax in handlebars.

I suggest you go through the [handlebars doc](http://handlebarsjs.com/) and the [Ember Guides](https://guides.emberjs.com/v2.8.0/) to learn more.