DEV Community

Cover image for Git: From Zero to First Commit - Developer Journey Begins
swathi m
swathi m

Posted on

Git: From Zero to First Commit - Developer Journey Begins

Imagine you’ve joined a fintech startup in Bangalore. Your team is building a mobile payment app that must be super reliable. On your first day, your manager says:

“Set up Git and make your first commit. This is how we track every line of code in our project.”

You’re new, so let’s walk through step by step, with each Git command explained clearly.


Step 1: Installing Git

Before anything, you need Git installed.

Windows:
Download Git for Windows → run installer → open Git Bash.
Or, if you like terminals:

winget install --id Git.Git -e 
Enter fullscreen mode Exit fullscreen mode

macOS:

brew install git # using Homebrew # OR xcode-select --install 
Enter fullscreen mode Exit fullscreen mode

Linux (Ubuntu/Debian):

sudo apt update sudo apt install git 
Enter fullscreen mode Exit fullscreen mode

Verify:

git --version 
Enter fullscreen mode Exit fullscreen mode

If it shows git version 2.x.x, you’re ready!


Step 2: Tell Git Who You Are

Every time you commit, Git saves your name and email. This helps teams know who made what change.

git config --global user.name "Ravi Kumar" git config --global user.email "ravi@example.com" 
Enter fullscreen mode Exit fullscreen mode

First, what is git config?

  • git → is the tool we’re using (the version control system).
  • config → stands for configuration → basically “settings” for Git.

So, git config = “Hey Git, I want to set or change your settings.”
Check settings:

  • --global tells Git: “Apply this setting everywhere on this computer, for all my Git projects.”

Without --global, Git would only apply the setting to one specific project.

Example:
If Ravi works on 5 different projects on his laptop, setting --global means Git knows who he is in all those projects, not just one.

What are user.name and user.email?

Every time you commit (save a snapshot in Git), Git records:
• Who made the change (user.name)
• Their email address (user.email)

So in the future, anyone looking at the project can see:

Author: Ravi Kumar <ravi@example.com>
Date: Tue Sep 17 2025
Message: Added Forgot Password button

This is like signing your name when you make an edit.

git config --list 
Enter fullscreen mode Exit fullscreen mode

This command asks Git: “Show me all the settings (configuration) you currently know about.”

In real teams, this is critical. If Ravi breaks the login, everyone knows who to call.


Step 3: Create a Project and Initialize Git

Let’s say your team is starting the “banking-web” service.

mkdir banking-web && cd banking-web git init 
Enter fullscreen mode Exit fullscreen mode

mkdir → Stands for make directory.
A directory is just another word for a folder.
So this command means: “Create a new folder called banking-web here.”

Think of it like going to your desktop, right-clicking, and choosing:
New Folder → Name it banking-web

cd → Stands for change directory.
It tells the terminal: “Go inside the folder I just created.”

So now, Ravi’s “current location” is inside the banking-web folder.
(Just like double-clicking the folder in File Explorer/Finder to open it).

&&

This is a little trick:
• && means → “Run the next command only if the previous one worked successfully.”

So here:
1. Make the folder (mkdir banking-web)
2. If that succeeds, go inside it (cd banking-web).

All in one line.

git init

Now the magic:

  • git init → Initializes a brand-new Git repository inside the current folder.
  • It creates a hidden folder called .git/ inside banking-web.
  • That .git/ folder stores: Commit history Branches Configurations Basically, the brain of Git for this project.

Without git init, your folder is just a normal folder.
With git init, your folder is now tracked by Git → every change can be saved, reverted, or collaborated on.

Putting it all together

With just these two lines:
mkdir banking-web && cd banking-web
git init

We are saying:
1. Create a new project folder called banking-web.
2. Go inside it.
3. Turn it into a Git project (so changes are tracked).

So, in simple words:
mkdir + cd = Create a workspace.
git init = Tell Git, “Hey, start tracking everything I do in this workspace.”


