Story of an open source newbie + lessons learnt

This is a submission for the 2024 Hacktoberfest Writing challenge: Contributor Experience

Kudos to hackers around the world that participated in Hacktoberfest! You've made the code universe a better place with your contribution!

Introduction

I'm Charan, an open-source newbie (college student + software engineer intern at a startup) and this story is about how I navigated the world of open source software during Hacktoberfest 2024, and learnt a ton of things that I wish I'd learnt, a lot earlier.

tldr;

• Started contributing to one of my dusty old repos that served as a cool community website. (devsforfun.com)
• Created a cool little form for an entrepreneurship related community event at my college along with another community member. (repo)
• Helped one of my friends to make his first Hacktoberfest PR.
• (Kind of) Figured out a few things about contributing to popular open source repos and came up with a plan for what I'll do next to improve as an open source contributor.

p.s.: If you only want to learn about what I've learnt about open source contributions, scroll down to Chapter 4 below 👇.

---

Chapter 1: How I Started With Hacktoberfest

I've been a passive observer of the open source world for quite a while now. This year, I said to myself that I'd become an active contributor. But, my efforts to start serious open source contribution were hindered by a series of weird choices and commitments. It took me until October to clear them all out of my way and with Hacktoberfest coming around in the same month, I had a good feeling about this.

For the first half of Hacktoberfest, I was busy dealing with some college work, and some passive development of a Next.js web app for a friend. By October 15, I had practiced enough Next.js and Tailwind CSS, along with shadcn.

Then I started looking at projects like shadcn and bunch of other popular repos. I was immediately overwhelmed and I didn't really know how I should start contributing to these amazing (+ scary) repos.

I wanted to contribute to popular open source projects because they're challenging, would make me to learn new and useful tech (no, I didn't simply want them to be Next.js projects), and would add real credibility to my contributor profile that I can show-off to a future employer or when applying to the Google Summer of Code, next year. I didn't really understand the issues on these popular repositories at first glance (many, not even after multiple glances), and I felt like I needed to learn a lot of other things before I stepped in here.

But instead of giving up for good, I thought I'd start much simpler, working on projects that I understand very well. That's when I decided to revive a dusty old project of mine.

---

Chapter 2: Contributing To A Dusty Old Repo

Short backstory about the repo: It was for a website that I used for a 3-week long learn-to-code challenge. It had all the curriculum details, and a hall of fame page that proudly displayed the winners who successfully finished the challenge. You can visit it here: devsforfun.com/s1 (You'd be viewing the revamped version of the website now)

I have had plans to revive that program with different plans this time and I wanted to properly republish that site for a while but I never did it. So, that became my project for Hacktoberfest.

Here's what my PRs were about:

PR #1:

• Ported the project from React to NextJS
• Created a waitlist form (frontend + an API to send the data to my google form)
• Rewrote all the styles using Shadcn and TailwindCSS.
• Revamped the /s1 homepage with new images and improved responsiveness.

PR #2:

• Moved the finishers data into a SQL table I'm supabase.
• Setup Supabase client and wrote an API to get the finishers data from Supabase.
• Wrote the hall of fame page with a brand new look.

Here's what I learnt:

• Learnt how to use Supabase.
• Learnt how to author APIs to protect sensitive environment variables or data from getting exposed on the client side.
• Learnt how to properly use tailwind classes, conditionally.
• I could bring in a friend to help me finish this website!

And that's when I bought in one of my friends, Jitendra, to help me with porting the curriculum page from the React project to the Next.js project. He was new to Next.js and Tailwind CSS. So, I helped him a tiny adjustments and advice, as he wrote the code for that page. He did great job with it without much (almost none) of my involvement. That's when I felt like, "now, that must the spirit of open source."

---

Chapter 3: Yet Another Project

In the meantime, another project crashed in. I'm part of the organizing team of an entrepreneurship club at my college. There's going to be this important workshop that we'll be hosting. It required people to pay for registration. So, I proposed an idea of creating a custom form to handle all of that.

Soon after starting to work on it, my team found that we had absolutely no payment gateway API that is available, which doesn't require us to have a registered business entity. So a custom form really didn't make sense but we decided to do it anyway. Everyone was like, "custom form over Google form any day!"

Here's what my PRs were about:

PR #3:

• Wrote a registration form using react-hook-form, zod, and shadcn Form, that was accessible and had enough client-side validation.

PR #4:

• Wrote an API to get the data and send to the Google form so that the data can be comfortably viewed in a spreadsheet.

Here's what I learnt:

• Learnt how to use react-hook-form, zod, and shadcn components to build accessible forms, faster.

Once, I've built the fully-functional form, another organizer of my community made his first 2 Hacktoberfest PRs to the same project by adding more aesthetics and information to the form, and a confirmation page redirect.

And that's how my 4-PR quest went for the Hacktoberfest 2024.

---

Chapter 4: Realization And Next Steps (for me)

After I finished submitting 4 PRs, I went back to looking at the popular repos and this time, I wasn't intimidated by looking at all the issues. Nor was I able to magically start understanding them but, I could recognize the fact that I was not able to understand those issues because I haven't used the product myself. If I'd used them, I would have the relevant vocabulary in my head, and I will have faced some of those issues. And because I understand tech, I would've been able to contribute to the project like I'd imagined.

As a beginner, I somehow thought open source contributions were random bounties people would be able to collect simply, if they have worked with the relevant tech stack for long enough. Now, I realized that there's a "solving real problems that people face" aspect to "contributing".

So, I figured that the best next step would be to start using an open source project for my work, get acquainted to the product first, then look at the issues, and plan how to learn and contribute to the project. And I also found that I can find good open source projects through open source software hackathons like here on the DEV platform, to rapidly try popular and/or new open source projects and potentially find ways to contribute to those.

---

Do share your thoughts/feedback/suggestions/questions on this story, in the comments below 👇.

I'd really love to hear from you all!

And, how has your Hacktoberfest been? I'd love to hear (or read 😄) your story too!

Keep coding y'all!