Ansub Khan

Engineer & Designer


Do quality open-source contribution

June 8, 2024 (1mo ago)


Open source is the backbone of web, we see so many startups are built on top of libraries which have been written and maintained by someone for completely free just as a good will and a way of giving back to the community.

Before going into how you can contribute to open-source, let’s first understand what open source actually is.

What is Open-Source?

Open source is a piece of software that has been made free to use, modify, and share with others easily, which is hosted on some versioning platforms like GitHub, where people come together and work on creating or making meaningful improvements to the software so that everyone can benefit from it.

I made meaningful improvements bold, there is a reason for that, which I will be covering later on.

How do I contribute?

For this I will be giving example of my own open-source project SyntaxUI, majority of repositories follow the similar standard. Some repositories also include a file that outlines the rules and guidelines for contributing to the project.

Create Awarenesss

To make a contribution, you need to look for improvements or bugs that the repository has. One of the best places to look for them is in the issues section of the repo. In the issues section, some of the issues are marked with good first issues look for those.

Also, if you are already using the repository yourself and you find any bugs or improvement in it, you can use the same Issues section to open an issue so that the code maintainers will know about it.

Opening an issue on a repository is a valuable contribution. It helps maintainers and contributors identify areas for improvement, prioritize their work, and ensure the project meets users' needs.


Ensure your issue is concise, constructive, and well-documented to effectively communicate the problem to others.

Let’s say you find a bug where a button is not working at signup page, you will then raise a Issue about it in following steps along with example for each step:

  1. Create a Issue Title

    “Submit button not working on the user registration form”

  2. Write a little Description about the Issue

    I encountered an issue while trying to register a new user account on the website. The problem occurs when I click the "Submit" button on the user registration form, which is located at the /signup route.

  3. What should be the Expected Behaviour

    After filling out the registration form with valid information and clicking the "Submit" button, I expected to be redirected to a confirmation page or receive a success message indicating that my account was created successfully.

  4. What is the Current Behaviour

    When I click the "Submit" button on the registration form, nothing happens. The page does not respond, and there are no visible error messages. The form data is not submitted, and I am not redirected to any other page.

  5. How can people reproduce the same behaviour that you are experiencing

    Steps to reproduce:

    1. Navigate to the /signup route on the website.
    2. Fill out the user registration form with valid information.
    3. Click the "Submit" button.
  6. Provide Screenshots too if needed.

Getting the hands dirty

Let’s take the example we discussed above, now if you already know the solution to the bug by looking at the code, you can fork the repo and make the change and raise a PR so that maintainers can review and push the repo to main.

Here are the steps to follow:

  1. Fork the repository to create your own copy of the project.
  2. Make the necessary changes to fix the bug in your forked repository.
  3. Once you have implemented the solution, create a pull request (PR) to submit your changes for review.
  4. The maintainers of the repository will review your pull request.
  5. If your changes are approved, the maintainers will merge your pull request, incorporating your bug fix into the main project repository.

Same goes with features additions aswell.

Important Note

Only thing to keep in mind is that before creating issues and PRs make sure it aligns with the project's goals and the maintainers vision and you are not making any spam PRs.

For eg. This is a bad PR:


Making good PRs is super important. It shows you're serious about coding and that you've taken the time to make the code better. Nobody likes reviewing bad PRs. It's a total waste of time for everyone and makes you look bad too. Plus it's a big hassle for maintainers who have to close all those PRs.

Always be thoughtful when you're contributing to open-source projects! And If you are looking for making open-source contirbutions you are more than welcome to contribute to SyntaxUI.


Subscribe To My Newsletter

Stay ahead of the curve with my monthly newsletter called Luminary. Receive valuable insights on the latest trends, techniques, and tools in web development and design.

© 2024 - Ansub Khan