Blog
Git and GitHub Contributions Guide

How to contribute in open source projects github

Contributing to open source projects on GitHub is a fantastic way to learn, collaborate, and give back to the developer community. Here's a step-by-step guide to help you get started with your first contribution.

How to contribute in open source projects github

1️⃣ Understand the Basics of Git & GitHub

  • Git: A tool to track changes in your code.
    • Install Git on your computer.
    • Learn key commands:
      • git clone 🧲: Copy a project
      • git add ➕: Stage changes
      • git commit 💾: Save a snapshot
      • git push 🚀: Upload changes
      • git pull ⬇️: Get latest updates
      • git branch 🌿: Manage branches
      • git checkout 🔄: Switch branches
  • GitHub: A website to host code and collaborate.
    • Explore repositories, issues, pull requests, and forks.

2️⃣ Set Up Your GitHub Account

  • Sign up for a free account.
  • Personalize your profile (name, location, bio, photo) 🖼️.
  • Enable two-factor authentication for security 🔒.

3️⃣ Find a Project to Contribute To

  • Start with tools you use.
  • Look for “good first issue” or “beginner-friendly” labels:
    • Try sites like goodfirstissue.dev, firstcontributions.github.io, firsttimersonly.com.
    • Use GitHub’s own filters.
  • Read the CONTRIBUTING.md file for each project.
  • Browse topics like “open-source-project”.
  • Non-code help counts too!
    • Improve docs 📝, report bugs 🐞, test features 🧪, review code 🧐, or answer questions 💬.

4️⃣ The Fork & Pull Request Workflow

A. Fork the Repository

  • Click “Fork” on the project page to copy it to your account.

B. Clone Your Fork

  • Copy the URL from your fork.
  • Run:
git clone <copied-url>
  • Move into the folder:
cd <repository-name>

C. Create a New Branch

  • Make a new branch for your changes:
git checkout -b my-feature

D. Make Your Changes

  • Open the code in your editor and make improvements.

E. Test Your Changes

  • Run tests if available, or check your fixes work.

F. Commit Your Changes

  • Stage files:
git add .
  • Commit with a clear message:
git commit -m "Fix: typo in README"

G. Push to Your Fork

  • Push your branch:
git push origin my-feature

H. Create a Pull Request

  • Go to your fork on GitHub.
  • Click “Compare & pull request”.
  • Fill in the title and description. Reference issues if needed.
  • Add screenshots if it’s a UI change.
  • Click “Create pull request”!

5️⃣ Respond to Feedback & Iterate

  • Maintainers may request changes or ask questions.
  • Make edits locally, commit, and push again—the pull request updates automatically.
  • Once approved, your changes get merged! 🎉

🌟 Tips for Success

  • Start small (fix typos, update docs, minor bugs).
  • Always read the CONTRIBUTING.md file.
  • Be patient—maintainers are often volunteers.
  • Communicate politely and professionally.
  • Learn from every contribution.
  • Stay updated:
git remote add upstream <original-repo-url>
git checkout main
git pull upstream main
git checkout my-feature
git rebase main

Good luck and happy contributing! 🚀

Recommended Articles 📂🔥

Add Chart.js in HUGO 📈

HUGO

Add Chart.js in HUGO 📈

Add Charts in HUGO with chart.js 🧑‍💻

Add Diagram in HUGO 🖼️ with Plotly.js

HUGO

Add Diagram in HUGO 🖼️ with Plotly.js

Add Google Analytics in HUGO 🌟

HUGO

Add Google Analytics in HUGO 🌟

how to add google analytics in hugo To add Google Analytics to your Hugo site, follow these clear steps: 1. Create a Google Analytics Account and Get Your Measurement ID Go to Google Analytics and sign in or create an account. Set up a new property for your website and note your Measurement ID (e.g., G-XXXXXXXXXX for GA4 or UA-XXXXXXXX-X for Universal Analytics)12. 2. Configure Your Hugo Site A. Add Your Measurement ID to config.toml Open your site’s config.toml file and add this line at the top level (replace with your actual ID):

Build Formula Calculator in HUGO 🧮

HUGO

Build Formula Calculator in HUGO 🧮

Build Modular Composable Calculator in HUGO 🧮

HUGO

Build Modular Composable Calculator in HUGO 🧮

Embed PDF in HUGO 📄

HUGO

Embed PDF in HUGO 📄

Monetize Your Hugo Site with Google AdSense 💰

HUGO

Monetize Your Hugo Site with Google AdSense 💰

integrate google adsence in hugo with ads customization To integrate Google AdSense into your Hugo website with ad customization, follow these clear steps. This process works for most Hugo themes (including PaperMod, Blowfish, Academic, and others) and allows you to control where and how ads appear. 1. Prerequisites Google AdSense account (sign up at Google AdSense) Hugo-based website (already set up and deployed) 2. Add Your Website to Google AdSense Sign in to Google AdSense. Go to Sites > Add Site. Enter your website URL and save. Copy the AdSense code snippet provided (it looks like a <script> tag). 3. Insert AdSense Code into Hugo A. For Site-Wide (Auto Ads) Integration Create a Partial for AdSense Script: Create a file named adsense.html in layouts/partials/google/ (create folders if they don’t exist). Paste the AdSense Script: Add the code snippet provided by AdSense: <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=YOUR-ADSENSE-CLIENT-ID" crossorigin="anonymous"></script> - Replace `YOUR-ADSENSE-CLIENT-ID` with your actual AdSense client ID. Include the Partial in Your Site’s <head>: For many themes (like PaperMod, Blowfish, Academic), create or edit layouts/partials/extend_head.html or your theme’s equivalent head partial. Add: {{ partial "google/adsense.html" . }} - This ensures the AdSense script loads on every page. B. For Custom Ad Placement (Manual Ads) Create Ad Units in AdSense: In AdSense, go to Ads > By ad unit. Create and configure a new ad unit (e.g., Display ad, In-article ad). Copy the HTML code provided for the ad unit. Insert Ad Code Where You Want Ads to Appear: For example, to show an ad in your post content, create a partial such as layouts/partials/ads-in-article.html and paste the ad unit code there. In your content template (e.g., layouts/_default/single.html), add: {{ partial "ads-in-article.html" . }} - Place this line where you want the ad to appear (top, middle, bottom, etc.). 4. Upload ads.txt for AdSense Verification Download the ads.txt file from AdSense (after approval). Place it in your Hugo site’s /static directory. When deployed, it will be available at https://yourdomain.com/ads.txt123. 5. Customize Ad Display and Types In your AdSense dashboard, use the Ads tab to: Enable/disable Auto ads. Control ad formats (e.g., in-page, anchor, vignette). Preview and adjust ad placements with the visual editor. For manual ads, you can add different ad units to different partials or templates for fine-grained control. 6. Deploy and Request Review Deploy your Hugo site as usual. In AdSense, request a review if prompted. Once approved, ads will begin to appear. 7. Summary Table Step Action 1. AdSense Account Sign up and add your site 2. Get Script Copy AdSense script or ad unit code 3. Hugo Integration Place script in partial (adsense.html), include in head or content templates 4. ads.txt Place in /static directory 5. Customize Ads Use AdSense dashboard for settings, or place manual units as desired 6. Deploy & Review Deploy site, request review, and monitor ad performance 8. Tips for Best Results Test locally and in production to ensure ads display correctly. Use partials for modular, reusable ad placement. Avoid too many ads to maintain a good user experience. Comply with AdSense policies to avoid account issues. References: