Community cards implementation.

[Mayaleeeee]

I'm interested in contributing to the community cards implementation. More of this can be found #903

1. I feel that in order to make the cards more accessible and easier for users to understand what each card means without looking at the names, we should incorporate an illustration or picture that describes the cards.
2. For the community cards, what does it entail?? How does it work?

@AceTheCreator @mcturco @derberg

[github-actions]

Welcome to AsyncAPI. Thanks a lot for reporting your first issue. Please check out our contributors guide and the instructions about a basic recommended setup useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.

[mcturco]

I feel that in order to make the cards more accessible and easier for users to understand what each card means without looking at the names, we should incorporate an illustration or picture that describes the cards.

Great idea, @Mayaleeeee! Go go go 🚀

For the community cards, what does it entail?? How does it work?

@AceTheCreator You may want to give some direction on the intent of these cards from a UX standpoint. Why did we add them? What purpose are they serving? How will they help visitors get more information about the community?

[Mayaleeeee]

Thanks @mcturco

[AceTheCreator]

@AceTheCreator You may want to give some direction on the intent of these cards from a UX standpoint. Why did we add them? What purpose are they serving? How will they help visitors get more information about the community?

Thanks, @mcturco
@Mayaleeeee I'm really glad you're interested in implementing this.

Firstly, If I get you correctly @Mayaleeeee the first bullet point you indicated is about enhancing the existing cards we have on the community landing page that links to other pages.

Secondly, the goal of the community card is to make all contributors visible. A case study is this...
We are going to have a page /community/contributors where all the lists of contributors will be displayed, for each contributor card, it'll include the name of the contributor, projects contributed to, contributors' handles, and pictures and contribution metrics

[Mayaleeeee]

That's nice.
Thanks @AceTheCreator

[Mayaleeeee]

Here is an update on the contributions' page I'm working on, folks. Please let me know your thoughts.
@mcturco @derberg @AceTheCreator

[mcturco]

@Mayaleeeee This is looking great so far! I think the second option works better, but I am wondering if we really need the colored dots and if we can take down the intensity of the drop shadows. We should also add a light grey border and rounded corners to match other UI elements on the website.

I would also use the secondary/500 as an accent color, as this is what I have been doing on the rest of the website. The purple color is to be used sparingly so we do not overdo it.

Maybe you can also start exploring what this would look like on mobile devices?

Great work so far! 🎉

[Mayaleeeee]

Alrighty @mcturco , thanks for the feedbacks.

I'll will definitely work on it and get back soon🥰🥰.

[derberg]

I ❤️ desing

I'm more concerned how we can make it work from data point of view. It will be super difficult to classify contributors by "Developers", "Designers", "Technical Writers" other than manual 🤔

Other data, like contributions, issues, forks -> is possible, as this data is easy to access from API and archives.

Regarding social media -> GitHub do not enable users to specify their LinkedIn profile explicitly, so we will have to remove this from design, and replace with icon that can represent "user website link". I mean, this things we will have to take from somewhere in automated way, "somewhere" is GitHub API. And 👇🏼 is the only you can get

[Mayaleeeee]

Okay @derberg
Are you suggesting that we do away with the categories and simply put all images of each contributor?

And regarding the social media, we just need to delete the linkedln icon right?

[derberg]

Are you suggesting that we do away with the categories and simply put all images of each contributor?

yes, at least for the first iteration. It is because I personally do not see how technically we could get these categories working. I mean where would we take it from 🤔

I know that we have PR titles with docs: for example, but it doesn't mean contributor is a tech writer.

Although I love the idea of highlighting to the community that contributors are not only developers, but just do not see how we can get there 😞

Thoughts @akshatnema @AceTheCreator ?

And regarding the social media, we just need to delete the linkedln icon right?

yup, but not delete, maybe replace with some icon that we can use for info that GitHub users put under URL field in their settings, which usually is their blogs/profile websites

[Mayaleeeee]

Hey Folks

I'll be updating this file very soon. @mcturco @derberg @AceTheCreator

[AceTheCreator]

@Mayaleeeee I noticed I missed this Issue...

I started working on the contributor's page with no idea you have an implementation for a community card in progress. What's the status of your progress?

You can also check out the PR for the contributor's page here #1122

[Mayaleeeee]

Hey @AceTheCreator, I'm so sorry for the late response.

It's OK, I was supposed to update the file this week and make corrections based on what @derberg and @mcturco suggested, but I can't find the Figma file on my board.

[AceTheCreator]

Hey @AceTheCreator, I'm so sorry for the late response.

It's OK, I was supposed to update the file this week and make corrections based on what @derberg and @mcturco suggested, but I can't find the Figma file on my board.

So sorry to hear that Maya... I hope you resolve it

[Mayaleeeee]

Yeah yeah @AceTheCreator
I'm working on a new one atm

[Mayaleeeee]

Hey @derberg @AceTheCreator @mcturco
I've updated the community members' page, but I could not find an appropriate icon to replace LinkedIn @derberg. I'm open to suggestions, though.

Please check I out.

[derberg]

LGTM

I'm only missing:

