As I delve into my Angular project, I find myself contemplating the idea of using the App acronym as a prefix for all Classes, Interfaces, and Functions. This practice is commonly seen in tag components, where adding the App acronym helps avoid conflicts in the DOM and enhances searchability.
For instance, if my app acronym is 'toh' (Tour of Heroes) and I create a filter component, its tag could be <toh-filter>
.
While this approach works well for components, I'm curious to know if extending this prefixing to ALL aspects of the codebase is considered a best practice. By all aspects, I mean all Classes, Interfaces, exported functions, and constants.
Exploring the Pros & Cons of this approach is crucial to understanding its rationale and effectiveness.
It's worth noting that the application in question will only be used internally and not consumed by other apps as a library.
Here are some examples illustrating the difference between using prefixes and not using them:
// ./filter.component.ts
@Component() export class FilterComponent {}
@Component() export class TohFilterComponent {}
// ./some.service.ts
export class SomeService {}
export class TohSomeService {}
// ./utils.ts
export function deepCopy() {}
export function tohDeepCopy() {}
export function pipe() {}
export function tohPipe() {}
Thank you for your insights!