A Short Guide to Component Naming

by Chandru Ranganathan, WebCoder

1. Brevity is Key

Time is scarce, don’t waste it typing out long, descriptive component names. One approach is to give them short, cryptic names that only you will understand.

Need a button? Call it "btn". A modal? How about "md"? You’ll save precious minutes per day and you’ll get the added benefit of being the only person in the codebase who knows where anything is. This is called job security.

2. Rank High in Search

When working in large repos with lots of collaborators, it’s important that your component ranks high when people search for anything.

One way to stand out is to include all the possible search terms in your component name. Instead of “SignInButton” you might want call it “SignInButtonAuthenticationCookieUserLogIn” which will ensure that it is returned in almost any related search result.

3. Mix Languages

If you work remotely, it’s likely you are on a global team and yet all your components have English names. This slows down your non-english colleagues considerably so you should allow them to use their native tongue when naming components.

You can create an index file that maps all the different languages within your repo. Need a dropdown? Look for “Desplegable”. A form? Search “Форма”. You’ll learn multiple new languages while being more inclusive to your colleagues.

More articles

Unleashing Collective Intelligence with Webcoder.ca: A Journey by FUEINT Techies

At FUEINT, we're passionate about web development and dedicated to constantly honing our skills. To showcase our expertise and share our journey, we've acquired the domain Webcoder.ca. Our vision is to transform this platform into a dynamic repository of knowledge, reflecting the day-to-day learnings and experiences we gain from working on client projects.

Read more

JavaScript and Its Evolution

Trace the journey of JavaScript from its early days to the latest ECMAScript standards. Discover the key milestones that shaped the language we use today.

Read more

Connect with Us

Have any questions or need assistance with your project? We’re here to help! Fill out the form below, and our team will get back to you as soon as possible. Whether you're looking for more information about our services, want to discuss a potential collaboration, or have any other inquiries, we’d love to hear from you.

Address
12, Sri Vigneshwara Nagar, Amman Kovil
Saravanampatti, coimbatore, TN, India 641035