JavaScript: File Naming Conventions

So first a little disclaimer, I don't feel how I write files to be better than the next person. This is more of an open forum to discuss how people go about naming theirs and how the manage files as a system grows.

So what exactly do I mean?

So you are working in your company, personal project or whatever it may be and it starts to scale. You get lots of files, loads of components etc.

So in general how do you make sure that you understand what something is? Coming from starting in Angular and reading Clean Code by Robert Martin I am very used to the approach of naming my files according to the thing that it is:

• Component
• Service
• Router
• Util

(communication.service.ts or button.component as an example)

The list goes on. Each has a reason for the name, each has a difference in its responsibility. Just like a function would have its single responsibility.

Now coming into React/Vue most components stick to UpperPascal for their naming and a lot of people just name their files without saying what it is but sometimes what it does. Its just a different approach to file splitting.

So the question comes in how do you go about naming and scaling your code base? What approaches did you take to ensure you don't get overwhelmed by files with hidden meaning behind their names?