correct template name convention in ember js camelCase vs snake_case

Question

I'm building an app in ember js with rails as backend(I am using the ember-rails gem) and I'm struggling with the correct way to name my handlebars templates. What is the correct convention? For example:

I imagine that for the route /user_profiles/4/ I should put my template in user_profiles/show.hbs right? Or should it be userProfile/show.hbs?

Same for a simple template, should it be user_menu.hbs or userMenu.hbs (both of them are working for me). However in order to render it with the helper i need to do :

{{render 'userMenu' }}

to use right my App.UserMenuController

So Should I use camelCase every where or snake_case ?? or both (camelCase for folders and snake_case for filenames)

Can someone help my to understand it since in ember guides the are mostly simple names like posts or comments so it is hard to understand.

Answer 1

I'm struggling with the correct way to name my handlebars templates. What is the correct convention?

Most of the time the template name will match the route name. If route name has a . replace it with a / and covert camelCase route names to under_scored template names. See the naming conventions guide for more examples.

I imagine that for the route /user_profiles/4/ I should put my template in user_profiles/show.hbs right? Or should it be userProfile/show.hbs?

Not sure where you are getting show.hbs. Since template is based on route names (not urls) it is impossible to tell. Let's assume you've got routes like this:

App.Router.map(function() {
  this.route('user_profile', { path: '/user_profiles/:user_profile_id' });
});

The routes name is "user_profile" so Ember.js will look for these objects:

• App.UserProfileRoute
• App.UserProfileController
• the user_profile template

Alternatively you could use a route name of userProfile, everything else would stay the same.

So Should I use camelCase every where or snake_case ?? or both (camelCase for folders and snake_case for filenames)

Convention seems to be camelCase for everything but template paths (and thus template's foldername/filename)

Answer 2

As of Ember 2.x naming convention is:

• kebab-case
  • file names
  • directory names
  • html tags/ember components
  • CSS classes
  • URLs
• camelCase
  • JavaScript
  • JSON

http://ember-cli.com/user-guide/#naming-conventions