It was the December 29th, and I was on vacation. I hadn't coded for over few days and wanted to do something valuable. I remembered having this desire to contribute to Supabase through open-source for few months. Having secured a job in the September, I became quite busy with the new project learning and was not able to give time to other activities. So, when I finally found a little window to fulfill my desire, I took it. Here's how I did my first ever open-source contribution this year.

Beginning

The first thing I did in order to start contributing was to go to the Supabase GitHub Repository and clone it using GitHub CLI. Afterwards, I started to look around the repo to see how to set it up in local past the cloning step and I found this on their Developers.md file. I followed the steps mentioned in this document and my local setup was up and running. Now, it was time to figure out what issues I can tackle!

For my first open-source contribution, I wanted it to be simple but not spammy like changing README.md and other similar tasks that just adds headache on the developers. So, I went to the Issues sections, looked at open issues and applied the good first issue label to get all the issues which are meaningful yet beginner friendly.

I finally picked the issue I thought I could tackle without any problem. It was a Chore issue with the need for starter example of React Native.

I took that issue and started the conversation with Paul on the same thread to get it assigned to me. Since it was during the holidays, our conversation was a bit lagging but I made sure to start working on it next day.

So, on the next day, I created a new branch and included two examples for React Native projects inside examples directory. One, with TypeScript and another in plain JavaScript. This part was easy, as was creating the examples. There were few changes like there is no localStorage in React Native so one has to use React-Native-Async-Storage. I also ran into the problem of .env file variables not being accepted by default, and had to install react-native-dotenv.

Challenges

Once, the whole react-native side was completed, I finally ran the Metro app and went to make a tea for myself only to return and see that the Android run had failed. I had worked with Java sometime during my self-learning phase in 2020, and even created YouTube series on my channel IBCoder, so, fortunately I knew how to fix this gradle issue.

Few things needed to be changed in different files inside android folder:

1. Firstly, added distributionUrl=https\://services.gradle.org/distributions/gradle-7.3-all.zip line inside /android/gradle/wrapper/gradle-wrapper.properties file.
2. Then, added buildToolsVersion = "30.0.2" line and classpath("com.android.tools.build:gradle:7.0.4") line inside /android/build.gradle file.
3. And finally, I had to install 30.0.2 SDK tool related things in Android Studio rather than the default settings they show currently in their docs using 29.0.2 or similar.

The Results

Once these setting changes were in place, things went okay and compilation happened smoothly without any error. I checked few things using manual testing and once I was confident that it is good, I pushed the code to my GitHub repo and finally created a pull request which, after few back and forth of review, was merged to the supabase master branch.

This entire process took eight days in total and finally, I got the suggestion by Paul to send an email for Swag. I had already initiated the process on that front and given my size and address and waiting for the same. Bonus? The fact that my current company, GeekyAnts, supports initiatives like these and I had informed them as well.

In The End

So, to close this article, I will say that I started this year with a great open-source contribution. Doing so gives a little more confidence in the code reading skills and the ability to solve problems. I have decided to keep contributing to Supabase moving forward as I get more time in future.

Thanks for reading.