# My First Contribution to Open Source.



## What is open-source?🤔
The term open source refers to something people can modify and share because its design is publicly accessible.

As per the definition of Red Hat :-
> "*Open source is a term that originally referred to open source software (OSS). Open-source software is code that is designed to be publicly accessible—anyone can see, modify, and distribute the code as they see fit*".

## How I contributed to open-source?🚀
I have been learning web development and in the month of May-2022, I started learning `ReactJS` (the library of JavaScript). I have a Twitter account and I am following @[tapasadhikary](https://twitter.com/tapasadhikary).

In the same month i.e May 2022, I saw one post from @[Tapas Adhikary](@atapas) where he mentioned about one open-source platform i.e `ReactPlay`. There was one link in the same Twitter post about the complete article on `ReactPlay`. I clicked and read each and every line of that blog.

I came to know that `ReactPlay` is an Opensource platform to learn, create and share `ReactJS` projects with the developer community. 

I thought this was the best way to learn `ReactJS`. By making projects, you can learn many things so I did the same.

On the same day, I messaged @[Tapas Adhikary](@atapas) on Twitter and asked him shall I contribute to `ReactPlay`? he replied immediately, why not?

So I went to the `ReactPlay` repo on `GitHub` and read about how to contribute? I followed the step and started working on my project.

I made a small project i.e [`Tic-Tac-Toe`](https://reactplay.io/plays/tic-tac-toe-game) game in React. 

### The issues I faced:-
I was a beginner in `ReactJS` and I had been studying it from React official docs and in docs mainly class components are mentioned. So I also made my first project in class components and submitted the same for review.

But the `ReactPlay` team reviewed my project and submitted:-

1.  That you had used class components and that is not preferable so convert your class components to functional components.
2. The CSS part was having some issues like classes name were not proper.

This was very beneficial for me like my code was reviewed by an **experienced team**.

### How I overcame the issues? :-

As I am a beginner in `ReactJS` and did not know much about **functional components** so I started to learn **functional components** and slowly I started to convert **class components** to **functional components**.

I took some help from my friends on Twitter and made the project purely in function components.

I again submitted the code for review. This time my code checked and no issue was found.
The project then successfully merged to the `ReactPlay` repo. 🎉

## ⭐️ Why should you contribute to open-source?

The question generally arises in our mind why do I contribute to open source?
let's see why you should contribute to open source?

**1. Build your confidence as a developer **:- Like I said that my code was reviewed by the experienced team so I created more pull requests and tried not to make the same mistake from previous submissions so I begin to learn how to write good code. It boosted my confidence as a developer.

**2. Build your professional network**:- Contributing to open source is an excellent way to build that network. After contributing to the `ReactPlay`, I joined their discord community and interact with like-minded developers in the open-source space, and build connections along the way. Such relationships can turn into career-changing connections.

**3. Improve programming skills**:- Contributing to open-source is a great way to improve your programming skills, help others and learn how to work in a collaborative environment.

**4. Rewards**:- If we contribute to open source, sometimes we will get some rewards like I got the badge of open source contributor from **aviyel.com**.  A badge of honor feels awesome It motivates people and gives them the confidence to take up the next challenge.

**5. Learn from Existing Projects**:- We can learn many things from projects available on open source. As in my case, I Learned from Existing Projects of different experience levels that are available on [`ReactPlay`](https://reactplay.io/). You can find them on the playlist page.

## Important Links:-
-  [An Article on what is ReactPlay?](https://blog.greenroots.info/introducing-reactplay-learn-create-share-reactjs-projects)
-  [ReactPlay Repo on Github.](https://github.com/reactplay/react-play)
-  [ReactPlay website.](https://reactplay.io/)

---
That's all about this article.😀

If you enjoyed this article and want to see more content about development, design, creativity, and learning, then follow me on 

-  [Twitter](https://twitter.com/tejinder_id) 
-  [See my work at Codepen](https://codepen.io/tejinder01)
-  [Github](https://github.com/tejinder-sharma)
-  [Hashnode](https://hashnode.com/@Tejinder)

If you'd like to support me to make more content, check out my BuyMeACoffee page. 

[![bmc-button-small.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653620783112/BFgztGvbk.png align="left")](https://www.buymeacoffee.com/tejinderweW)

