[ENHANCEMENT] : display a tag bar below the search bar.

[Bismay5467]

The idea is borrowed from issue #240.

We could incorporate a tag bar beneath the search bar, showcasing the ten most prominent skills possessed by the developers. Clicking on any of these tags would enable users to search for developers who possess the corresponding skills. This enhancement has the potential to significantly improve the search functionality for our users.

However I need a clarification before working on this issue. Will tags like react and react js or node and node js be considered differently or the same, as was correctly pointed out in issue #240?

For ref I quote a part of the convesation from issue #240:

This itself will require some discussion on how we store the technologies and their nomenclature - (For ex - Nodejs, Node, node, Node Js) may all be valid inputs that we allow users? It gets more challenging for things like c++ where it can be entered like cpp .

Suggested UI:

[github-actions[bot]]

Welcome, @Bismay5467! Your issue is like a spark that ignites innovation. We're thrilled to dive into it and work together to find a solution.

Soon the maintainers/owner will review it and provide you with feedback/suggestions.

[shyamtawli]

Yeah I also like the idea. As we can make some popular tags like you can see on BioDrop.

[Bismay5467]

Will tags like react and react js or node and node js be considered differently or the same

@shyamtawli I need a clarification on this before proceeding to work on this issue.

As you can see in the biodrop website they have treated react and reactjs differently.

Also do you need me to display the count of the matching profiles for a particular tag as they have displayed in the biodrop website?

[shyamtawli]

Only tags can be enough for now. Treat React and ReactJS as one tag.

[Bismay5467]

Okay, can you please assign this issue to me?

[Bismay5467]

@shyamtawli after a entensive search I concluded there may exists no npm libraries to solve our purpose of normalising the strings before comparing. I have thought of a workaround where we can use a hashmap to store <entered string, cleaned string> pair (For example : one such pair can be <"node", "node js">).

Contributors can add more such skills to this map which can improve the ranking of the different tags.

We can open a issue similar to one #411 to let others contribute once my PR to solve this issue gets merged. I would love to hear your thoughts on this.

[shyamtawli]

As of now you can do that just add some tags like Node, React, Next, etc. Once the use click the tag reflect it on search bar and let the search function work. After that we can think of more on it.

Hacktoberfest is going on so we have to attract more user towards this project. I just open add:profile issue to attract more users.

[Bismay5467]

I was considering implementing a getTagRank() function to count the total occurrences of a specific skill within the list of developer profiles. This way, we can display the top 8-10 skills in the tag bar. However, if you prefer to keep the tags in the tag bar static for now, that's also an option.

I'll start working on this issue once I've committed the changes requested in PR #476.

[shyamtawli]

First let merge previous issue you are working on.