gitsetgo icon indicating copy to clipboard operation
gitsetgo copied to clipboard

Add a timeline component to create a user's timeline.

Open mrinal4 opened this issue 4 years ago β€’ 23 comments

Details will be given when someone is assigned.

mrinal4 avatar Jul 09 '20 20:07 mrinal4

@garimasingh128 I want to work on this issue

AshutoshDash1999 avatar Aug 13 '20 17:08 AshutoshDash1999

@AshutoshDash1999 Just ping me up on slack and we'll discuss how to proceed.

garimasingh128 avatar Aug 13 '20 17:08 garimasingh128

Will it work? Screenshot from 2020-08-16 17-18-10

AshutoshDash1999 avatar Aug 16 '20 11:08 AshutoshDash1999

Looks kind of empty on the side and colors are also not in sync with the theme of the app. Can you research more and try for better templates.

garimasingh128 avatar Aug 16 '20 12:08 garimasingh128

Edited the color with the color palate you provided, and adjusted the alignment. Screenshot from 2020-08-16 18-57-12

Shall I look for other templates?

AshutoshDash1999 avatar Aug 16 '20 13:08 AshutoshDash1999

Refer to this: codepen.io/tutsplus/pen/QNeJgR

I want the same with alternate cards and animation when we scroll down. You just need to change the color palette like use the exact color code of purple used in the resume or some other color used in the app. The pink looks odd so keep it neutral maybe. Then you can fetch the data with the api once the design is finalized.

garimasingh128 avatar Aug 16 '20 13:08 garimasingh128

how is it? Screencast from 16-08-20 08 42 59 PM IST

AshutoshDash1999 avatar Aug 16 '20 15:08 AshutoshDash1999

Looks perfect. Just change the color palette and move ahead with setting up the content. You need to show the date of creating of the repo, no of stars, no of forks, description of the repo in the cards. Add if I missed something.

garimasingh128 avatar Aug 16 '20 15:08 garimasingh128

I have picked up the color from the resume. For showing the details from the repo I guess you will be using APIs but I'm not familiar with using API and JS. I guess you have to create another issue for that. For now can I submit a PR?

AshutoshDash1999 avatar Aug 16 '20 16:08 AshutoshDash1999

The issue belongs to the hard category so the assigned person has to create both the front end and backend. I already shared the resources in the README. Please go through it if you have any doubts. Also, FYI the code for API fetching of the repos is already present in one of the components it's just commented. You can refer to that for help. For setting data you just have to put {repositories.name} something like this in h1, p, etc tags in jsx.

Let me know if you can get started with it. PS: Keep the background the same for this component as the main page. You don't even need to add a background as I think I have already set it in index.html so its same for all components. The card color is good.

garimasingh128 avatar Aug 16 '20 17:08 garimasingh128

okay, I want to give it a shot, but I can't promise anything if I could do it succesfully!

AshutoshDash1999 avatar Aug 16 '20 17:08 AshutoshDash1999

No issue. Ping any of the mentors on slack or me if you face any error or doubt.

garimasingh128 avatar Aug 16 '20 17:08 garimasingh128

Hey, I could not find the code for API fetching that you were talking about.

I guess it would be better if you can assign someone better. I need to give some more time in learning, till then I would love to took up an issue wich requires only Front-End.

AshutoshDash1999 avatar Aug 17 '20 15:08 AshutoshDash1999

For anyone taking this issue, repos are coming as a parmeter in displaycard.js. You have to fetch them in the same way in Timeline.js component and just set the title, date of creating of the repo, no of stars, no of forks, description of the repo in the cards. Add if I missed something.

For ex: use the url : https://api.github.com/users/garimasingh128/repos to get my repos. In the same way replace garimasingh128 with the searched username.

garimasingh128 avatar Aug 17 '20 15:08 garimasingh128

@AshutoshDash1999 create a PR for the frontend of the timeline.. Name it Timeline.js

garimasingh128 avatar Aug 17 '20 15:08 garimasingh128

@AshutoshDash1999 create a PR for the frontend of the timeline.. Name it Timeline.js

@garimasingh128 Shall I not include the html and css files?

AshutoshDash1999 avatar Aug 17 '20 16:08 AshutoshDash1999

Didn'y you create a JS file? The project is based on react not html css. You can still create it you just need to convert it to jsx. Let me know if you can do so in a week or so or Leave the issue for other.

garimasingh128 avatar Aug 17 '20 16:08 garimasingh128

I'm leaving this issue for others. :)

AshutoshDash1999 avatar Aug 17 '20 16:08 AshutoshDash1999

@garimasingh128 how much time will be given to complete this issue?

Akshi149 avatar Aug 23 '20 14:08 Akshi149

You can do it as per your convenience at max 2.5 weeks but report in slack or in comments in every 4-5 days with the progress.

garimasingh128 avatar Aug 23 '20 15:08 garimasingh128

I m not familiar with API and js but will try hard to learn it as soon as possible πŸ˜…

Akshi149 avatar Aug 23 '20 15:08 Akshi149

Please assign me this issueπŸ˜ƒ

Akshi149 avatar Aug 23 '20 15:08 Akshi149

Yup. There are plenty of youtube videos that fetch repo info based on usernames. Take help from them. For the frontend of timeline there is already a link in the roadmap. You just have to convert it to jsx in react.

garimasingh128 avatar Aug 23 '20 15:08 garimasingh128