Hactoberfest is upon us and it may be hard to find a project to contribute to especially for beginners. I have created a project with React and Docusaurus and looking for new contributors. You can create a PR and get one step closer to finishing your Hactoberfest.
If you are new to Open Source, you can follow along with this guide and create your PR for the project.
You can find the Github link for the project.
How to create a Pull Request for A-Z Coding Resources
In this guide, we will learn how to make a pull request for A-Z Coding Resources. We will make the changes from the command line. But first, let’s make clear the difference between Git and Github.
Git is a version control software and Github is a collaboration platform that uses Git.
Now, we can start contributing to our project by installing Git on our computer.
1. Install Git
First, let's see if you have Git already installed on your computer. Type the command below in Terminal, PowerShell, or any terminal application. If you already have git installed, you can skip the next few steps.
If you don’t have git installed, go to https://git-scm.com/downloads.
Select your operating system and the installer will download.
Open the installer and follow the instructions. It should be fine to select all of the default options.
Restart your terminal, PowerShell, or Git Bash.
Run the
git --version
command again.
2. Configure Git
We want to configure our local environments so that the correct GitHub account is associated with our commits.
1.On GitHub, find your user name. You can find it by clicking your avatar in the upper right-hand corner. It will say "Signed in as"
2.Return to your command line or terminal. Replace hulyak
with your username.
git config --global user.name "hulyak"
3.Use the command below to configure your email address as well.
git config --global user.email "your-email-address"
4.You can use the two commands below to double-check that you've set this up.
git config user.name
git config user.email
3. Fork the Repository
Navigate to the GitHub repo and click Fork in the upper right-hand corner, this will open up a dialog where you can click on your username to fork the repository.
This will create a local copy under your GitHub username. You need to fork the repo into your account because Github doesn't allow pushing code to repositories that you don't own, then you can make all your changes to the copied repository.
4. Clone the Repo
To clone the repository, go to your forked copy of the GitHub repo, and select the green 'Clone or download' menu button, then click on the icon shown in the screenshot to copy the repository URL that you will need to use:
Go to your terminal and navigate to the directory where you want to clone the project.
cd desktop
Then, to clone the remote repository to your computer, execute the git clone command with the link that you just copied:
git clone <github-repo-link>
This will create a new folder with the remote GitHub repository name and download all the project files and repository data into it.
Cd into the folder that was just created.
cd a-to-z-coding-resources
You should this something similar to the screenshot.
5. Check out the Contributing guideline
Before we make any changes in the code, we need to check out the Contributing Guidelines.
If you check out the Readme page, it will redirect you to the CONTRIBUTING.md file. File name is CONTRIBUTING.md
.
Or, you can check out the Issues
tab, and decide how to contribute to the project.
Adding a New Resource
- Go to the
docs
folder and look at the resources. - All you need is to add a unique new resource to any of the markdown files. You only need to add one resource for the Pull Request.
- Go to the end of the page and add a new resource.
- Image of the resource is not necessary, if you want to add the image of the website, you can first load the image on Dev.to and paste the link from there.
- You can add a short description after the heading. For the heading use
###
for Heading level 3 and make sure it looks good.
If you need help writing markdown files, you can check out this website.
You can checkout this example:
### 1.[Reacti Flux](https://discord.com/invite/reactiflux)
Reacti Flux is the largest community of React developers (110,000+)!
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/at0opxihu02u0o2xvcq2.png)
Creating A New Resource Page and Adding New Resource
If you cannot find a new resource to add, you can just create a new page and a different category. It can be related to frontend, backend, cloud, blockchain, or mobile development. It can be whatever you want.
For that, create a new markdown file for a new category and add the resource there.
- create the file name as
<category>-<number>.md
and add the resource to the file. For example, you can the file asfree-websites-1.md
. Then, go to thesidebars.js
file in the root of the project and add the file name to the list.
module.exports = {
someSidebar: {
resources: [
'free-websites-1',
'free-media-3',
'react-5',
'css-2',
// 'markdown-features',
'javascript-4',
'nextjs-6',
'job-hunt-8',
'career-9',
'computer-science-7',
// add the new file name
],
},
}
- MDX file starts with YAML front matter block declared as triple-dashed lines. Declare the
title
property.
---
title: "Free Images/Videos"
---
- After the title, add your resource similar to this:
### 1.[Reacti Flux](https://discord.com/invite/reactiflux)
Reacti Flux is the largest community of React developers (110,000+)!
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/at0opxihu02u0o2xvcq2.png)
6. Pull the recent changes
Before you make any changes, it's good to check if there have been any changes from GitHub down to your local copy by using the command:
git pull
7. Make Your Changes
Make changes in any of the markdown files under the docs
folder.
8. Review Your Changes
Use the git diff
command to see the changes you’ve made. This will show your changes with the + sign. To quit the terminal, use the q key.
Run the project.
npm install
npm start
Make sure the page loads without any errors and you have added a new resource.
9. Stage, Commit and Push Your Changes
Next, you want to stage, commit, and push your changes to your fork. Staging means saving your changes so they are ready to be added to your branch.
git add .
git commit -m "type your commit message"
- m is a flag for the message. That means that whatever comes after -m is a message explaining your commit. Your commit message doesn't have any effect on your code; it's like a comment.
git push
git push
adds the changes on your computer to your GitHub repository.
10. Create a Pull Request
Navigate back to the original repo from which you forked, and you will see a prompt to open a new Pull Request from the branch you just pushed to.
Click Compare & pull request, add a description describing the changes you made.
Add a screenshot of the page with the added resource.
To submit your pull request, click the green 'Create pull request' button.
Well done, you have made your pull request! 🎉🎉🎉
11. Wait For Merge and Code Review
The owner of the repo can now review your changes and decide whether to approve and merge, request changes, or decline your pull request.
TIP: If you need to add more changes to this pull request, you don't need to create different pull requests. Just push your new changes to the same fork and it will automatically update the PR.
I hope you liked this guide on how to make a pull request for the project. If you would like to learn more about Open Source, you can check out these resources:
- How to Contribute to Open Source
- Contributing to Open Source for the first time video
- What is Free Software?
May the FOSS be with you!
Top comments (1)
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.
nocodb / nocodb
🔥 🔥 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
…