The Intuitive Naming Principle: DX Delight

As frontend developers, we’ve all been there - stuck in a maze of files, struggling to find the right component or module. This observation brings me to a principle that reduces developer cognitive load and make coding life easier - The Intuitive Naming Principle.

“The effort required to navigate a codebase is inversely proportional to the intuitiveness of the naming conventions used for components and files.”

The Intuitive Naming Principle.

Recognition over Recall

This principle, popularized by Donald Norman, suggests that it’s easier for people to recognize something they’ve seen before than to recall it from memory. Using intuitive names for components helps developers recognize the file they need, rather than having to recall its exact name.

The Benefits:

Faster development: Spend less time searching for files and more time writing code. Improved collaboration: Make it easier for your team to understand and maintain your codebase.

The Takeaway:

Take a closer look at your component naming conventions and ask yourself: “Is this name intuitive? Does it clearly indicate what the component does?”

Here are few practical examples contrasting vague or too generic filenames with more intuitive ones:

Vague/Generic	Intuitive
Form.tsx	FeedbackForm.tsx
Nav.tsx	NavigationBar.tsx
Widget.tsx	SearchWidget.tsx

By adopting the Intuitive Naming Principle, efficiency and coding experience is improved 10x!