What I Learned From Hacktoberfest so far
This is my first Hacktoberfest event to participate in as a code newbie. To be honest at first, when I had the about the event, I thought it was a month where hackers come together and hack their way into any server. In the end, those that hack into the most 'secure' servers win. (Don't laugh at me, I blame MR.Robot😂, in my defense, I didn't even know what HTML was, at that time.) But since last month I have engaged in a few open-source projects and to be honest, I have learned so much. At times I just look back at how little I knew and laugh, I was so nervous to even make my first Pull request. (Will it be good enough to be merged, do I know what I am doing 👀). The first try I ever did, It got rejected cause I forget to make a branch (I was so frustrated that I could forget something so simple 😒). But when I started to contribute to more projects, I made fewer errors, and a lot of my PRs(Pull Requests) got merged. I am now participating more and even rising issues to different projects that I participate in. Mostly the accessibility issues because I find most people build amazing projects but tend to forget the little things like contrast errors, not using labels in the inputs or having the same alt text in all images, etc. If you just started coding a few weeks ago and this is your first time contributing to an open-source project, I will show you step by step on how to do it. (basics common steps)
How to participate with basic HTML and CSS or JS skills
If you are a beginner in the coding world you might be nervous or scared this event will pass by without you participating. But the good news is, you don't have to be a hardcore developer to participate. I will show you, where you find beginner-friendly projects and engage with the open-source community.
1) Register for the event
One thing you should have before registering is creating a Github account (If you already have one, you are good to go). You will be able to sign in to your account and they will track your Pull request for this month. Plus there is a 14 days review window, so you can get your Pull request sorted during this time.
-
Click the
start hacking buttonand you will be directed to connect to your GitHub account.
Click the
sign in with Githubbutton
This will direct you to log in to your GitHub account and authorize it. Now you have successfully registered as a contributor to the event.
2) Find projects you can participate in
In the other years, you could participate in any Public GitHub project that was open source. But this year there are new rules (at least the few ones that were updated from 3rd October). For your Pull Request to count the project you want to be involved in must have a hacktoberfest topic in the repository. This just means they have accepted to participate in the event.
I made a PR on a hacktoberfest label issue but the repository didn't have the topic. So the PR was marked as ❗Ineligible Repository. If you find such projects you can raise an issue about it(ask the maintainer to add the hacktoberfest topic) or move on to valid projects.
PRs count if: Submitted in a repo with the hacktoberfest topic AND during the month of October AND ( The PR is merged OR The PR is labeled as hacktoberfest-accepted by a maintainer OR The PR has been approved )
Important : Check out the 2020 hacktoberfest updated rules
Where to find projects?
- Go to the Hacktoberfest website. The official website has everything you will need, from which projects you can participate in and the questions you what some clarification(FAQ).
- Go to your Github account and filter projects with the Hacktoberfest Topic
Yes, if the repository doesn't have the hacktoberfest topic your PR will be marked as
❗Ineligible Repository. Play it safe and follow the rules. But if you just want to contribute without partaking in the event you can contribute to any open-source repo.
- Create your own project. If you have Html, CSS, or even Javascript skills you can create your own project and ask your dev friends to participate. Yes, you can be a maintainer even if it's a small project. Then create issues like: make the navbar responsive, make the website have zero contrast errors on wave or post design with a zip folder to your assets and other devs can turn it to code. There are many possibilities. If you see other projects are too complex, create your own and in the process, you will help other beginners learn how to code. You can follow resources lists of the Hacktoberfest website and get to see how to be an effective maintainer💕
2) Steps to take to make your contribution
When you find the right project for you, remember to follow the PR etiquette.
Let's do any easy step to a beginner project, just to give you a visual guide on how to do this yourself. I love learning as I follow along. Hope you understand as you follow the steps with me.🙂
1) Fork the Github project
This is done by clicking the fork button on top of the page. This will create a copy of the repository in your own Github account.
2) Step two: Clone the project
Click on the clone button and then click on the copy to clipboard icon.
This will create a copy of the project files to your local environment.
Ps: You can create an 'open source' folder where you want to copy the project files.
Open your terminal or in my case 'cdmer' and run
git clone <URL>
## Let's get the URL for the contributions repo
git clone https://github.com/muchirijane/learning-code-through-github-repos
3) Run git status
Before you start coding run git status to make sure everything in the project files are updated with the 'origin/master/main branch'.
git status
4) Create a new branch
In this small open-source project for beginners, your task is to add Github repositories with resources and tools.
The branch will include your resource under the feature flag
git checkout -b feature/<add-your-resource-in-the-branch>
## In my situation the branch should be
git checkout -b feature/react-resource
5) Make your contribution
In this case, you are required to add your resource to the readme.md file. But you have to use the feature flag and compare it to the develop branch, not the main branch.
After that run git add, git commit and push your branch
git add .
## commit the changes
git commit -m "added awesome react resource GitHub repository to the readme file"
## Let's push our branch
git push origin <branch-name-you-created>
git push origin feature/react-resource develop
6) Compare and Pull request
Nope! you are not done yet, one more step.
To contribute your code to the origin repository.
Click Compare and pull request
7) Create a new pull request
In some projects, you will have to really go into detail because they are using a PR template. You got to check [x] the correct checkboxes depending on your pull request. Ensure your pull request has a hacktoberfest-accepted label(I don't know how crucial this step is but you can ask around). This action should be taken by the maintainer of the project. (Take a look at the updated rules)
That's it, congratulations you just made your first successful hacktoberfest pull request. I'm so proud of you!!!
In conclusion
Let me just say this, don't make pull requests just for the sake of making them or getting a T-shirt/platting a tree. Take this, a serious way to learn how to contribute and be part of the open-source community. Don't spam repos by deleting and adding the same code just for a commit. (I have seen messed up things on twitter 😒). Take your time to understand the project, go to the contribution.md file, and see the steps to take to contribute to the project. Ensure you make meaningful commits.
- Example of a bad commit I have seen going around twitter
For more details about Hacktoberfest follow the Dev series here on dev.to. You will get updates and things you need to know during the event. If you want to learn more about Git and Github for beginners, Check out my first post.
If you want to practice on how to make a pull request, I have a small open-source project about adding useful resources. Read the contribution.md file and make a pull request. I will merge it Asap.
You can also join the Hacktoberfest Discord channel for updates, help in your open-source project, or sharing your project for others to contribute.
Apart from that, I want to wish you a happy hacktoberfest, and thank you for your support. I truly appreciate it.
If you find this post useful share it with your peers or beginners who are learning how to contribute to open-source projects - Hacktoberfest event. They might find these guidelines useful in their journey. You can also buy me coffee. 🙂
Top comments (8)
This
❗Ineligible Repositorything is very depressing. Now I have to open an issue on each repository that I want to contribute to, and hope the maintainer agrees to add the repository label.Still, it's better than PR-ing my own repositories...
I had some too, Junxiao. But I raised an issue to the maintainer about it. Luckily he accepted to update his repository. ✨
The good thing is there is a lot of time until the event is done, we can change a few things here and there.
I'm a newbie in web development and this is so helpful.
Awesome, glad it helped in any way. You can also contribute to an open-source project I have included. It's a good way to start contributing :)
Thanks. Will look into it.
Happy Hacktoberfest! We invite you to contribute NocoDB.
NocoDB is an open source Airtable alternative.
NocoDB works by connecting to any relational database and transforming them into a smart spreadsheet interface! This allows you to build no-code applications collaboratively with teams. NocoDB currently works with MySQL, PostgreSQL, Microsoft SQL Server, SQLite, Amazon Aurora & MariaDB databases.
Also NocoDB's app store allows you to build business workflows on views with combination of Slack, Microsoft Teams, Discord, Twilio, Whatsapp, Email & any 3rd party APIs too. Plus NocoDB provides programmatic access to APIs so that you can build integrations with Zapier / Integromat and custom applications too.
🔥 🔥 The Open Source Airtable alternative - Powered by Vue.js 🚀 🚀
NocoDB
✨ The Open Source Airtable Alternative ✨
Turns any MySQL, PostgreSQL, SQL Server, SQLite & MariaDB into a smart-spreadsheet
Website • Discord • Twitter
Quick try
1-Click Deploy
Heroku
Using Docker
Using Npm
Using Git
GUI
Access Dashboard using : localhost:8080/dashboard
Join Our Community
Screenshots
Features
Rich Spreadsheet Interface
App
…Amazing Post. It was my first year as well, this post is incredibly explained, congratulations
Thank you so much, I appreciate it. Happy hacking!!