Learn Git and GitHub: Step-by-Step Version Control in 30 Minutes

Learn the essentials of Git and GitHub in just 30 minutes. This tutorial guides you through setup, creating repositories, making commits, and pushing changes. Optimize your development workflow and collaborate efficiently.

Git und GitHub lernen: Versionskontrolle Schritt für Schritt in 30 Minuten
  • SkillTandem Team
  • 0 Comments
  • 8 min read

⏱ Estimated Time: 30 Minutes | 🎯 Level: Beginner

Your Gateway to Version Control: Mastering Git and GitHub

In short: This tutorial will teach you how to install Git locally, initialize your first project, track changes, and securely store them on GitHub. You'll understand how version control works and how to effectively manage and share your code projects with it.


1. Problem/Goal – What You'll Achieve After This Tutorial

Many developers, especially beginners, struggle with organizing their code, tracking changes, or collaborating in teams. Without a version control system, crucial code versions can be lost, changes might overwrite each other, or collaboration can become chaotic. After this tutorial, you will be able to:

  • Install and configure Git on your system.
  • Create and manage a local Git repository.
  • Track changes to your code and save them with meaningful commits.
  • Create a GitHub repository and push your local changes to it.
  • Understand and confidently apply the basics of version control.

2. Prerequisites & Time Commitment

2.1. What you'll need:

  • A computer with internet access.
  • A GitHub account (free).
  • A text editor of your choice (e.g., VS Code, Sublime Text, Notepad++).
  • A terminal or command prompt.

2.2. Time Commitment:

Plan about 30 minutes for installation, configuration, and working through the steps. If you dive deep into the practical exercise, it might take up to 45 minutes.


3. Step-by-Step Guide: Your First Git Project on GitHub

3.1. Install Git

First, you need to install Git on your system. Visit the official Git website and download the appropriate version for your operating system.

Windows: Download the installer from git-scm.com/download/win and follow the instructions. Default settings are usually sufficient.

macOS: Open your terminal and type:


xcode-select --install

Or download the installer from git-scm.com/download/mac.

Linux (Debian/Ubuntu): Open your terminal and type:


sudo apt update
sudo apt install git

Verification: Check if Git is installed correctly by typing in your terminal:


git --version

You should see the installed Git version, e.g., git version 2.34.1.

3.2. Configure Git

Before using Git, you need to configure your name and email address. This information will be stored with each of your commits.


git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"
Tip: Use the same email address linked to your GitHub account to ensure commits are properly attributed.

3.3. Create a New Local Repository

Create a new folder for your project and navigate into it using your terminal.


mkdir my-first-git-project
cd my-first-git-project

Then, initialize a new Git repository:


git init

You should see a message like Initialized empty Git repository in /path/to/my-first-git-project/.git/.

3.4. Add Files and Make Your First Commit

Create a simple text file in your project folder, e.g., README.md, with the following content:


# My First Git Project

This is a test project to learn Git and GitHub.

Check the status of your repository:


git status

You should see README.md listed as an 'untracked file'.

Add the file to the staging area:


git add README.md

Check the status again:


git status

Now, README.md should be listed as a 'new file' in the staging area.

Make your first commit:


git commit -m "Initial commit: Added README.md"

The -m flag stands for 'message'. The commit message should be concise and descriptive.

3.5. Create a GitHub Repository

Go to github.com, log in, and click the '+' symbol in the top right -> 'New repository'.

  • Repository name: my-first-git-project
  • Description: (Optional) My first project to learn Git and GitHub.
  • Choose Public or Private.
  • IMPORTANT: Do NOT check 'Add a README file', 'Add .gitignore', or 'Choose a license', as we are creating these files locally.

Click 'Create repository'.

After creation, you'll see a page with instructions. Copy the lines under '…or push an existing repository from the command line'. They should look similar to this:


git remote add origin https://github.com/YOUR_USERNAME/my-first-git-project.git
git branch -M main
git push -u origin main

3.6. Connect Local Repository to GitHub and Push

Add the remote GitHub repository as 'origin' to your local repository. Replace YOUR_USERNAME with your actual GitHub username.


git remote add origin https://github.com/YOUR_USERNAME/my-first-git-project.git