• under main header with page name, we should have a note that the list is sorted alphabetically, like in https://www.asyncapi.com/community/tsc
• next to github and twitter icons we should have kinda globe (I think it is standard) that will represent link to user website

other than that, it is perfect.

[Mayaleeeee]

Thanks @derberg
I'll work on it tonight and update it here.

[reachaadrika]

Hey @derberg , If @Mayaleeeee is not working on this , can I take this up ?

[Mayaleeeee]

Hi @reachaadrika nice to meet you.

I'm done with my internship, so I will resume my work in the community on Monday.

Thank you 🤗🤗

[reachaadrika]

Sure @Mayaleeeee !

[Mayaleeeee]

Hey @derberg @AceTheCreator @mcturco @ALL
I've updated the community members' page based on @derberg feedback; please check it out.
Thanks.

[derberg]

I think it looks good, nice job!

now we need to figure out how to power it with data 😄

[Mayaleeeee]

Thank you

[derberg]

@allcontributors please add @Mayaleeeee for design

[allcontributors]

@derberg

I've put up a pull request to add @Mayaleeeee! 🎉

[AnishKacham]

Hii. Absolutely love this Idea ❤️
So I found two endpoints of the github api.
endpoint to list org's repositories
endpoint to fetch a repo's contributors

So it is possible to show cards for each and every contributor who has committed to any of the org's repositories.
Is this what we will be displaying?
@derberg

[AnishKacham]

@akshatnema @Mayaleeeee @derberg Have any ideas in mind for this?

[ankur0904]

I think it looks good, nice job!

now we need to figure out how to power it with data 😄

@Mayaleeeee @AceTheCreator @derberg
Can I work on this issue?

[derberg]

hey folks. I'm not sure what should be the future of this issue. To implement the UI, we need data first - collecting them is super difficult and also brings costs that I'm not sure are worth it.

pinging @thulieblack that played with data some time ago, and @AceTheCreator that was involved in discussions

[Oloso-surur]

hey folks. I'm not sure what should be the future of this issue. To implement the UI, we need data first - collecting them is super difficult and also brings costs that I'm not sure are worth it.

pinging @thulieblack that played with data some time ago, and @AceTheCreator that was involved in discussions

Hello, @derberg
My name is Surur and I'm just starting a career in data analyst.

I have reached out to @thulieblack on this issue, we were able to discuss it on a call and I'm already working on it.

It's a WIP 😀

cc @thulieblack

[derberg]

oh, nice!

[sambhavgupta0705]

@Oloso-surur any updates?

[Oloso-surur]

@Oloso-surur any updates?

Hello everyone, here is an update on the contributors' data I'm working on.

You can view the data via this link.
cc @derberg @thulieblack @Mayaleeeee @AceTheCreator @sambhavgupta0705

[AceTheCreator]

@Oloso-surur, great work, but I want to ask how you got the following data?

[Oloso-surur]

Hello everyone, here's how I got the data 👇🏽👇🏽👇🏽

To collect the data for each contributor, I accessed our Organization link on GitHub and manually retrieved the details for each profile.

After that, I carefully extracted the relevant information from each profile and manually entered the sorted data into a Google sheet by hand.

Here's the link to the google sheet with all the data.

cc @thulieblack @AceTheCreator @Mayaleeeee @derberg @sambhavgupta0705

[thulieblack]

MMH, I'm skeptical that you collected the data manually, and some fields are incorrect. We need data across all GitHub repos, and manually collecting them isn't the best solution at all.

[akshatnema]

@thulieblack Should we have a service to collect data across all repos and then store them in a json file or any other DB?

Because collecting the information at real time is a very resource consuming and time taken process.

[thulieblack]

we previously used GitHub archive to collect data, the downside to this was the amount of storage needed to store the data queries to the database.

Unless there is an alternative to this?

[akkshitgupta]

we can do the same using the GitHub API to collect all the data. we get the data in JSON format but if required we can convert to yaml or csv format as per the requirement.

[akshatnema]

Unless there is an alternative to this?

@thulieblack Analyzing the data via Github Archive will sure take time. We can't do it using github workflows. One of the possible solutions can be doing it manually over a Google collab where all the archive data will be given using a tar or zip file and all it's underlying files will be analysed. The Collab will give output in the form of json files, that can be committed to the github repo.

For more flexibility and long term solution, we should use a dedicated server/service to run the python scripts and analyse all the parameters using Github archive.

we can do the same using the GitHub API to collect all the data. we get the data in JSON format but if required we can convert to yaml or csv format as per the requirement.

I don't think Github API should be used because required information is given by github archive easily. So, we shouldn't waste our resources making various API calls to get the data.

[sambhavgupta0705]

@akshatnema are we gonna work on this one ??
If yes then we can submit it to bounty of the next quarter

[GarvitSinghal47]

@sambhavgupta0705 @akshatnema is this issue up for taking , then i would like to work on it .

[sambhavgupta0705]

Yes @GarvitSinghal47 , it is up
You can take it

[GarvitSinghal47]

@sambhavgupta0705 just one more question which approach should i use to get the data as there are two approaches being discussed above one using github api and other using archive.

[ParagGhatage]

Hi @derberg ,
Is this issue still open? I’d be happy to integrate the GitHub API for the Community cards. Let me know!