Module 4
4.3: Git & Github
Basic Git Workflow
Basic Git Workflow
Embedded Files
Here’s a quick overview of how Git works with GitHub:
1. Create a Folder for Your Project
1. Create a Folder for Your Project
Before we start using Git, we need to create a folder for our project:
Create a Folder:
Go to your Desktop.
Right-click and choose New > Folder.
Name the folder: SMU (or any name you prefer).
2. Open Git Bash and Navigate to Your Folder
2. Open Git Bash and Navigate to Your Folder
Once the folder is created, you will use Git Bash to interact with Git.
Open Git Bash on your computer. If you don't have it installed yet, you can download it here.
In Git Bash, navigate to the SMU folder you just created by using the cd (change directory) command.
cd /Desktop/SMU
Explanation:
cd stands for change directory. It moves you into the folder you want to work with.
The ~/Desktop/SMU path specifies where the folder is located (on your Desktop).
3. Initialize a Git Repository
3. Initialize a Git Repository
Now, let's turn the folder into a Git repository so we can track changes in the files.
Run this command in Git Bash:
git init
Explanation:
git init initializes a new Git repository in the folder.
It creates a hidden .git folder that Git uses to track changes in your project.
4. Create a File to Track
4. Create a File to Track
Next, we need to create a file that Git will track. Let's make an index.html file.
Inside the SMU folder, right-click and choose New > Text Document.
Name it: index.html.
Open the index.html file and add this HTML content:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My First Git Project</title>
</head>
<body>
<h1>Hello Git! From SMU CS Club</h1>
</body>
</html>
Save and close the file.
5. Check Git Status
5. Check Git Status
Now, let's see what Git sees in the folder.
Run this command:
git status
Explanation:
git status shows the current state of your Git repository.
It will show that your index.html file is untracked (because we haven't added it to Git yet).
6. Add the File to Git (Stage the File)
6. Add the File to Git (Stage the File)
Before we can save the file in Git’s history, we need to stage it.
Run this command to add the index.html file to the staging area:
git add index.html
Explanation:
git add stages the file, meaning it tells Git: "I want to track changes to this file."
This is the step where Git prepares files for committing.
7. Commit the File (Save the Changes)
7. Commit the File (Save the Changes)
Next, we will commit the staged file. This means that Git will take a snapshot of your index.html file and save it to the project’s history.
Run this command:
git commit -m "Initial commit - added index.html"
Explanation:
git commit saves the changes to the Git history.
-m allows you to add a commit message. The message should briefly describe what changes were made (in this case, we added index.html).
After this step, your project now has a commit — the first saved version of your code!
Updating Your Git Repository After Making Changes
Now that you've successfully committed your changes to Git, let’s go over what to do every time you make updates to your project files. This will be the process for managing your files and pushing the changes to GitHub.
Step 1: Make Changes to Your Files
Step 1: Make Changes to Your Files
Let’s say you’ve made some updates to your index.html file. Open it in your editor and modify the content. For example, you could add another heading or change some text inside the body.
Step 2: Check the Status of Your Git Repository
Step 2: Check the Status of Your Git Repository
After you make some changes, the first thing you need to do is check the status of your Git repository to see which files have been modified.
Run the following command in Git Bash:
git status
Explanation:
git status will show you the current state of your repository.
It will highlight the modified files (like index.html in this case) and tell you if those files are staged or unstaged for commit.
Step 3: Add Changes to the Staging Area
Step 3: Add Changes to the Staging Area
Once you see that the file has been modified (shown as modified in the git status output), you need to add it to the staging area, telling Git that you want to track these changes.
Run the following command:
git add index.html
Explanation:
git add stages the file for commit. This means that Git is now aware of the changes you made to index.html and is ready to include them in the next commit.
Step 4: Commit the Changes
Step 4: Commit the Changes
Now that you’ve added the file to the staging area, it's time to commit your changes. This saves the changes to your Git history.
Run the following command:
git commit -m "Updated index.html - added a new heading"
Explanation:
git commit -m creates a snapshot of the changes in the repository.
The -m option allows you to add a commit message. This should briefly describe what changes you made. In this example, we added a new heading to the index.html file.
_____________________________________________________________________________________________
Repeat the Process
Repeat the Process
From now on, every time you make changes to your files, follow these steps to keep your repository updated:
Make Changes to your files.
Check Status with git status to see the modified files.
Add the Changes with git add <file-name>.
Commit the Changes with a descriptive message using git commit -m "message".
Here is the video demo:-
On the video, he uses the vi command, which is used to edit the file on our terminal, we can edit the file manually by opening it.
Page updated
Google Sites
Report abuse