title: Filetype Naming Convention for Angular Classes
body: <p>Angular's <a href="https://angular.io/guide/styleguide#symbols-and-file-names" rel="noreferrer">Style Guide</a> lists naming conventions for common file types, such as <code>heroes.component.ts</code>, or <code>heroes.service.ts</code>, etc. But what about classes that have no decorator symbols? For example, the Heroes tutorial creates a Hero class:</p>
  
  <pre><code>export class Hero {
    id: number;
    name: string;
  }
  </code></pre>
  
  <p>It then names this file <code>hero.ts</code>. A naming convention like this seems prone to chaos in the <code>app</code> directory. It seems logical to create a folder named classes (in the app directory), and then add a <code>class.ts</code> suffix to each file, such as <code>hero.class.ts</code>.</p>
  
  <p>However, I have not seen anyone using this convention. I've seen people use a <code>model.ts</code> suffix, but it's unclear whether or not this is a best practice, and it is not mentioned in the Angular <a href="https://angular.io/guide/styleguide#symbols-and-file-names" rel="noreferrer">Style Guide</a>.</p>
  
  <p>Can anyone shed some light on this topic? Sorry if I've missed anything. Thank you advance.</p>