Git vs GitHub - अंतर समझें
पहले मूलभूत अवधारणाएँ सीखें
| विशेषता | Git | GitHub |
|---|---|---|
| क्या है? | Version Control System (सॉफ्टवेयर) | Hosting Service (वेबसाइट/प्लेटफॉर्म) |
| काम कहाँ होता है? | आपके कंप्यूटर पर (Local) | इंटरनेट पर (Cloud) |
| उदाहरण | MS Word Track Changes | Google Drive |
रीयल-लाइफ उदाहरण:
Git = अपने लैपटॉप में फोटो एडिट करना (Photoshop)
GitHub = उस फोटो को Instagram पर शेयर करना
आप पहले लोकल में काम करते हैं (Git), फिर दुनिया को दिखाते हैं (GitHub)!
⚙️ Git इंस्टॉल करें
Windows:
# 1. https://git-scm.com/download/win से डाउनलोड करें
# 2. इंस्टॉलर खोलें, सभी डिफॉल्ट सेटिंग्स रखें
# 3. VS Code में Terminal खोलें (Ctrl + `)
# 4. वेरिफाई करें:
git --version
# Output: git version 2.43.0
Mac:
# Homebrew से इंस्टॉल करें:
brew install git
# या Xcode Command Line Tools:
xcode-select --install
Linux (Ubuntu/Debian):
sudo apt update
sudo apt install git
अपनी पहली Repository बनाएँ
खाली रेपो से शुरुआत करें
GitHub पर New Repository बनाएँ
-
✓
Repository name:
my-awesome-project - ✓ Description: "मेरा पहला Git प्रोजेक्ट"
- ⚠️ बेहद ज़रूरी: "Initialize with README" ❌ अनचेक रखें!
Clone करें (डाउनलोड करें)
# Desktop पर जाएँ
cd Desktop
# Repository clone करें (अपना URL डालें)
git clone https://github.com/username/my-awesome-project.git
# नई फोल्डर में जाएँ
cd my-awesome-project
# वेरिफाई करें
ls -la # Windows: dir
warning: You appear to have cloned an empty repository.
✓ यह सही है! हमने जानबूझकर खाली रेपो बनाई है।
पहली फाइल जोड़ें
# README.md फाइल बनाएँ
echo "# My Awesome Project" > README.md
# या VS Code में बनाएँ:
code README.md
Git Workflow - 3 स्टेप्स
फाइलों को स्टेजिंग एरिया में डालें
स्थायी रूप से सेव करें
GitHub पर अपलोड करें
# सभी फाइलों को stage करें
git add .
# Commit करें (अच्छा message लिखें)
git commit -m "Initial commit: Added README"
# GitHub पर push करें
git push -u origin main
# अगली बार से सिर्फ:
git push
डेली वर्कफ्लो - हर दिन यही करें
टीम के साथ काम करने का तरीका
🌅 सुबह का रुटीन (काम शुरू करने से पहले)
# 1. नवीनतम बदलाव लाएँ
git pull origin main
# 2. स्टेटस देखें
git status
# 3. किस ब्रांच पर हैं देखें
git branch
⚡ काम करते समय (हर 30-60 मिनट में)
# बार-बार commit करते रहें (छोटे-छोटे commits)
git add -A
git commit -m "feat: login page ka UI improve kiya"
# शाम को push करें
git push
✅ अच्छे Commit Messages के उदाहरण:
- "feat: user authentication add kiya"
- "fix: login button ka color change kiya"
- "docs: README mein installation steps add kiye"
- "refactor: header component ko simplify kiya"
🌆 शाम का रुटीन (काम खत्म करने से पहले)
# 1. क्या बदलाव हुए देखें
git status
# 2. अगर कुछ बचा है तो commit करें
git add .
git commit -m "WIP: kal continue karenge"
# 3. सब कुछ push करें
git push
# 4. लॉग देखें
git log --oneline -5
🎬 रीयल-लाइफ सिनेरियो:
स्थिति: आप एक E-commerce वेबसाइट बना रहे हैं।
सुबह: git pull से टीम के बदलाव लाएँ
दोपहर: Shopping cart का कोड लिखा, commit किया "feat: cart functionality added"
शाम: सारे commits push कर दिए
फायदा: अगर कल कुछ गड़बड़ हो तो पता चलेगा कि कब क्या बदला था!
Branching - सुरक्षित तरीके से काम करें
मुख्य कोड को बिना छुए नए फीचर्स बनाएँ
🌳 Branch क्या है? (Tree Analogy)
Main Branch ( trunk/tana ): स्थिर, काम करने वाला कोड
Feature Branch ( shakha/tahni ): नए एक्सपेरिमेंट के लिए
Merge ( jodna ): सब कुछ सही रहा तो main में जोड़ दें
🚀 Branch कमांड्स
नई Branch बनाएँ
# checkout -b = नई branch बनाएँ और उस पर जाएँ
git checkout -b feature-login-page
# या नया syntax:
git switch -c feature-login-page
Branch के बीच Switch करें
# सभी branches देखें
git branch -a
# दूसरी branch पर जाएँ
git checkout main
# या
git switch main
📝 Complete Branch Workflow
# 1. Main branch update करें
git checkout main
git pull origin main
# 2. नई feature branch बनाएँ
git checkout -b feature-payment-gateway
# 3. काम करें, फाइलें बदलें...
# 4. Changes commit करें
git add .
git commit -m "feat: payment gateway integration"
# 5. Branch को GitHub पर push करें
git push -u origin feature-payment-gateway
# 6. Pull Request बनाएँ GitHub पर
# 7. Review होने के बाद merge करें
🏷️ Branch Naming Best Practices
✅ सही नाम:
- feature/user-authentication
- bugfix/login-error
- hotfix/payment-failure
- docs/api-documentation
❌ गलत नाम:
- xyz
- temp-branch
- fix-something
- my-work
Merging & Conflict Resolution
जब दो लोग एक ही फाइल बदल दें
✅ Fast-Forward Merge
जब main branch में कोई बदलाव न हो
git checkout main
git merge feature-branch
# आसानी से merge हो गया!
⚠️ 3-Way Merge
जब main और feature दोनों में बदलाव हों
git checkout main
git merge feature-branch
# शायद conflict आए...
🔥 Conflict Resolve कैसे करें
1. Conflict देखें:
git status
# लाल रंग में conflict वाली files दिखेंगी
2. फाइल खोलें, यह देखेंगे:
<<<<<<< HEAD
// आपका code (main branch)
console.log("Hello from main");
=======
// दूसरे का code (feature branch)
console.log("Hello from feature");
>>>>>>> feature-branch
3. हल करें (Markers हटाएँ):
// दोनों में से चुनें या merge करें
console.log("Hello from both branches!");
4. Resolve mark करें:
git add conflict-file.js
git commit -m "resolved merge conflict in login page"
🛠️ VS Code में Conflict Solve करना (आसान तरीका)
Accept Current
आपका बदलाव रखें
Accept Incoming
दूसरे का बदलाव रखें
Accept Both
दोनों रखें
🎬 Conflict Example:
स्थिति: आपने style.css में button का color blue किया,
और आपके teammate ने same file में button का color green किया।
Solution: Team lead से पूछें कि कौन सा color रखना है,
या compromise करके नया color चुनें!
.gitignore - Secret Files छिपाएँ
Password और API Keys को GitHub से दूर रखें
⚠️ कभी GitHub पर न डालें:
- • Passwords / API Keys
- • .env files
- • node_modules (बहुत बड़ी folder)
- • Database files
- • OS files (.DS_Store, Thumbs.db)
📝 .gitignore Example (React/Node Project)
# Dependencies
node_modules/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Production build
/build
/dist
# Environment variables
.env
.env.local
.env.development
.env.production
# IDE
.vscode/
.idea/
*.swp
*.swo
# OS files
.DS_Store
Thumbs.db
# Logs
logs
*.log
# Testing
coverage/
.nyc_output/
# Temporary files
*.tmp
*.temp
✅ .gitignore setup:
# .gitignore फाइल बनाएँ
echo "node_modules/" > .gitignore
# या VS Code में .gitignore नाम से फाइल बनाएँ
# फिर ऊपर वाला content paste करें
git add .gitignore
git commit -m "added gitignore"
git push
Pull Requests - Team Review
कोड review करने का पेशेवर तरीका
Branch Push करें
अपनी feature branch को GitHub पर push करें
git push -u origin feature-xyz
PR बनाएँ
GitHub पर "Compare & Pull Request" बटन दबाएँ
Review & Merge
Team review करे, फिर main में merge करें
📝 अच्छा PR Description लिखें:
## क्या बदला? - Login page का UI नया डिज़ाइन - Password validation add किया ## क्यों बदला? - पुराना UI outdated था - Security improve करनी थी ## Testing: - [x] Local पर test किया - [x] Mobile responsive check किया - [ ] Unit tests लिखने हैं ## Screenshots: [यहाँ screenshot डालें]
Pro Tips & Advanced Commands
एक्सपर्ट बनने के लिए ये सीखें
# Last commit undo करें (preserve changes)
git reset --soft HEAD~1
# Last commit पूरी तरह delete करें
git reset --hard HEAD~1
# Specific file को undo करें
git checkout -- filename.js
# Staged changes को unstaged करें
git reset HEAD filename.js
जब आप काम कर रहे हों और अचानक किसी और branch पर जाना हो:
# Current changes को stash करें
git stash push -m "half done login work"
# दूसरी branch पर जाएँ
git checkout main
# वापस आएँ और stash लगाएँ
git checkout feature-login
git stash pop
# सभी stash देखें
git stash list
# किसी दूसरी branch का commit लाएँ
git checkout main
# Commit hash copy करें (git log से)
git cherry-pick abc1234
# अगर conflict आए तो resolve करें
git add .
git cherry-pick --continue
Rebase = इतिहास साफ़ करना (Caution: Shared branches पर न करें)
# Feature branch को main के ऊपर rebase करें
git checkout feature-branch
git rebase main
# Interactive rebase (commits को edit/delete/reorder करें)
git rebase -i HEAD~3
⚡ Useful Git Aliases (Shortcuts)
# Setup करें
git config --global alias.st status
git config --global alias.co checkout
git config --global alias.br branch
git config --global alias.ci commit
git config --global alias.lg "log --oneline --graph --decorate"
# Use करें
git st # = git status
git co main # = git checkout main
git lg # Beautiful log graph
Complete Cheat Sheet
सभी ज़रूरी कमांड्स एक जगह
🚀 Basic Commands
git init
नई repo शुरू करें
git clone [url]
Repo download करें
git status
Status देखें
git add .
सभी files stage करें
git commit -m "msg"
Changes save करें
git push
GitHub पर भेजें
git pull
नवीनतम changes लाएँ
🌿 Branch Commands
git branch
Branches देखें
git checkout -b [name]
नई branch बनाएँ
git checkout [name]
Branch switch करें
git merge [name]
Branch merge करें
git branch -d [name]
Branch delete करें
📜 History & Undo
git log --oneline
Commit history
git log --graph
Graph view
git reset --soft HEAD~1
Undo last commit
git revert [commit]
Safe undo
🧰 Stash & Utils
git stash
Temporary save
git stash pop
Stash apply करें
git diff
Changes देखें
git remote -v
Remote URLs
⚡ 5-Second Memory Hook
More Code Examples With Explanation
असली काम में बार-बार आने वाले workflows
1. Git की पहली सेटिंग
पहली बार Git install करने के बाद अपना नाम और email set करें। यही commit history में दिखता है।
# अपना नाम और email set करें
git config --global user.name "Aman Sharma"
git config --global user.email "aman@example.com"
# check करें कि setting सही save हुई या नहीं
git config --global --list
2. Existing Project को GitHub से जोड़ना
अगर project पहले से laptop में है और GitHub पर नई empty repo बनाई है, तो यह तरीका use करें।
# project folder में जाएँ
cd my-old-project
# Git start करें
git init
# remote GitHub repo connect करें
git remote add origin https://github.com/username/my-old-project.git
# first upload
git add .
git commit -m "initial upload from local project"
git branch -M main
git push -u origin main
remote add origin आपके local project को GitHub repo address देता है।
3. सिर्फ एक file stage करना
जब बहुत files बदली हों लेकिन commit में सिर्फ एक logical change डालना हो।
# देखें कौन-कौन सी files बदली हैं
git status
# सिर्फ login file stage करें
git add src/pages/Login.jsx
# changes preview करें
git diff --staged
# फिर commit करें
git commit -m "fix: login validation message improved"
4. Deleted file वापस लाना
गलती से file delete हो जाए और commit नहीं किया है, तो Git से restore करें।
# कौन सी file deleted है देखें
git status
# एक file वापस लाएँ
git restore src/components/Header.jsx
# सारी uncommitted changes वापस करना हो
git restore .
git restore . current uncommitted work हटा सकता है, इसलिए पहले git status पढ़ें।
5. Remote बदलना या check करना
कभी-कभी repo गलत GitHub URL से जुड़ जाती है। तब remote URL update करें।
# current remote देखें
git remote -v
# remote URL बदलें
git remote set-url origin https://github.com/username/correct-repo.git
# check करें
git remote -v
# test push
git push
6. Safe Undo: revert
Team project में old commit हटाने के बजाय revert करें। यह नया undo commit बनाता है।
git log --oneline
# मान लो गलत commit hash है a1b2c3d
git revert a1b2c3d
git push
7. Release Tag बनाना
जब project version 1.0 ready हो, tag बनाकर release mark करें।
git tag v1.0.0
git push origin v1.0.0
# सभी tags देखें
git tag
8. GitHub Pages Deploy
Static HTML/CSS/JS website को GitHub Pages पर free host करें।
# files push करें
git add .
git commit -m "deploy static website"
git push
# GitHub > Settings > Pages
# Source: Deploy from branch
# Branch: main, folder: root
Real-life Advice: कौन सा command कब use करें?
pull, add, commit, push। Branch तब बनाएं जब नया बड़ा feature हो।git diff और push से पहले git status देखने की आदत बनाएं।Common Errors & Solutions
सबसे आम गलतियाँ और उनका इलाज
fatal: not a git repository
कारण: आप गलत folder में हैं
Solution:
# सही folder में जाएँ जहाँ .git folder है
cd my-project
pwd # present working directory देखें
ls -la # .git folder दिखना चाहिए
Permission denied (publickey)
कारण: SSH key setup नहीं है
Solution: HTTPS URL use करें या SSH key बनाएँ
# HTTPS use करें (आसान):
git clone https://github.com/username/repo.git
# या SSH key बनाएँ:
ssh-keygen -t ed25519 -C "your@email.com"
cat ~/.ssh/id_ed25519.pub
# इसे GitHub > Settings > SSH Keys में डालें
failed to push some refs
कारण: Remote पर नए changes हैं जो आपके पास नहीं
Solution:
# पहले pull करें
git pull origin main
# अगर conflict आए तो resolve करें
# फिर push करें
git push
The following untracked working tree files would be overwritten
Solution:
# Stash करके बचाएँ
git stash
git pull
git stash pop
# या force करें (सावधान!)
git reset --hard HEAD
git pull
Real-Life Project Examples
वास्तविक परिदृश्य में Git का उपयोग
🌐 Example 1: Website Development Team
टीम: 3 Developers (You, Rahul, Priya)
Project: E-commerce Website
📝 दिन का क्रम:
- सुबह:
git pull origin main- Priya की रात की changes लाएँ - नई branch:
git checkout -b feature-product-page - काम किया, 3 commits बनाए
- Push:
git push -u origin feature-product-page - GitHub पर Pull Request बनाया
- Rahul ने review किया, comment किया
- Changes किए, फिर merge हो गया
📱 Example 2: Mobile App Development
स्थिति: आप अकेले काम कर रहे हैं, लेकिन 2 devices (Laptop + Desktop)
🔄 Workflow:
# Laptop पर:
git add .
git commit -m "added login screen"
git push
# Desktop पर switch करें:
git pull
# सारा काम यहाँ आ गया!
# Desktop पर काम किया:
git add .
git commit -m "added signup screen"
git push
# वापस Laptop पर:
git pull
GitHub = आपका Google Drive, बस code के लिए!
🔥 Example 3: Bug Fix Emergency
स्थिति: Live website पर bug आया, तुरंत fix करना है
⚡ Emergency Workflow:
# जो भी कर रहे थे, stash करें
git stash
# Main branch पर जाएँ
git checkout main
git pull
# Hotfix branch बनाएँ
git checkout -b hotfix-payment-bug
# Bug fix करें, commit करें
git add .
git commit -m "hotfix: payment gateway timeout issue"
# Push और PR बनाएँ (fast review)
git push -u origin hotfix-payment-bug
# Merge के बाद वापस अपने काम पर
git checkout feature-branch
git stash pop
🏆 Professional Best Practices
-
✓
हर दिन सुबह
git pullकरें - ✓ Main branch पर सीधे कभी commit न करें
- ✓ Meaningful commit messages लिखें
- ✓ छोटे-छोटे commits करें (बड़े commits नहीं)
- ✓ .gitignore में sensitive files डालें
-
✓
Push से पहले
git statusज़रूर देखें
Bug Fix Lab: Real Problems, Real Solutions
जब Git, GitHub या browser copy feature काम न करे
1. Copy button क्यों fail हो सकता है?
कुछ browsers clipboard को सिर्फ HTTPS या localhost पर allow करते हैं। इसलिए इस page में 3-layer copy system add किया गया है:
navigator.clipboard# अगर यह text copy हो जाए तो button ठीक है
echo "Copy button is working"
# अगर browser prompt आए तो भी problem नहीं है
# Prompt में Ctrl+C दबाकर manual copy करें
2. GitHub password काम नहीं कर रहा?
GitHub normal password से Git push/pull नहीं करने देता। HTTPS में Personal Access Token use करें।
# Username वही रहेगा
# Password की जगह GitHub Personal Access Token paste करें
git push origin main
# अगर wrong credentials save हैं तो Windows में:
# Control Panel > Credential Manager > GitHub remove करें
3. Line ending warning: CRLF / LF
Windows में यह warning common है। डरने की जरूरत नहीं, बस team के हिसाब से config set करें।
# Windows users
git config --global core.autocrlf true
# Mac/Linux users
git config --global core.autocrlf input
# check
git config --global core.autocrlf
4. बड़ी file accidentally add हो गई?
Video, zip, database dump जैसी बड़ी files GitHub पर push न करें। पहले stage से हटाएँ।
# stage से file हटाएँ, local file नहीं हटेगी
git restore --staged assets/demo-video.mp4
# .gitignore में add करें
echo "*.mp4" >> .gitignore
echo "*.zip" >> .gitignore
# अब .gitignore commit करें
git add .gitignore
git commit -m "chore: ignore large binary files"
5. Folder/file rename Git detect नहीं कर रहा?
Windows में case-only rename problem आ सकती है, जैसे header.jsx से Header.jsx।
# safe rename technique
git mv src/header.jsx src/temp-header.jsx
git mv src/temp-header.jsx src/Header.jsx
git commit -m "fix: rename Header component casing"
6. Debug checklist: Push से पहले यह 5 commands चलाएँ
जब भी कुछ strange लगे, यह checklist problem पकड़ने में मदद करती है।
git status
git branch
git remote -v
git log --oneline -5
git diff --staged
Production Level Git Toolkit
Real company workflow, release, review और safety checklist
Production Ready Checklist
Release Workflow: v1.0 Launch
जब app production में release करनी हो, release branch और tag workflow follow करें।
git checkout main && git pull origin main && git checkout -b release/v1.0.0 && git push -u origin release/v1.0.0
PR merge होने के बाद tag बनाएं: git tag v1.0.0 और git push origin v1.0.0
Hotfix Workflow: Production Bug
Live bug में panic नहीं, main से hotfix branch बनाकर PR करें।
git checkout main && git pull origin main && git checkout -b hotfix/login-crash && git add . && git commit -m "hotfix: prevent login crash" && git push -u origin hotfix/login-crash
Interactive Command Builder
अपना task चुनें और ready-to-copy command बनाएं। यह beginners के लिए safe shortcut है।
git checkout -b feature/login-page
Commit Quality Formula
type(scope): short reason format use करें।
feat(auth): add login pagefix(cart): handle empty pricedocs(readme): add setup stepsrefactor(ui): simplify headerPR Review Checklist
- Code readable और simple है?
- Duplicate logic तो नहीं?
- Error handling मौजूद है?
- Mobile responsive check हुआ?
- Security issue तो नहीं?
Rollback Plan
Production deploy के बाद bug मिले तो revert use करें।
git log --oneline && git revert [bad-commit-hash] && git push origin main
Glossary + Interview Prep
Git को confidently explain करने के लिए quick revision
Project की tracked history वाली folder या GitHub storage.
Code का saved snapshot, message और author के साथ.
Main code से अलग safe working line.
एक branch के changes दूसरी branch में जोड़ना.
GitHub जैसी online repo location.
Review request कि मेरी branch main में merge करें.
Interview Q&A
Git और GitHub में difference?
Git local version control tool है, GitHub online hosting और collaboration platform है।
Merge conflict क्या होता है?
जब दो branches same file की same lines अलग-अलग बदलती हैं और Git decide नहीं कर पाता।
Rebase और merge में difference?
Merge history preserve करता है, rebase commits को नई base पर replay करके history linear बनाता है।
git pull क्या करता है?
Remote से latest changes fetch करता है और current branch में integrate करता है।
Mistakes To Avoid
- Force push on main: team history बिगड़ सकती है।
- Secrets commit: API keys leak हो सकती हैं।
- Huge commits: review और rollback मुश्किल होता है।
- No pull before work: conflicts बढ़ सकते हैं।
- Wrong branch work: हमेशा
git branchcheck करें।
Production Repository Format
Developer info, repo link और deploy-ready file structure
Developer Details
Developer Name: Your Name
Repository: https://github.com/your-username/git-github-hindi-masterclass
Version: 2026 Latest Production Edition
License: MIT
Your Name और GitHub URL को अपनी real details से update करें।Deployment Notes
- GitHub Pages पर root folder से deploy करें।
- PWA files:
manifest.jsonऔरsw.jsincluded हैं। - Privacy page tracking/cookies-free policy बताता है।
- Offline support cache-first service worker से मिलता है।
/
├── index.html # Main entry point
├── styles.css # All styles (glassmorphism, dark/light, responsive)
├── script.js # All vanilla JavaScript logic
├── manifest.json # PWA manifest (standalone, theme colors, icons data URI)
├── sw.js # Service worker (cache-first, offline support)
├── privacy.html # Privacy policy (no tracking, no cookies, local processing)
├── robots.txt # User-agent: * Allow: /
├── sitemap.xml # Sitemap listing index.html, privacy.html
├── README.md # Documentation (setup, deployment, library download instructions)
├── .gitignore # Ignore node_modules, .DS_Store, etc. (if any)
├── LICENSE # MIT or your chosen open-source license (optional)
├── data.json # Optional - for JSON-driven apps (catalog, settings)
└── lib/ # Self-hosted libraries (download via instructions in README)
└── .gitkeep # Keeps empty lib folder in Git
Setup Commands
git init
git add .
git commit -m "production: complete GitHub Hindi guide"
git branch -M main
git remote add origin https://github.com/your-username/git-github-hindi-masterclass.git
git push -u origin main
GitHub Pages
Repo Settings → Pages → Deploy from branch → main → /root. कुछ मिनट बाद site live हो जाएगी।
Latest Status
Responsive layout, dark mode, copy fallback, PWA files, privacy page, robots और sitemap अब included हैं।
Developer Contact & Community
Connect करें, सवाल पूछें, और community से जुड़ें
Live chat, Q&A, और doubt sessions
Join Discord →Updates, tips और announcements
Join Telegram →Feature requests और help
Start Discussion →📝 Feedback / Contact Form
Video Tutorials
Visual learners के लिए curated videos
Git Complete Course Hindi
CodeWithHarry • 4+ hours
Git & GitHub Crash Course
freeCodeCamp • 1 hour
Git for Professionals Tutorial
Tech With Tim • 2 hours
Completion Certificate
पूरा course करने के बाद certificate download करें
Get Your Certificate
अपना नाम डालें और certificate generate करें। इसे download करके share करें!
♿ Accessibility & Keyboard Shortcuts
Keyboard Navigation
- Tab - Next element पर जाएँ
- Shift+Tab - Previous element
- Ctrl+K - Search खोलें
- Enter - Button/Link activate करें
- Escape - Modal close करें
Accessibility Features
- ✓ Skip to main content link
- ✓ ARIA labels for screen readers
- ✓ High contrast mode support
- ✓ Reduced motion support
- ✓ Focus visible indicators