DEV Community

Cover image for Contribute to Open Source in the next 10 min - Step by Step [Beginner Edition] ๐Ÿฆพ
Bap
Bap

Posted on • Edited on

Contribute to Open Source in the next 10 min - Step by Step [Beginner Edition] ๐Ÿฆพ

Hey friend! ๐Ÿ‘‹

Today marks your start in the Open Source World!! ๐ŸŒ๐Ÿ‘ฏโ€โ™€๏ธ

In the next 10 min, you will contribute to your first Open Source projects - how crazyyy is that. ๐Ÿš€

Now when contributing, we want to:

1. fork -> 2. clone -> 3. edit -> 4. push -> 5. pull

Now, what does that mean in normal language? ๐Ÿ™ˆ

  1. Fork โžก๏ธ Make a copy of a project on your GitHub account
  2. Clone โžก๏ธ Download the project from GitHub to your computer
  3. Edit โžก๏ธ That's self-explanatory - here you will add your name to our contributors file
  4. Push โžก๏ธ Update and send the changes to your online GitHub repository
  5. Pull โžก๏ธ Send your contribution to the original GitHub repository

That may sound a bit intimidating, but don't worry I got you! ๐Ÿ‘ฏโ€โ™€๏ธ

Also if you are wondering:
YES, this is exactly how all the devs in the world contribute to software projects online!

So in this project, you will have a great understanding of the mechanics behind GitHub so that you are ready for your future contributions!

Now, are you reeeeeady?? We got this โ˜•๏ธ๐Ÿ‘ฏโ€โ™€๏ธ

Requirement: If not already done, download Git here.

For the 95% of us that prefer videos instead of text, check this video to assist you in contributing! ๐ŸŒŸ


1. Fork the project

First, head over here and click on โญ๏ธ star in the right corner (to show some love ๐Ÿซถ๐Ÿ’โ€โ™€๏ธ) and then click on the fork button.

Fork means you will create a copy of this repository in your own GitHub account. ๐Ÿ’ช

Now that you have the copy on your own account, let's download the entire project on your local computer!

2. Clone the repository

1๏ธโƒฃ You should now have landed on your forked repo page, here you will see a <> button marked in green, click on it.

2๏ธโƒฃ Click on the button looking like a double square (highlighted in red below) to copy the URL.

Image description

3๏ธโƒฃ Open your terminal.

4๏ธโƒฃ Use your terminal to move to a folder where you want to put the cloned project (using more technical language, this is called moving to a directory of your choice). ๐Ÿ“

5๏ธโƒฃ Type git clone and then paste the URL copied earlier.

You normally should have written
git clone https://github.com/YOUR-USERNAME/YOUR-REPOSITORY

6๏ธโƒฃ Press Enter.

3. Open the File and Make changes

The entire project is now on your computer!

1๏ธโƒฃ On your terminal, make sure that you are in the project (or directory ๐Ÿ˜‰) by running: cd Your-First-Contribution.

2๏ธโƒฃ Open the QuiraContributors.md file in a text editor or on your favourite IDE (aka VS Code, Atom, PyCharm, Sublime etc).

Here you add your name (it can be a nickname if you want to!).

3๏ธโƒฃ Copy the below code and adjust it accordingly:

            <td align="center">
                <a href="https://github.com/YOURUSERNAME">
                    <sub><b>YOUR NAME</b></sub>
                    <br />
                </a> 
            </td>
Enter fullscreen mode Exit fullscreen mode

*Note: We limit 8 profiles per row, so if the current row already has the maximum amount, create a new <tr> YOUR CODE SNIPPET HERE </tr>.

4๏ธโƒฃ When done, save the file!

4. Upload your changes to your online GitHub repo

OK, we got some changes done, now we need to upload them to your GitHub account.

In summary here we want to:

  • โž• add all the changes onto git
  • ๐Ÿ’ฌ add a commit message (which helps tell other devs what you have changed) and
  • ๐Ÿ’พ push the changes to your online GitHub repository.

1๏ธโƒฃ So in your terminal, run the following command: git add .

2๏ธโƒฃ After that, run: git commit -m "description of what you changed/added"

3๏ธโƒฃ Finally, run: git push

At this point, if this is your first time, GitHub will ask you to authenticate yourself with your username and password. ๐Ÿ”

4๏ธโƒฃ Write out your GitHub username first and press Enter.

5๏ธโƒฃ For your password, ever since Aug 2021, it is a personal token you need to write (and not your actual password!). Don't worry though, let's get your token together by following the below: โ˜บ

  • On your GitHub account, hover to the top right of the page and click on your profile image

  • Now click on profile setting

  • Find and Click on developer setting

  • Click on Personal Access Tokens (Token Classic)

  • Click on Generate new token (classic)

  • Give a name e.g "authentification token"

At this point, you should be here โฌ‡๏ธ:

Image description

6๏ธโƒฃ Select the scopes you want (for ease you can select all of them).

7๏ธโƒฃ Click on Generate token

8๏ธโƒฃ Your token will be displayed and you will be able to paste it into your terminal after which your push should have been successful! ๐ŸŽ‰

5. Time to contribute! Send your changes from your online repo to the original repo

We are so close to the end now! ๐Ÿค™

All we need to do is now send over our changes to the original repository to make our contribution.

In "GitHub language", this is called "pulling a request" because you essentially "pull" your changes into the original repository that you forked.

1๏ธโƒฃ Go now to your GitHub repo page online.

2๏ธโƒฃ Click on the Contribute button.

3๏ธโƒฃ Click on Open pull request

Image description

4๏ธโƒฃ You will then title your pull request with your "Name Surname" and you can leave the comment section blank.

5๏ธโƒฃ Click Create pull request and that's it you have made your first contribution!! ๐Ÿš€๐Ÿ‘ฏโ€โ™€๏ธ

Congraaaaaaaats! โญ๏ธ


You may be thinking, I thought I would be taken to the repository straight away but I'm left with the status of the pull request?

YES, this is because we now need to accept your pull request (it is also called merging a pull request).

All in all, contributions happen in this way where the maintainer(s) of the original repository (aka the people that are in charge of the repo) check your contributions and either end up accepting them or giving you feedback on what changes they need from you.

So sit back and relax as you have just done everything you needed! โ˜€๏ธ๐Ÿง˜โ€โ™‚๏ธ๐ŸŽ‰

We know it is always super tough the first time and it's really cool you got to this point - so proud of you! ๐Ÿ‘ฏโ€โ™€๏ธ๐Ÿ’š


If you are ready to start contributing to other projects, we have compiled a list of projects with easy issues you can get started on. Check out the list of projects on quira.sh and here's a short playlist in case you are blocked. ๐Ÿš€

If you haven't yet, you could join our discord server if you need any help or have any questions. ๐Ÿซถ

Top comments (22)

Collapse
 
rasjazz profile image
Jasmine Rasmussen

I am super excited to delve into this. It has always been intimidating (to me at least) to find a project and contribute. The thoughts of rejection and imposter syndrome convince me not to give it a try. This article made me feel more confident, especially about handling Git! Thank you so much!

Collapse
 
fernandezbaptiste profile image
Bap

Hey Jasmine!! Oh wow this is so cool to hear - really glad this has been useful. I would love to know your thoughts on what would be the best type of articles/resources that you would find helpful. Let me know ๐Ÿฆพ

Collapse
 
rasjazz profile image
Jasmine Rasmussen

I personally love to read articles based on best practices for gaming programming. I haven't done much of a search, but I really would love to find more information about different types of open source game projects!

Collapse
 
gerdaespinosa profile image
Gerda Espinosa

This was incredibly useful! Made my 1st contribution to the open source thanks to this tutorial ๐Ÿคฉ.

Collapse
 
fernandezbaptiste profile image
Bap

yayyy!

Collapse
 
a1xbrd profile image
Alex Bird

Easy to forget how complex it is to do this for the first time, I'm just like "submit a PR!". It's a really useful guide ๐Ÿ‘

Collapse
 
fernandezbaptiste profile image
Bap

it is indeed - thanks for the comment! :)

Collapse
 
tuannacomartek profile image
TuanNguyen

Nice !!! Thanks

Collapse
 
fernandezbaptiste profile image
Bap

My pleasure! Let me know what other type of article you would find helpful so I can write it up :)

Collapse
 
akpevwe11 profile image
Akpevwe11

Nice article

Collapse
 
fernandezbaptiste profile image
Bap

Happy to hear you enjoyed it. Any type of article around open source or anything you would like to ready next?

Collapse
 
akpevwe11 profile image
Akpevwe11

open source projects that one can start contributing to.

Collapse
 
fernandezbaptiste profile image
Bap

Happy you found it useful! ๐Ÿฆพ

Collapse
 
promiser profile image
parmeshwar rathod

just contributed it was awesome

Collapse
 
fernandezbaptiste profile image
Bap

that's amazing!!! How does it feel to be an open source coder now? ;)

Collapse
 
marqitos profile image
Marcos Porto Mariรฑo

Is there any important open source project, for people with advanced knowledge in html, css/sass, javascript, php or C#?

Collapse
 
fernandezbaptiste profile image
Bap • Edited

Hey Marcos! That's a good question. There are indeed important open source projects for people like yourself. To find them, I recommend you use Quira.sh (link at the bottom of the article) and filter by the language and topic of your choice. You should find many projects surrounding these languages. You can read their projects and issues to decide if you want to jump in and contribute. Hope that helps.

Collapse
 
luckykumarirai profile image
Lucky kumari

useful blog !!

Collapse
 
fernandezbaptiste profile image
Bap

Thanks a lot Lucky! Here to please ๐Ÿ‘ฏโ€โ™€๏ธ Any other type of blogs in the space of Open Source that you think would be useful to you?

Collapse
 
veloct84 profile image
Lokman Ahmad

Thanks, now I know how to contribute to github

Collapse
 
fernandezbaptiste profile image
Bap • Edited

My pleasure Lokman!! Is there anything in open source you would like to learn about next? Let me know!