Rename the default branch to 'main' (if it's still 'master'):


git branch -M main

Push your local commits to the GitHub repository:


git push -u origin main

You might be prompted to enter your GitHub credentials. Use a Personal Access Token (PAT) if password authentication no longer works (GitHub has deprecated password authentication for Git operations).

3.7. Make Changes and Push Again

Edit the README.md file or create a new file, e.g., index.html with the following content:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First HTML</title>
</head>
<body>
    <h1>Welcome to my project!</h1>
    <p>This page is versioned with Git.</p>
</body>
</html>

Add the changes and commit them:


git add .
# The dot '.' adds all modified and new files
git commit -m "Feature: Added index.html and updated README"

Push the new commits to GitHub:


git push

Refresh your GitHub repository page in your browser to see the new files and commits.


Practical Exercise: Add Another File and Commit Changes

Now it's your turn! Create a third file and experiment with Git commands.

  1. Create a new file: Create a file named style.css in your project folder with the following content:
    
    body {
        font-family: Arial, sans-serif;
        background-color: #f0f0f0;
        color: #333;
    }
    
  2. Add file to Git: Use git add style.css to stage the new file for commit.
  3. Check status: Type git status to ensure style.css is in the staging area.
  4. Commit: Create a descriptive commit with git commit -m "Style: Added style.css".
  5. Push: Upload your changes to GitHub using git push.
  6. Verify result: Visit your GitHub repository in your browser and confirm that style.css is visible there.

4. Common Errors & Solutions

  1. Error: fatal: not a git repository (or any of the parent directories): .git
    Solution: You are not in the correct folder. Navigate to the project folder where you ran git init using cd, or run git init in the current folder if you haven't created a repository yet.
  2. Error: fatal: remote origin already exists. when running git remote add origin ...
    Solution: You have already added the 'origin' remote. You can either remove it (git remote remove origin) and then add it again, or proceed directly with git push -u origin main.
  3. Error: Authentication failed for 'https://github.com/...' when pushing.
    Solution: GitHub no longer accepts passwords for Git operations. You must use a Personal Access Token (PAT). Go to GitHub Settings > Developer settings > Personal access tokens > Tokens (classic) > Generate new token. Give the token the necessary permissions (at least 'repo'). When you push, enter the PAT instead of your password.
  4. Error: Files are not appearing on GitHub even though git push was successful.
    Solution: Did you actually add the files (git add .) and commit them (git commit -m "Message") before pushing? Only committed changes are uploaded. Check with git status.

5. Conclusion: Your Path into the World of Version Control

Congratulations! You have successfully learned the basics of Git and GitHub and versioned your first project. You can now track changes, create commits, and share your work on GitHub. This is a fundamental step for anyone working with code, whether alone or in a team.

Version control is a powerful tool that helps you fix errors, restore old versions, and collaborate efficiently with others. Keep exploring and experimenting!

Next Steps & Further Topics:


Find Your Tech Mentor or Coding Buddy on Skill Tandem

The world of technology is vast and constantly evolving. Sometimes, you just need support or a sparring partner. On Skill Tandem (skilltandem.app), you'll find a completely free community platform where you can connect with like-minded tech enthusiasts. Whether you're looking for a mentor for Git and GitHub, a coding buddy for your next project, or someone to explain the intricacies of cloud computing – you'll find them with us.

Skill Tandem is the ideal place to share your knowledge, learn from others, and collectively work on your skills. It's the perfect complement to solidify the knowledge gained here and apply it to real-world projects.

Sign up for free and find your tech learning partner today!


FAQ: Frequently Asked Questions about Git and GitHub

What is the difference between Git and GitHub?

Git is a distributed version control system that runs on your local computer, allowing you to track changes to your code. GitHub, on the other hand, is a web-based hosting platform for Git repositories, facilitating collaboration and providing a graphical interface for managing your projects.

Why should I use Git and GitHub?

Git and GitHub are indispensable for modern software development. They enable you to version changes to your code, revert to old versions, collaborate efficiently with other developers, conduct code reviews, and host your projects publicly or privately.

Is GitHub free?

Yes, GitHub offers a free tier that allows you to create public and private repositories and use most basic features. For advanced team and enterprise features, there are paid plans.

Can I use Git without GitHub?

Yes, you can use Git entirely locally to version your projects without hosting them on GitHub or any other remote platform. GitHub is an addition to Git that facilitates collaboration and hosting but is not strictly necessary to use Git.

0 Comments

No comments yet. Be the first to write something! 🎉

Write a comment

Your email address will not be published.