rocktimsaikia/contribute-101

✨ A simple project to get you started with your first open source contribution.

contribute-101's Issues

Fetch github profile and add them to the card .

Right now we have a basic work flow going on .The contributors provide their basic info and we just simply loop through the data and make a card out of it . Along with additional details new contributors also provide their github username in the data object.Currently we just use the user_name to add a link to their github profile.But it would be nice if we could also show their github profile picture in the card.

This is our current data model which is an array of objects :

{
name: '',
country: ",
role: '',
tech_stack: ",
github_username: "",
twitter_username: ""
}

So what we have to do is to loop through the array of data and fetch the github profile picture using the provided property github_username . In a way it is just a fairly simple fetching requirement.

If anyone wants to work on it ,you are more then welcome.
If any help needed i'm here !

Helpful links :
https://developer.github.com/v3/users/

Updating Readme with user-friendly instructions

Updating Readme with new information and making it more beginner-friendly.

Link does not open in a new tab.

Right now the hyperlinks (github and twitter button) in the website's card does not have _blank target , so causing this behavior and not opening the link in a new tab.This is not ideal.
This is a first timers bug. So anyone wants to fix this is more than welcome :)

New Design Needed !

Currently the card design of the website is not very clean and synchronous. So need a new design for the card . Here is a rough prototype i was designing for the cards.

.This design is just a rough prototype i did while back to get started with the design flow of the website.Will definitely improve it in future.But for now this seems ok.
So anyone wanna work on this is more than welcome :)

Note :

1. We are using bootstrap for the style environment but Do Not use boostrap's predefined cards for this as bootststaps card is not suitable for dynamic contents.
   2)Just use the current li tags for the card design .
2. As you see i have added another section in the card design saying 'Fullstack developer' . So you also have to add a new key value pair as "role" to the current object model for the card info So the object model will look like this :

    name: "",
    country: "",
    tech_stack: ["", "", ""],
    github_username: "",
    twitter_username: "",
    role: ""

Make the "role" section optional in the UI . (Quick)

I have noticed that most of the pull requests now does not include that role property.Or may be they forget to include the "role" property when adding their details.And this is causing conflicts in most of the pending pull requests. So we need to make the role property optional in the frontend (not in the backend) .
One way to solve that is adding if else statement in the <p> tag where we are rendering the role property.So the logic should be implemented like this

if(role is present)
 render the <p> tag with role the role property.
else
  render a null <p> tag

If you are wondering how to implement if else in frontend , that's why we are using 'ejs' template engine which supports js implementation in frontend. If you need help. i'm here.

you will need to implement the logic here :
index.ejs

Till this issue gets resolved no pull requests will get accepted.

New ideas discussion.

Open for discussion on any new ui designs or any additional features. If you have any creative and simple ideas for this project leave a comment for further discussion 🚀 🎉

• Updating Readme with user-friendly instructions #269

Make the website responsive

The new updated version of the website is not quite responsive yet . It still shows the website in desktop view even in small screen sizes.Which is not very ideal .

So we have to fix it asap . Anyone willing to work on this issue is more than welcome !
Happy coding :)

New Design needed.

Right now the page is very static looking and simple.I think it needs some work on design section.If anyone have any vision with a new design for the homepage you work on that.

Add dark mode

Currently the website has the default white themed mode. It would be nice to have a toggle button at the very top to change the website theme to dark mode.

leave a comment for proceeding to work on this issue.

Add a "go top" and "go down" button.

Add a "go down" button in the top of the website and onclick it should take you to the bottom of the page and another "go top" button on the bottom which will take you to the top of the page with a simple animation.
For animation no external library is recommended , just use the inbuilt css property scroll-behavior.

Anyone wanna take it is more than welcome !

Set up webpack for an easy workflow

Right now the project has no module bundler .Which makes the development process a bit tedious as you have to restart your server in every single change to see it on the browser.
So i would recommend setting up a very minimal webpack config for the project for now .As the codebase becomes more larger then we will add additional plugins to the config in future.
Right now the most needed plugin is Hot Module Replacement.
If anyone wants to take it, you are more than welcome.Or i will set up the webpack very soon myself as this change is very needed .

Add a pre commit hook

Add a git pre-commit hook for lint checking.
You can use either Husky or pre-commit (recommended) for this.

Comment for more information on this one. If you want to contribute but don't understand hooks properly. I'll guide you through.

Pull requests here won’t count toward Hacktoberfest.

Hi there,

Thank you for your interest in Hacktoberfest and in helping others make their first contributions to open source.

While we agree that it's important to help others, this repository does not do this in a way that is in line with the Hacktoberfest values. Please read the part that talks about high-quality contributions to understand why we are reaching out and taking action. Due to this, we've added this repository to the list of excluded repositories which means pull requests here will not count toward Hacktoberfest 2020.

This is not a DigitalOcean decision, it's one that is inspired by the community of maintainers and contributors who all agree that quality is more important than quantity when it comes to engagement in the Open Source community. The values remind us to shift the focus from contributions to repositories that encourage folks to quickly create and gain a pull request to contributions that will help people level-up their skills and contribute to open-source projects that are in need of help.

If you feel that this repository is an effective learning resource, we encourage you to keep running it since a core part of the aim for Hacktoberfest is to encourage new folks to get involved with open-source.

However, if you are interested in having contributions to this repo count toward Hacktoberfest we encourage you to take a look at this list of Hacktoberfest issues for inspiration and make the necessary changes to focus on enabling people to make meaningful contributions to open source projects.

If you have any questions about this or participating in Hacktoberfest, please contact our team via email [email protected] or join our community Discord server.

Happy Hacking,
The Hacktoberfest Team

Hacktoberfest is presented by DigitalOcean, Intel and DEV.

Site is down !

Site is currently down. Will be available soon again

Heroku website not working

Create a tilt card animation effect

Here is a demo on what exactly it should look like ,
Demo: https://codepen.io/felixdorner/pen/oWwpbN

Make the site responsive

New Card Design Needed !

The current card designs are looking very low contrast and very unorganized.For a couple of days we were more focused the server side so now it's time to redesign the website starting with a new card design.

I did some prototyping for the new design of the cards . I also added the color pallets that i am using for the design here .

If anyone wants to work on it , you're more than welcome :)

Note :

1. While coding the cards please also keep in mind that responsiveness matters .

2. Please follow these style guidelines before pushing your changes.

If any additional help or guide needed. I'm here :)
Happy Coding 💻