Step 4: Create a File

You create your first file:

echo "# Banking Web App" > README.md 
Enter fullscreen mode Exit fullscreen mode
  • echo is a command that simply prints text to the screen.
    So here, echo "# Banking Web App" means: Print the text # Banking Web App.

  • ( > Redirection operator)

Normally, echo just shows text on the screen. But the > symbol redirects the output into a file.

">" means → “Don’t show it on the screen. Instead, put it inside this file.”

If the file doesn’t exist → it creates it. If the file already exists → it overwrites it.

  • README.md is the first file people usually see in a project. .md means Markdown file — a lightweight format for writing text with headings, bold, lists, etc.

The # in Markdown means → Heading 1. So # Banking Web App will render as a big heading: Banking Web App

We are saying:
1. Use echo to print the text # Banking Web App.
2. Redirect (>) that text into a new file called README.md.

So after running this command:
• A file named README.md will be created in the folder.
• Its contents will be:

So, this command creates a new README file with the heading: Banking Web App

Now check what Git thinks:

git status 
Enter fullscreen mode Exit fullscreen mode

Output:

Untracked files: README.md 
Enter fullscreen mode Exit fullscreen mode

Why “Untracked”?
Because Git sees the file exists but isn’t tracking it yet.

  • Untracked = new file not added to Git.

Step 5: Stage the File

You decide: “Yes, I want to save README.md in Git.”
So you stage it:

git add README.md 
Enter fullscreen mode Exit fullscreen mode

It means: “Hey Git, please include this file in the next save (commit)

Now check again:

git status 
Enter fullscreen mode Exit fullscreen mode

Output:

Changes to be committed: new file: README.md 
Enter fullscreen mode Exit fullscreen mode

The staging area is like a shopping basket — you select exactly what changes to save in the next commit.


Step 6: Commit the File

Now you save this snapshot in Git’s history:

git commit -m "Initial commit: add README" 
Enter fullscreen mode Exit fullscreen mode
  • git commit → tells Git: “Save a snapshot of everything in the staging area.”

  • -m → means “message”.

Instead of opening an editor, you give the commit a description right here in quotes.
"Initial commit: add README" → your description.
This is what shows up in the history when people look at the project later.

In a real company, every commit tells a story:
• Who made it.
• What changed.
• When it happened.


Step 7: See Your Commit

Check the history:

git log --oneline 
Enter fullscreen mode Exit fullscreen mode

git log = shows the history of commits (snapshots) in your project.

--oneline flag makes the history short and simple:
•Only shows:
• Short commit ID (first 7 characters of the hash)
• Commit message

Output:

c1a2b3c Initial commit: add README 
Enter fullscreen mode Exit fullscreen mode

That’s your first snapshot — forever in history.


Step 8: Make a Change

A week later, you add a “Forgot Password” link on the login page.

mkdir src echo '<a href="/forgot-password">Forgot Password?</a>' > src/login.html 
Enter fullscreen mode Exit fullscreen mode

Check status:

git status 
Enter fullscreen mode Exit fullscreen mode

Output:

Untracked files: src/login.html 
Enter fullscreen mode Exit fullscreen mode

Stage it:

git add src/login.html 
Enter fullscreen mode Exit fullscreen mode

Commit it:

git commit -m "Add Forgot Password link on login page" 
Enter fullscreen mode Exit fullscreen mode

Now your repo has two commits:
1. Add README
2. Add Forgot Password link


Step 9: Understand File States in Git

Here’s the file lifecycle you just experienced:
1. Untracked → file exists, not added to Git.
2. Staged → selected for commit (git add).
3. Committed → permanently saved in history (git commit).
4. Modified → file was edited after commit but not yet staged.

Check with:

git status 
Enter fullscreen mode Exit fullscreen mode

This simple command is your best friend — it tells you exactly where you are.


Step 10: Ignore Junk Files

