File naming in JavaScript world

One thing that I find confusing in JS/TS culture is file naming when it comes to things, like “something.xyz.ts”.

Let’s take a look at Nest.js.

These are some examples from documentation:

  • cats.controller.ts: export class CatsController
  • app.module.ts: export class AppModule
  • cats.service.ts: export class CatsService
  • create-cat.dto.ts: export class CreateCatDto
  • cat.interface.ts: export interface Cat

Along with this some examples from real projects:

  • virtual-product.mapper.ts: export class VirtualProductMapper
  • virtual-product.repository.ts: export class VirtualProductRepository
  • image-gallery.ts: export class ImageGallery

Some things, like repositories, controllers or services deserve a special case in file names for some reason. Though a “Product Repository” does not differ from an “Image Gallery”, those are just “repository of products” and “gallery of images”. Or a “product mapper”, or an “application module”. There is no sacral exclusive meaning in those.
They should all be just: “product-repository.ts”, “product-mapper.ts”, “app-module.ts” and so on.

Another case is “cat.interface.ts”. Contrary to PHP standards interface names in TypeScript usually don’t include the “Interface” suffix. But why do files do? Why not just “cat.ts”?

Same applies to enums, i.e.: “order-status.enum.ts”: export enum OrderStatus. Why putting this “.enum” part on a file name?

Another case from the swagger module:

  • type-helpers/omit-type.helper.ts: export function OmitType

It’s just chaotic: the folder says: “type-helpers”, the file name argues: “type.helper”. The function is just “OmitType”, so what’s a “.helper” stands for in the file name? What’s a helper anyways? It’s not a real thing.

The PSR auto-loading in PHP besides its main value brought consistency here:

  • there’s just one thing in a file: a class, an interface or a trait.
  • the file name 100% corresponds to the name of that thing.

This brings peace.

In code both PHP and JavaScript use PascalCase. JavaScript tends to use kebab or camel case in file names, which is totally fine, but please be consistent: drop those dots.