From 221c1a01bc0f05091f73e3c7a7a56edf21a996fe Mon Sep 17 00:00:00 2001 From: Karushna <115612833+Karushna@users.noreply.github.com> Date: Sat, 16 May 2026 10:08:18 +0530 Subject: [PATCH] feat: Add Git configuration modules for ITP welcome - Configuring Git with VSCode - Creating a Commit - Remote Repositories - Pushing & Pulling Closes #1850 --- .../backlog/configuring-git-vscode/index.md | 114 +++++++++++ .../backlog/creating-a-commit/index.md | 187 ++++++++++++++++++ org-cyf/content/itp/welcome/backlog/index.md | 14 +- .../backlog/pushing-and-pulling/index.md | 186 +++++++++++++++++ .../backlog/remote-repositories/index.md | 135 +++++++++++++ 5 files changed, 635 insertions(+), 1 deletion(-) create mode 100644 org-cyf/content/itp/welcome/backlog/configuring-git-vscode/index.md create mode 100644 org-cyf/content/itp/welcome/backlog/creating-a-commit/index.md create mode 100644 org-cyf/content/itp/welcome/backlog/pushing-and-pulling/index.md create mode 100644 org-cyf/content/itp/welcome/backlog/remote-repositories/index.md diff --git a/org-cyf/content/itp/welcome/backlog/configuring-git-vscode/index.md b/org-cyf/content/itp/welcome/backlog/configuring-git-vscode/index.md new file mode 100644 index 000000000..d45e7b446 --- /dev/null +++ b/org-cyf/content/itp/welcome/backlog/configuring-git-vscode/index.md @@ -0,0 +1,114 @@ ++++ +title = "Configuring Git with VSCode" +time = 20 +[tasks] +1 = "Install Git on your machine" +2 = "Configure Git with your name and email" +3 = "Set VSCode as your default Git editor" +4 = "Test your Git configuration" +[build] + render = 'never' + list = 'local' + publishResources = false ++++ + +Git is a version control system that helps developers track changes to their code. Before you can use Git effectively, you need to configure it on your machine and connect it with VSCode, your code editor. + +## What is Git? + +Git allows you to: +- Track every change you make to your files +- Work collaboratively with other developers +- Save different versions of your project +- Revert to previous versions if something goes wrong + +## Step 1: Install Git + +### On Windows +1. Go to [https://git-scm.com/download/win](https://git-scm.com/download/win) +2. Download the installer and run it +3. Follow the installation wizard (most default options are fine) +4. Open a terminal (or Git Bash) and type: `git --version` to verify installation + +### On Mac +1. Go to [https://git-scm.com/download/mac](https://git-scm.com/download/mac) +2. Download and install the package +3. Open Terminal and type: `git --version` to verify installation + +### On Linux +Open your terminal and run: +``` +sudo apt-get install git +``` +Then verify: `git --version` + +{{}} +A terminal (also called command line or console) is a text-based interface where you type commands to control your computer. Think of it as giving your computer instructions in its native language. +{{}} + +## Step 2: Configure Git with Your Name and Email + +Git needs to know who you are. Open your terminal and type these commands (replace the values with your own): + +``` +git config --global user.name "Your Full Name" +git config --global user.email "your.email@example.com" +``` + +**Why is this important?** Every commit (version save) will be labeled with your name and email, so others can see who made changes. + +{{}} +1. Open your terminal/command prompt +2. Type the commands above with YOUR name and email +3. After each command, press Enter +4. Verify it worked by typing: `git config --list` +5. You should see your name and email in the output +{{}} + +## Step 3: Set VSCode as Your Default Git Editor + +When you make a commit, Git might open a text editor to let you write a detailed message. Let's tell Git to use VSCode: + +``` +git config --global core.editor "code --wait" +``` + +This tells Git: "When I need an editor, use VSCode and wait for me to save and close it before continuing." + +## Step 4: Verify Your Configuration + +Run this command to see all your Git settings: + +``` +git config --list +``` + +You should see: +- `user.name=Your Full Name` +- `user.email=your.email@example.com` +- `core.editor=code --wait` + +{{}} +If the configuration doesn't appear, or if you see errors, don't worry. The most important settings are `user.name` and `user.email`. You can always reconfigure later. + +**Can't open terminal?** +- Windows: Right-click in a folder and select "Open in Terminal" or press `Win + R`, type `cmd` +- Mac: Press `Cmd + Space`, type "Terminal" +- Linux: Right-click desktop and select "Open Terminal Here" +{{}} + +## What's Next? + +Now that Git knows who you are, you're ready to: +1. Create a local repository +2. Make commits (save versions of your work) +3. Push your code to GitHub + +You'll learn these skills in the next modules! + +## Further Reading + +- [Git Official Documentation](https://git-scm.com/doc) +- [Atlassian Git Tutorial - Getting Started](https://www.atlassian.com/git/tutorials/setting-up-a-repository) +- [GitHub's Git Guides](https://github.github.io/training-kit/) +``` \ No newline at end of file diff --git a/org-cyf/content/itp/welcome/backlog/creating-a-commit/index.md b/org-cyf/content/itp/welcome/backlog/creating-a-commit/index.md new file mode 100644 index 000000000..a79ac9802 --- /dev/null +++ b/org-cyf/content/itp/welcome/backlog/creating-a-commit/index.md @@ -0,0 +1,187 @@ ++++ +title = "Creating a Commit" +time = 25 +[tasks] +1 = "Initialize a new Git repository" +2 = "Create and modify files in your repository" +3 = "Stage changes for commit" +4 = "Create your first commit" +5 = "View your commit history" +[build] + render = 'never' + list = 'local' + publishResources = false ++++ + +A **commit** is a saved version of your project at a particular moment in time. Think of it like saving a document, but with a detailed message explaining what changed and why. + +## Understanding the Three States + +Git has three states for your files: + +1. **Modified** - You changed the file, but haven't saved the version yet +2. **Staged** - You've marked the file as ready to be saved +3. **Committed** - The file is now saved in Git history + +``` +Working Directory → Staging Area → Git Repository + (Modified) (Staged) (Committed) +``` + +## Step 1: Create a New Repository + +A repository is a folder where Git tracks all your files and their changes. + +1. Create a new folder for your project: + ``` + mkdir my-first-project + cd my-first-project + ``` + +2. Initialize Git in this folder: + ``` + git init + ``` + +You should see: "Initialized empty Git repository" + +{{}} +1. Open your terminal +2. Navigate to your Documents or Desktop folder +3. Run the commands above +4. You've created your first Git repository! 🎉 +{{}} + +## Step 2: Create a File and Make Changes + +Let's create a simple text file: + +1. In VSCode, create a new file called `notes.txt` +2. Add some text: + ``` + My First Git Project + + Today I'm learning Git! + This is my first commit. + ``` +3. Save the file + +## Step 3: Check the Status of Your Repository + +Before making a commit, let's see what Git sees: + +``` +git status +``` + +You should see output like: +``` +On branch main + +No commits yet + +Untracked files: + (use "git add ..." to include in what will be committed) + notes.txt + +nothing added to commit but untracked files present +``` + +Git is saying: "I see a file called `notes.txt`, but you haven't told me to track it yet." + +## Step 4: Stage Your Changes + +Now we tell Git we want to save this file. This is called **staging**: + +``` +git add notes.txt +``` + +You can also stage all files at once: +``` +git add . +``` + +Check the status again: +``` +git status +``` + +Now you should see: +``` +Changes to be committed: + (use "git rm --cached ..." to unstage) + new file: notes.txt +``` + +Git is saying: "I'm ready to save this file. Are you sure?" + +## Step 5: Create Your First Commit + +Now we actually save the version: + +``` +git commit -m "Add initial project notes" +``` + +The `-m` flag means "message". The message describes what you changed. + +{{}} +Write messages that explain **what** you changed and **why**: +- ✅ Good: "Add login button to homepage" +- ✅ Good: "Fix bug where users can't save files" +- ❌ Avoid: "stuff", "changes", "update" + +Keep messages short but clear (under 50 characters is ideal). +{{}} + +## Step 6: View Your Commit History + +See all the commits in your repository: + +``` +git log +``` + +You should see your commit with: +- Your name and email +- The date and time +- Your commit message + +Press `q` to exit the log. + +## Workflow Summary + +Here's the complete workflow for making commits: + +1. **Modify files** in your editor +2. **Check status**: `git status` +3. **Stage changes**: `git add .` +4. **Create commit**: `git commit -m "Your message"` +5. **View history**: `git log` + +{{}} +1. Create a new file called `planning.txt` +2. Add some text to it +3. Save it +4. Run: `git add planning.txt` +5. Run: `git commit -m "Add project planning document"` +6. Run: `git log` to see both commits +{{}} + +## Common Commands + +| Command | What it does | +|---------|------------| +| `git status` | Shows which files have changed | +| `git add ` | Stages a specific file | +| `git add .` | Stages all changed files | +| `git commit -m "message"` | Creates a commit with a message | +| `git log` | Shows all commits in order | +| `git diff` | Shows exactly what changed in files | + +## Further Reading + +- [Atlassian - Git Commit](https://www.atlassian.com/git/tutorials/saving-changes/git-commit) +- [GitHub Docs - Recording Changes](https://docs.github.com/en/get-started/using-git/about-git) +``` \ No newline at end of file diff --git a/org-cyf/content/itp/welcome/backlog/index.md b/org-cyf/content/itp/welcome/backlog/index.md index cb46b25b9..745241223 100644 --- a/org-cyf/content/itp/welcome/backlog/index.md +++ b/org-cyf/content/itp/welcome/backlog/index.md @@ -6,4 +6,16 @@ menu_level = ["module"] weight = 2 backlog = "Module-Welcome" backlog_filter = "📅 Sprint 1" -+++ +[[blocks]] +name="Configuring Git with VSCode" +src="module/induction/git-vscode-config" +[[blocks]] +name="Creating a Commit" +src="module/induction/git-creating-commit" +[[blocks]] +name="Remote Repositories" +src="module/induction/git-remote-repositories" +[[blocks]] +name="Pushing & Pulling" +src="module/induction/git-pushing-pulling" ++++ \ No newline at end of file diff --git a/org-cyf/content/itp/welcome/backlog/pushing-and-pulling/index.md b/org-cyf/content/itp/welcome/backlog/pushing-and-pulling/index.md new file mode 100644 index 000000000..5a5919662 --- /dev/null +++ b/org-cyf/content/itp/welcome/backlog/pushing-and-pulling/index.md @@ -0,0 +1,186 @@ ++++ +title = "Pushing & Pulling" +time = 25 +[tasks] +1 = "Push your commits to GitHub" +2 = "View your commits on GitHub" +3 = "Make changes and push again" +4 = "Understand pull and push workflow" +[build] + render = 'never' + list = 'local' + publishResources = false ++++ + +Now that your local and remote repositories are connected, you need to learn how to synchronize them. **Pushing** sends your local commits to GitHub, and **pulling** gets updates from GitHub. + +## The Git Workflow + +``` +1. Make changes locally + ↓ +2. Commit changes + ↓ +3. Push to GitHub + ↓ +4. Your code is now on GitHub! +``` + +## Step 1: Push Your Commits to GitHub + +You have commits on your local machine, but they're not on GitHub yet. Let's send them: + +``` +git push -u origin main +``` + +What does this mean? +- `git push` - Send commits to a remote +- `-u` - Set up tracking (remember this remote/branch combo) +- `origin` - Push to the remote named "origin" (GitHub) +- `main` - Push to the "main" branch + +You might be asked to authenticate. Follow GitHub's instructions. + +{{}} +The `-u` flag is only needed the first time. After that, you can just type: `git push` +{{}} + +## Step 2: View Your Code on GitHub + +1. Go to your repository on GitHub (https://github.com/YOUR-USERNAME/my-first-project) +2. You should see your files! +3. Click on a file to view its contents +4. Click the "History" button (clock icon) to see commits + +Congratulations! Your code is now on GitHub and you have a portfolio piece! 🎉 + +## Step 3: Make Changes and Push Again + +The workflow for subsequent changes is simpler: + +1. Modify a file (e.g., add more text to `notes.txt`) +2. Commit the change: + ``` + git add notes.txt + git commit -m "Update project notes" + ``` +3. Push to GitHub: + ``` + git push + ``` + +That's it! Your changes are now on GitHub. + +{{}} +1. Open `planning.txt` in VSCode +2. Add more content to it +3. Save the file +4. Run: `git add planning.txt` +5. Run: `git commit -m "Expand project planning"` +6. Run: `git push` +7. Go to GitHub and refresh to see your changes! +{{}} + +## Understanding Push and Pull + +### Push (Send to GitHub) + +``` +Your Computer (local) GitHub (remote) + Commits ──push──→ Commits + (backup) +``` + +When you push, GitHub gets a copy of your commits. + +### Pull (Get from GitHub) + +``` +Your Computer (local) GitHub (remote) + Commits ←─pull──── Commits + (updates) +``` + +When you pull, you get any commits that were made on GitHub (or by teammates). + +{{}} +In a team project, other developers might push commits to GitHub. You need to pull regularly to keep your local copy up to date. +{{}} + +## Complete Workflow Example + +Here's a day in the life of a developer: + +``` +Morning: +1. git pull (get latest from team) + +During the day (multiple times): +2. Make changes +3. git add . +4. git commit -m "description" +5. git push (share with team) + +Before leaving: +6. git push (make sure everything is saved) +``` + +## Troubleshooting + +**"Nothing to push"** +You have no new commits. This is fine! It means your local and remote are in sync. + +**"Rejected"** +This usually means someone else pushed changes. Run `git pull` first, then `git push`. + +**"Permission denied"** +Check that you're logged into the right GitHub account. + +## Common Commands + +| Command | What it does | +|---------|------------| +| `git push` | Send commits to GitHub | +| `git pull` | Get commits from GitHub | +| `git status` | Check if local and remote are in sync | +| `git log` | See all commits | +| `git fetch` | Check for updates without merging | + +## The Complete Git Journey + +You now know: +- ✅ How to configure Git +- ✅ How to make commits (save versions) +- ✅ How to connect to GitHub (remote) +- ✅ How to push commits to GitHub +- ✅ How to pull updates from GitHub + +**You're ready to:** +- Build projects and track changes +- Share code with others +- Build a portfolio on GitHub +- Work in teams + +## Common Mistakes to Avoid + +1. **Forgetting to push** - Your commits are local only, not on GitHub +2. **Forgetting to commit** - You made changes but didn't save the version +3. **Wrong branch** - Always check you're on "main" with `git branch` +4. **Large files** - Don't commit videos, databases, or node_modules +5. **Secrets** - Never commit passwords or API keys + +## What to Practice + +1. Create 3-5 small projects locally +2. Push each one to GitHub +3. Make changes and push again +4. Get comfortable with the push/pull workflow + +## Further Reading + +- [Atlassian - Git Push](https://www.atlassian.com/git/tutorials/syncing/git-push) +- [Atlassian - Git Pull](https://www.atlassian.com/git/tutorials/syncing/git-pull) +- [GitHub Docs - Pushing Commits](https://docs.github.com/en/get-started/using-git/pushing-commits-to-a-remote-repository) +- [GitHub Docs - Pulling Changes](https://docs.github.com/en/get-started/using-git/getting-changes-from-a-remote-repository) +``` \ No newline at end of file diff --git a/org-cyf/content/itp/welcome/backlog/remote-repositories/index.md b/org-cyf/content/itp/welcome/backlog/remote-repositories/index.md new file mode 100644 index 000000000..e108be663 --- /dev/null +++ b/org-cyf/content/itp/welcome/backlog/remote-repositories/index.md @@ -0,0 +1,135 @@ ++++ +title = "Remote Repositories" +time = 20 +[tasks] +1 = "Understand what a remote repository is" +2 = "Create a new repository on GitHub" +3 = "Connect your local repository to GitHub" +4 = "Verify the connection" +[build] + render = 'never' + list = 'local' + publishResources = false ++++ + +So far, your commits are saved on your computer. A **remote repository** is a copy of your project stored on a server (like GitHub), so others can access it and you have a backup. + +## Why Use Remote Repositories? + +1. **Backup** - Your code is safe on GitHub's servers +2. **Collaboration** - Other developers can access your code +3. **Portfolio** - Employers can see your work on your GitHub profile +4. **Team projects** - Work together on the same codebase + +## Local vs Remote + +``` +Your Computer GitHub Server +┌─────────────────────┐ ┌──────────────────┐ +│ Local Repository │ │ Remote Repository │ +│ (your commits) │ ← │ (backup) │ +└─────────────────────┘ → └──────────────────┘ + "pull" "push" +``` + +## Step 1: Create a Repository on GitHub + +1. Go to [https://github.com](https://github.com) +2. Click the **+** icon in the top right +3. Select **"New repository"** +4. Give it a name (e.g., `my-first-project`) +5. Add a description (optional) +6. Choose **"Public"** (so your portfolio is visible) +7. **Don't** initialize with README, .gitignore, or license +8. Click **"Create repository"** + +{{}} +If you initialize with files on GitHub, your local and remote repositories will be different, which causes conflicts. Since we already have commits locally, we'll connect them directly. +{{}} + +## Step 2: Add the Remote Connection + +GitHub will show you a page with instructions. You need to tell your local Git about this remote repository. + +In your terminal, run: + +``` +git remote add origin https://github.com/YOUR-USERNAME/my-first-project.git +``` + +Replace `YOUR-USERNAME` with your GitHub username and `my-first-project` with your repository name. + +**What does this do?** +- `git remote add` - Add a new remote +- `origin` - The name of the remote (default name) +- The URL - Where the remote repository lives + +## Step 3: Verify the Connection + +Check that the connection was made: + +``` +git remote -v +``` + +You should see: +``` +origin https://github.com/YOUR-USERNAME/my-first-project.git (fetch) +origin https://github.com/YOUR-USERNAME/my-first-project.git (push) +``` + +This means your local repository knows how to reach GitHub! + +## Step 4: Set Your Default Branch + +By default, Git uses "main" as the primary branch. Let's set this: + +``` +git branch -M main +``` + +## Understanding "origin" and "main" + +- **origin** - The name of your remote repository (GitHub) +- **main** - The name of your default branch (like the main storyline of your project) + +Think of it like: +- You have a story (your project) +- It lives in two places: Your notebook (local) and a backup server (origin/main) + +{{}} +A branch is like an alternative version of your project. Most projects have a "main" branch (the stable version) and feature branches (experimental versions). For now, you'll only use "main". +{{}} + +## Checking Your Remote + +If you ever want to see details about your remote: + +``` +git remote show origin +``` + +## What's Next? + +Now that your repositories are connected, you're ready to: +- **Push** - Send your local commits to GitHub +- **Pull** - Get updates from GitHub +- **Collaborate** - Work with other developers + +You'll learn these in the next module! + +## Common Commands + +| Command | What it does | +|---------|------------| +| `git remote add origin ` | Connect local repo to GitHub | +| `git remote -v` | Show all remote connections | +| `git remote show origin` | Show details about origin | +| `git branch -M main` | Set main as default branch | + +## Further Reading + +- [GitHub Docs - Adding a Repository](https://docs.github.com/en/migrations/importing-your-projects-to-github/importing-a-repository-with-github-importer) +- [Atlassian - Git Remote](https://www.atlassian.com/git/tutorials/syncing) +- [GitHub Docs - Managing Remote Repositories](https://docs.github.com/en/get-started/getting-started-with-git/managing-remote-repositories) +``` \ No newline at end of file