In real IT projects, you don’t want logs, caches, or personal notes in Git.

Create .gitignore:

echo "node_modules/\n*.log\n.env" > .gitignore git add .gitignore git commit -m "Add .gitignore for temp files" 
Enter fullscreen mode Exit fullscreen mode

Step 11: Local vs Remote

Right now, everything is local ( i.e exists only on your laptop ). But teams work together using a remote repository (GitHub, GitLab, Bitbucket).
Solution → Remote repository. This is like a shared cloud backup on GitHub/GitLab.

Connect to remote:

git remote add origin https://git hub.com/acme/banking-web.git git branch -M master git push -u origin master 
Enter fullscreen mode Exit fullscreen mode

git remote add origin https: //git hub.com// .. //banking-web.git

  • git remote add → means “connect my local repo to another repo on a server”.
  • origin → is the nickname (alias) for the remote repo.
  • By convention, the main remote is always called origin.
  • https: //git hub.com// .. //banking-web.git → the URL of the GitHub repository.

Think of it like: “Tell my laptop: this project also lives on GitHub at this address.”

git branch -M master

  • git branch -M → renames the current branch (forcefully if needed).
  • By default, your branch might be called main (new Git versions) or master (older versions).

This makes sure both local and remote use the same branch name.

git push -u origin master

  • git push → upload commits from your local repo → to the remote repo.
  • origin → the remote repo nickname.
  • master → the branch you are pushing.
  • -u (set upstream) → tells Git:
  • “From now on, when I type git push or git pull without extra arguments, use origin/master by default.”

This is the first time you’re sending your project to GitHub.

Now Ravi, Priya, and Neha can git clone and work together.

The repo now lives on both your laptop and GitHub.
Your teammates don’t need your laptop — they can just run:

git clone https://github.com/acme/banking-web.git

Now they have their own local copy of the repo.


Your Git Journey Today
• git init → Start a repo.
• git status → See what’s happening.
• git add → Stage files.
• git commit -m "msg" → Save snapshot.
• .gitignore → Keep junk out.
• git log --oneline → Review history.
• git push → Share with team.


Example

Each dev creates commits, pushes to the remote, and pulls each other’s changes.

Without Git, files would get overwritten. With Git, everything is tracked, reversible, and collaborative.


NOTE:

Think of Git as having three areas:

Working Directory

  • Where you actually create or edit files. (e.g., editing README.md in VS Code)

Staging Area (Index)

  • A basket where you collect files you want to save in the next snapshot.

Repository (Commits)

  • The permanent history of your project (inside .git/).

Conclusion

Git isn’t just a tool, it’s your time machine and safety net. Every change is saved, nothing is lost, and teamwork becomes smooth.

On day one at your job, if you know just these commands, you’ll already feel like part of the dev team.

Top comments (3)

Collapse
 
swathi_macha profile image
swathi m • Edited

@techytony, Thank you so much, really glad you found it helpful..

When you save code with Git, it lives in 2 places: Local and Remote.

  1. Local Repository (on your computer)
    When you run commands like git add and git commit, Git saves your changes inside a hidden .git folder in your project directory.
    Here, the code is tracked by Git but it’s only available on your machine.

  2. Remote Repository (likee GitHub, GitLab, Bitbucket)
    When you run git push, Git sends those commits from your local repository to a remote server. This is how you share your work with teammates.

Until you push, GitHub doesn’t know about your changes, they live only on your laptop.

Collapse
 
techytony profile image
Anthony Jackson

Thanks for the reply! This is perfectly epxlained!

Collapse
 
techytony profile image
Anthony Jackson

This is super helpful 🚀

I have a question:

When you save code in git, let's just use a basic HTML boilerplate as an example here. Is the code saved in its git "repository" or is it not officially saved until it's pushed to GitHub?

I guess I'm confused about where this code is saved. Is it locally a remote server? Any breakdown here is appreciated

Great beginners post!